Slightly increased size of linkedin SVG in footer. Fixed consistant i…

…mage and card size for Team cards and Partner cards in About page. Fixed a minor issue with card components image display.

pmp-frontend-app/src/components/CardComponent.tsx

@@ -10,7 +10,9 @@ export default function CardComponent(prop: { cardConfig: ICardConfig, cardConte
     );
 
     const image: ReactElement = (
-        <figure><img src={prop.cardContent.imageSrc} alt={prop.cardContent.imageAlt} className={prop.cardConfig.imgClasses} /></figure>
+        <>
+            <img src={prop.cardContent.imageSrc} alt={prop.cardContent.imageAlt} className={prop.cardConfig.imgClasses} />
+        </>
     );
 
     let buttonClasses: string = "card-actions " + prop.cardConfig.buttonPlacement;

pmp-frontend-app/src/components/FooterComponent.tsx

@@ -29,7 +29,7 @@ export default function FooterComponent(): ReactElement {
       'svgLI': {
         href: "https://se.linkedin.com/company/scilifelab-data-centre", 
         xmlns: 'http://www.w3.org/2000/svg', 
-        width: "23", 
+        width: "25", 
         height: "23",
         viewBox: "5 5 40 40",
         classes: 'fill-current', 

pmp-frontend-app/src/pages/AboutPartnersPage.tsx

@@ -3,61 +3,99 @@ import { ICardConfig, ICardContent } from '../interfaces/types';
 import CardComponent from '../components/CardComponent';
 import { TrackPageViewIfEnabled } from '../util/cookiesHandling';
 import dcImage from '../assets/Partner logo/dc.png';
-import elixirImage from '../assets/Partner logo/Elixir-Europe-logo-1.png';
+// import elixirImage from '../assets/Partner logo/Elixir-Europe-logo-1.png';
 import nbisImage from '../assets/Partner logo/nbislogo_orange_txt_3cb0778d90.svg';
 import kawImage from '../assets/Partner logo/kaw_sv_300x300.png';
 import kiImage from '../assets/Partner logo/KI_digital_logotyp_positiv_RGB.png';
-import scilifelabImage from '../assets/Partner logo/SciLifeLab_Logotype_Green_NEG.png';
+import scilifelabImage from '../assets/Partner logo/SciLifeLab_Logotype_Green_POS.png';
+
 
 export default function AboutPartnersPage(): ReactElement {
     TrackPageViewIfEnabled();
 
+    let cardClasses: string = "flex flex-row justify-center items-center w-full h-full bg-white shadow-xl";
     var cardConfig: { [id: string] : ICardConfig; } = {
-        'fundersAndPartnersCard': {
+        'dcCard': {
+            cardClasses: cardClasses + " pl-6",
+            titleClasses: "card-title",
+            subTitleClasses: "",
+            textClasses: "",
+            imgClasses: "object-contain h-56 w-56",
+            buttonClasses: "", 
+            buttonPlacement: "",  
+        },
+        'kiCard': {
+            cardClasses: cardClasses,
+            titleClasses: "card-title",
+            subTitleClasses: "",
+            textClasses: "",
+            imgClasses: "object-contain h-72 w-72",
+            buttonClasses: "", 
+            buttonPlacement: "",  
+        },
+        'ddlsCard': {
+            cardClasses: cardClasses + " pl-6",
+            titleClasses: "card-title",
+            subTitleClasses: "",
+            textClasses: "",
+            imgClasses: "object-contain h-56 w-56",
+            buttonClasses: "", 
+            buttonPlacement: "",  
+        },
+        'kawCard': {
             cardClasses: "w-full h-full card lg:card-side bg-white shadow-xl",
             titleClasses: "card-title",
             subTitleClasses: "",
             textClasses: "",
-            imgClasses: "",
+            imgClasses: "object-contain",
+            buttonClasses: "", 
+            buttonPlacement: "",  
+        },
+        'nbisCard': {
+            cardClasses: cardClasses + " pl-10",
+            titleClasses: "card-title",
+            subTitleClasses: "",
+            textClasses: "",
+            imgClasses: "object-contain h-36 w-36",
             buttonClasses: "", 
             buttonPlacement: "",  
         },
     };
 
     var cardContent: { [id: string] : ICardContent } = {
-        'fundersAndPartnersCard1': {
+        'dcCard': {
             title: "SciLifeLab Data Centre",
             subTitle: "",
             text: "SciLifeLab Data Centre is a central unit within SciLifeLab with responsibility for IT- and data management issues, serving the SciLifeLab and the Data Driven Life Science (DDLS) research program. At SciLifeLab, we see data as one of the most valuable and long-lasting products of our operations and strive to make our data FAIR, handled according to open science standards and that its long-term value to the scientific community is maximised.", 
             buttonText: "",
             imageSrc: dcImage,
             imageAlt: "SciLifeLab Data Centre logo",
         },
-        'fundersAndPartnersCard2': {
+        'kiCard': {
             title: "Karolinska Institutet",
             subTitle: "",
             text: "Karolinska Institutet (KI) is a research-led medical university in Solna within the Stockholm urban area of Sweden and one of the foremost medical research institutes globally. KI hosts the Data Science Node in Precision Medicine and Diagnostics as part of the national Data-Driven Life Science program and associated to the SciLifeLab Data Platform.", 
             buttonText: "",
             imageSrc: kiImage,
             imageAlt: "Karolinska Institutet logo",
         },
-        'fundersAndPartnersCard3': {
+        'ddlsCard': {
             title: "Data-Driven Precision Medicine and Diagnostics",
             subTitle: "",
             text: "The Data-Driven Life Science subject area hosted by KI concerns research that will make use of computational tools to integrate molecular and clinical data for precision medicine and diagnostic development. The focus is on data integration, analysis, visualisation, and data interpretation for patient stratification, discovery of biomarkers for disease risks, diagnosis, drug response and monitoring of health.", 
             buttonText: "",
             imageSrc: scilifelabImage,
             imageAlt: "Data-Driven Precision Medicine and Diagnostics logo",
         },
-        'fundersAndPartnersCard4': {
+        'kawCard': {
             title: "SciLifeLab & Wallenberg National Program for Data-Driven Life Science",
             subTitle: "",
             text: "Life science research is becoming increasingly data-driven. The amount and complexity of data is also growing exponentially. Data is one of the most valuable products of research, and it is therefore crucially important that we ensure it is managed appropriately throughout its lifecycle. In response, SciLifeLab and The Knut and Alice Wallenberg Foundation (KAW) have launched the DDLS program in Sweden. This initiative aims to train and develop the next wave of life scientists, enhancing Sweden's capabilities in data science within the life sciences to achieve international competitiveness. The DDLS program has been funded by KAW for 12 years. SciLifeLab, as a national infrastructure for life science, coordinates this program in close collaboration with ten Swedish universities and the Swedish Museum of Natural History.", 
             buttonText: "",
             imageSrc: kawImage,
             imageAlt: "SciLifeLab & Wallenberg National Program for Data-Driven Life Science logo",
         },
-        'fundersAndPartnersCard5': {
+        'nbisCard': {
             title: "National Bioinformatics Infrastructure Sweden and ELIXIR Sweden",
             subTitle: "",
             text: "National Bioinformatics Infrastructure Sweden (NBIS) is a distributed national research infrastructure supported by the Swedish Research Council (Vetenskapsrådet), Science for Life Laboratory, all major Swedish universities, and the Knut and Alice Wallenberg Foundation. It provides state-of-the-art bioinformatics to the life science research community in Sweden. NBIS is also the Swedish contact point to the European infrastructure for biological information, ELIXIR Europe.", 
@@ -71,19 +109,19 @@ export default function AboutPartnersPage(): ReactElement {
         <>
         <div className="flex flex-row flex-wrap flex-grow justify-between">
             <div className="w-1/2 pb-2 px-2">
-                <CardComponent cardConfig={cardConfig['fundersAndPartnersCard']} cardContent={cardContent['fundersAndPartnersCard1']} />
+                <CardComponent cardConfig={cardConfig['dcCard']} cardContent={cardContent['dcCard']} />
             </div>
             <div className="w-1/2 pb-2 px-2">
-                <CardComponent cardConfig={cardConfig['fundersAndPartnersCard']} cardContent={cardContent['fundersAndPartnersCard2']} />
+                <CardComponent cardConfig={cardConfig['kiCard']} cardContent={cardContent['kiCard']} />
             </div>
             <div className="w-1/2 p-2">
-                <CardComponent cardConfig={cardConfig['fundersAndPartnersCard']} cardContent={cardContent['fundersAndPartnersCard3']} />
+                <CardComponent cardConfig={cardConfig['ddlsCard']} cardContent={cardContent['ddlsCard']} />
             </div>
             <div className="w-1/2 p-2">
-                <CardComponent cardConfig={cardConfig['fundersAndPartnersCard']} cardContent={cardContent['fundersAndPartnersCard5']} />
+                <CardComponent cardConfig={cardConfig['nbisCard']} cardContent={cardContent['nbisCard']} />
             </div>
             <div className="grow w-1/2 p-2">
-                <CardComponent cardConfig={cardConfig['fundersAndPartnersCard']} cardContent={cardContent['fundersAndPartnersCard4']} />
+                <CardComponent cardConfig={cardConfig['kawCard']} cardContent={cardContent['kawCard']} />
             </div>
         </div>
         </>

pmp-frontend-app/src/pages/AboutTeamPage.tsx

@@ -9,11 +9,11 @@ export default function AboutTeamPage(): ReactElement {
 
     var cardConfig: { [id: string] : ICardConfig; } = {
         'teamCard': { 
-            cardClasses: "card w-96 bg-white shadow-xl", 
+            cardClasses: "card h-[46rem] w-96 bg-white shadow-xl", 
             titleClasses: "card-title",
             subTitleClasses: "italic",
             textClasses: "",
-            imgClasses: "object-cover h-96 w-96",
+            imgClasses: "object-cover h-96 w-96 rounded-t-[8px]",
             buttonClasses: "", 
             buttonPlacement: "",  
         },