From 9ee4ee59d75a0306a7c12bbab2a940c7c7afa90e Mon Sep 17 00:00:00 2001
From: Philip Saa <cowglow@gmail.com>
Date: Wed, 5 Jun 2024 22:52:40 +0200
Subject: [PATCH 1/4] Fix team member image layout

---
 src/routes/team/TeamMember.svelte | 144 ++++++++++++++++--------------
 1 file changed, 76 insertions(+), 68 deletions(-)

diff --git a/src/routes/team/TeamMember.svelte b/src/routes/team/TeamMember.svelte
index 02920863..89458ba6 100644
--- a/src/routes/team/TeamMember.svelte
+++ b/src/routes/team/TeamMember.svelte
@@ -1,77 +1,85 @@
 <script lang="ts">
-	import Box from '$lib/layout/Box.svelte';
-	import linkedinLogo from '$lib/participants/linkedin.svg';
+    import Box from '$lib/layout/Box.svelte';
+    import linkedinLogo from '$lib/participants/linkedin.svg';
 
-	export let email: string = '';
-	export let linkedin: string | undefined = undefined;
-	export let image: string | undefined = undefined;
-	export let name: string;
+    export let email: string = '';
+    export let linkedin: string | undefined = undefined;
+    export let image: string | undefined = undefined;
+    export let name: string;
 </script>
 
 <Box>
