From 71a270137a4d6bce1977a22e50856fa7f7551ad5 Mon Sep 17 00:00:00 2001
From: apapachristou <apapachristou@cite.gr>
Date: Thu, 8 Oct 2020 23:27:47 +0300
Subject: [PATCH] Fixes flag image scale on contributors page (to be tested)

---
 .../ui/dmp/listing/dmp-listing.component.html |  1 -
 .../src/assets/splash/about/contributors.html | 30 +++++++++++++++----
 dmp-frontend/src/assets/splash/css/styles.css | 20 +++++++++++--
 3 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html b/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
index ebc2b9c65..bc63cd1bb 100644
--- a/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
+++ b/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
@@ -14,7 +14,6 @@
 				</div>
 			</div>
 			<p *ngIf="listingItems && listingItems.length > 0" class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
-			<!-- <div *ngIf="listingItems && listingItems.length > 0" class="filter-btn" [style.right]="this.dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar ? '57px' : '37px'" (click)="openFiltersDialog()"> -->
 			<div class="filter-btn" [style.right]="this.dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar || this.dialog.getDialogById('filters') ? '57px' : '37px'" (click)="openFiltersDialog()">
 				<button mat-raised-button class="p-0">
 					<mat-icon class="mr-4">filter_alt</mat-icon>
diff --git a/dmp-frontend/src/assets/splash/about/contributors.html b/dmp-frontend/src/assets/splash/about/contributors.html
index e13aac0c2..53f483731 100644
--- a/dmp-frontend/src/assets/splash/about/contributors.html
+++ b/dmp-frontend/src/assets/splash/about/contributors.html
@@ -69,34 +69,54 @@
 				<div class="row title-4">Translators</div>
 			</div>
 			<div class="card mt-3 flex-row">
-				<img class="col-4 flag" alt="Flag of Greece" src="../assets/img/flag-of-greece.png">
+				<div class="col-4 d-flex justify-content-center align-items-center">
+					<div class="flag-img-container">
+						<img class="flag" alt="Flag of Greece" src="../assets/img/flag-of-greece.png">
+					</div>
+				</div>
 				<div class="col-8 card-body pl-0" class="flex-column align-items-center">
 					<p class="card-text-1">Athena Research & Innovation Center</p>
 					<p class="card-text-2">Dimitra Aglamisi, Elli Papadopoulou</p>
 				</div>
 			</div>
 			<div class="card flex-row">
-				<img class="col-4 card-img" alt="Flag of Spain" src="../assets/img/flag-of-spain.png">
+				<div class="col-4 d-flex justify-content-center align-items-center">
+					<div class="flag-img-container">
+						<img class="card-img" alt="Flag of Spain" src="../assets/img/flag-of-spain.png">
+					</div>
+				</div>
 				<div class="col-8 card-body pl-0" class="flex-column align-items-center">
 					<p class="card-text-1">Consorcio Madroño</p>
 					<p class="card-text-2">Lanko López, Juan Corrales Correyero, Fernando González Ballesteros</p>
 				</div>
 			</div>
 			<div class="card flex-row">
-				<img class="col-4 card-img" alt="Flag of Turkey" src="../assets/img/flag-of-turkey.png">
+				<div class="col-4 d-flex justify-content-center align-items-center">
+					<div class="flag-img-container">
+						<img class="card-img" alt="Flag of Turkey" src="../assets/img/flag-of-turkey.png">
+					</div>
+				</div>
 				<div class="col-8 card-body pl-0" class="flex-column align-items-center">
 					<p class="card-text-1">Turkish Higher Education Council Research Data and Open Data working group</p>
 				</div>
 			</div>
 			<div class="card flex-row">
-				<img class="col-4 flag" alt="Flag of Austria" src="../assets/img/flag-of-austria.png">
+				<div class="col-4 d-flex justify-content-center align-items-center">
+					<div class="flag-img-container">
+						<img class="flag" alt="Flag of Austria" src="../assets/img/flag-of-austria.png">
+					</div>
+				</div>
 				<div class="col-8 card-body pl-0" class="flex-column align-items-center">
 					<p class="card-text-1">UNIVERSITY OF VIENNA</p>
 					<p class="card-text-2">Gerda McNeill, Raman Ganguly, Mihaela Hubert</p>
 				</div>
 			</div>
 			<div class="card flex-row">
-				<img class="col-4 flag" alt="Flag of Slovakia" src="../assets/img/flag-of-slovakia.png">
+				<div class="col-4 d-flex justify-content-center align-items-center">
+					<div class="flag-img-container">
+						<img class="flag" alt="Flag of Slovakia" src="../assets/img/flag-of-slovakia.png">
+					</div>
+				</div>
 				<div class="col-8 card-body pl-0" class="flex-column align-items-center">
 					<p class="card-text-1">SLOVAK CENTRE FOR SCIENTIFIC AND TECHNICAL INFORMATION</p>
 					<p class="card-text-2">Silvia Horáková, Richard Rac, Iryna Kuchma</p>
diff --git a/dmp-frontend/src/assets/splash/css/styles.css b/dmp-frontend/src/assets/splash/css/styles.css
index 1d9df2a13..345f8aaf1 100644
--- a/dmp-frontend/src/assets/splash/css/styles.css
+++ b/dmp-frontend/src/assets/splash/css/styles.css
@@ -331,7 +331,12 @@ hr {
 }
 
 .card-img {
-	transform: scale(0.5);
+	width: 100%;
+    height: auto;
+	/* -webkit-transform: scale(0.45);
+	-moz-transform: scale(0.45);
+	-o-transform: scale(0.45);
+	transform: scale(0.45); */
 }
 
 .card-body {
@@ -354,12 +359,21 @@ hr {
 	opacity: 0.6;
 }
 
+.flag-img-container {
+	width: 6.8rem;
+}
+
 .flag {
-	border: 10px solid #EEEEEE;
+	border: 5px solid #EEEEEE;
 	border-radius: 50% !important;
     padding-right: 0px !important;
 	padding-left: 0px !important;
-	transform: scale(0.45);
+	width: 100%;
+    height: auto;
+	/* -webkit-transform: scale(0.45);
+	-moz-transform: scale(0.45);
+	-o-transform: scale(0.45);
+	transform: scale(0.45); */
 }
 
 .ext-link-icon {