-	<div class="member">
-		<div class="image">
-			{#if image}
-				<img src={image} alt={name} />
-			{:else}
-				<span>🧑‍💻</span>
-			{/if}
-		</div>
-		<div class="infos">
-			<strong class="name-with-logo">
-				{name}
-				{#if linkedin}
-					<a
-						href={linkedin}
-						rel="external"
-						class="linkedin-link"
-						title="Link to {name} on LinkedIn"
-					>
-						<img src={linkedinLogo} height="32" width="32" alt="Link to {name} on LinkedIn" />
-					</a>
-				{/if}
-			</strong>
-			{#if email}
-				<a href="mailto:{email}" title={email}>{email}</a>
-			{:else}
-				<span>-</span>
-			{/if}
-		</div>
-	</div>
+    <div class="member">
+        <div class="image">
+            {#if image}
+                <img src={image} alt={name}/>
+            {:else}
+                <span>🧑‍💻</span>
+            {/if}
+        </div>
+        <div class="infos">
+            <strong class="name-with-logo">
+                {name}
+                {#if linkedin}
+                    <a
+                            href={linkedin}
+                            rel="external"
+                            class="linkedin-link"
+                            title="Link to {name} on LinkedIn"
+                    >
+                        <img src={linkedinLogo} height="32" width="32" alt="Link to {name} on LinkedIn"/>
+                    </a>
+                {/if}
+            </strong>
+            {#if email}
+                <a href="mailto:{email}" title={email}>{email}</a>
+            {:else}
+                <span>&nbsp;</span>
+            {/if}
+        </div>
+    </div>
 </Box>
 
 <style>
-	.member {
-		display: flex;
-		flex-flow: column;
-		height: 100%;
-	}
-	.infos {
-		display: flex;
-		flex-flow: column;
-		padding: 1em;
-	}
-	.name-with-logo {
-		display: flex;
-		align-items: center;
-	}
-	.linkedin-link {
-		margin-left: 0.5em;
-	}
-	a {
-		max-width: 13em;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-	.image {
-		flex: 1;
-		display: grid;
-		place-items: center;
-		max-width: 15em;
-	}
-	img,
-	.image > span {
-		display: block;
-		max-width: 100%;
-	}
+    .member {
+        display: flex;
+        flex-flow: column;
+        height: 100%;
+    }
+
+    .infos {
+        display: flex;
+        flex-flow: column;
+        padding: 1em;
+    }
+
+    .name-with-logo {
+        display: flex;
+        align-items: center;
+    }
+
+    .linkedin-link {
+        margin-left: 0.5em;
+    }
+
+    a {
+        max-width: 13em;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    .image {
+        display: grid;
+        width: 15em;
+        height: 15em;
+        overflow: hidden;
+    }
+    .image:has(span){
+        place-content: center;
+    }
+    .image > img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+    }
 </style>

From fa9a75fe714b35d7d390f9aed36ccf4dc2e797f5 Mon Sep 17 00:00:00 2001
From: Philip Saa <cowglow@gmail.com>
Date: Wed, 5 Jun 2024 22:58:38 +0200
Subject: [PATCH 2/4] Prettier

---
 src/routes/team/TeamMember.svelte | 76 ++++++++++++++++---------------
 1 file changed, 39 insertions(+), 37 deletions(-)

diff --git a/src/routes/team/TeamMember.svelte b/src/routes/team/TeamMember.svelte
index 89458ba6..28e4ff3c 100644
--- a/src/routes/team/TeamMember.svelte
+++ b/src/routes/team/TeamMember.svelte
@@ -1,43 +1,43 @@
-<script lang="ts">
-    import Box from '$lib/layout/Box.svelte';
-    import linkedinLogo from '$lib/participants/linkedin.svg';
+<script lang='ts'>
+	import Box from '$lib/layout/Box.svelte';
+	import linkedinLogo from '$lib/participants/linkedin.svg';
 
-    export let email: string = '';
-    export let linkedin: string | undefined = undefined;
-    export let image: string | undefined = undefined;
-    export let name: string;
+	export let email: string = '';
+	export let linkedin: string | undefined = undefined;
+	export let image: string | undefined = undefined;
+	export let name: string;
 </script>
 
 <Box>
-    <div class="member">
-        <div class="image">
-            {#if image}
-                <img src={image} alt={name}/>
-            {:else}
-                <span>🧑‍💻</span>
-            {/if}
-        </div>
-        <div class="infos">
-            <strong class="name-with-logo">
-                {name}
-                {#if linkedin}
-                    <a
-                            href={linkedin}
-                            rel="external"
-                            class="linkedin-link"
-                            title="Link to {name} on LinkedIn"
-                    >
-                        <img src={linkedinLogo} height="32" width="32" alt="Link to {name} on LinkedIn"/>
-                    </a>
-                {/if}
-            </strong>
-            {#if email}
-                <a href="mailto:{email}" title={email}>{email}</a>
-            {:else}
-                <span>&nbsp;</span>
-            {/if}
-        </div>
-    </div>
+	<div class='member'>
+		<div class='image'>
+			{#if image}
+				<img src={image} alt={name} />
+			{:else}
+				<span>🧑‍💻</span>
+			{/if}
+		</div>
+		<div class='infos'>
+			<strong class='name-with-logo'>
+				{name}
+				{#if linkedin}
+					<a
+						href={linkedin}
+						rel='external'
+						class='linkedin-link'
+						title='Link to {name} on LinkedIn'
+					>
+						<img src={linkedinLogo} height='32' width='32' alt='Link to {name} on LinkedIn' />
+					</a>
+				{/if}
+			</strong>
+			{#if email}
+				<a href='mailto:{email}' title={email}>{email}</a>
+			{:else}
+				<span>&nbsp;</span>
+			{/if}
+		</div>
+	</div>
 </Box>
 
 <style>
@@ -74,9 +74,11 @@
         height: 15em;
         overflow: hidden;
     }
-    .image:has(span){
+
+    .image:has(span) {
         place-content: center;
     }
+
     .image > img {
         width: 100%;
         height: 100%;

From bf0e9700abc749eb37313f03f5af4f597709d3c0 Mon Sep 17 00:00:00 2001
From: Philip Saa <cowglow@gmail.com>
Date: Wed, 5 Jun 2024 23:05:39 +0200
Subject: [PATCH 3/4] Prettier

---
 src/routes/team/TeamMember.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/team/TeamMember.svelte b/src/routes/team/TeamMember.svelte
index 28e4ff3c..e9a22b39 100644
--- a/src/routes/team/TeamMember.svelte
+++ b/src/routes/team/TeamMember.svelte
@@ -34,7 +34,7 @@
 			{#if email}
 				<a href='mailto:{email}' title={email}>{email}</a>
 			{:else}
-				<span>&nbsp;</span>
+				<span>-</span>
 			{/if}
 		</div>
 	</div>

From 23dad53d402c0401131c1cdb2e6428b1c39f972d Mon Sep 17 00:00:00 2001
From: Philip Saa <cowglow@gmail.com>
Date: Wed, 5 Jun 2024 23:08:19 +0200
Subject: [PATCH 4/4] Prettier

---
 src/routes/team/TeamMember.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/team/TeamMember.svelte b/src/routes/team/TeamMember.svelte
index e9a22b39..28e4ff3c 100644
--- a/src/routes/team/TeamMember.svelte
+++ b/src/routes/team/TeamMember.svelte
@@ -34,7 +34,7 @@
 			{#if email}
 				<a href='mailto:{email}' title={email}>{email}</a>
 			{:else}
-				<span>-</span>
+				<span>&nbsp;</span>
 			{/if}
 		</div>
 	</div>