From 03ed92ff86524dfd91d68b384c9dca31ed7f6e9d Mon Sep 17 00:00:00 2001
From: bryantgillespie <hey@bryantgillespie.com>
Date: Tue, 30 Jul 2024 10:59:10 -0400
Subject: [PATCH 1/2] fix column images

---
 components/blocks/Columns.vue | 29 ++++++++++++++---------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/components/blocks/Columns.vue b/components/blocks/Columns.vue
index 6cf6126..ac1094a 100644
--- a/components/blocks/Columns.vue
+++ b/components/blocks/Columns.vue
@@ -23,7 +23,13 @@ defineProps<{
 					<BlocksButtonGroup v-if="row?.button_group" :data="row?.button_group as BlockButtonGroup" class="mt-4" />
 				</div>
 				<div
-					class="order-first block w-full overflow-hidden border aspect-square dark:border-gray-700 rounded-card"
+					v-if="row.image"
+					v-motion
+					class="order-first block w-full h-full overflow-hidden border dark:border-gray-700 rounded-card"
+					:initial="{ opacity: 0, scale: 0.5, y: 0 }"
+					:visibleOnce="{ opacity: 1, scale: 1, y: 0 }"
+					:duration="1000"
+					:delay="250"
 					:class="[
 						{
 							'lg:order-last': row?.image_position === 'right',
@@ -31,20 +37,13 @@ defineProps<{
 						},
 					]"
 				>
-					<div
-						v-motion
-						:initial="{ opacity: 0, scale: 0.8, y: 50 }"
-						:visibleOnce="{ opacity: 1, scale: 1, y: 0 }"
-						:duration="1000"
-						:delay="250"
-					>
-						<NuxtImg
-							v-if="row.image"
-							:alt="safeRelation(row.image)?.description ?? ''"
-							:src="safeRelationId(row.image) ?? ''"
-							class="object-cover object-center w-full h-full bg-gray-100 rounded-card dark:brightness-90"
-						/>
-					</div>
+					<NuxtImg
+						:alt="safeRelation(row.image)?.description ?? ''"
+						:src="safeRelationId(row.image) ?? ''"
+						height="600"
+						width="600"
+						class="object-cover object-center w-full h-full bg-gray-100 rounded-card dark:brightness-90"
+					/>
 				</div>
 			</div>
 		</div>

From 585bfa3f83268ce7724540b72147a21d54802fca Mon Sep 17 00:00:00 2001
From: bryantgillespie <hey@bryantgillespie.com>
Date: Tue, 30 Jul 2024 11:01:56 -0400
Subject: [PATCH 2/2] quick team card fixes

---
 components/TeamCard.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/components/TeamCard.vue b/components/TeamCard.vue
index dbf49bf..639cbd7 100644
--- a/components/TeamCard.vue
+++ b/components/TeamCard.vue
@@ -9,10 +9,12 @@ const flipped = ref(false);
 </script>
 <template>
 	<div class="opacity-0 cursor-pointer select-none animate-fade-in" @click="flipped = !flipped">
-		<div class="relative w-full h-full overflow-hidden group rounded-card">
+		<div class="relative w-full aspect-square overflow-hidden group rounded-card">
 			<!-- Front of Team Card -->
 			<NuxtImg
 				v-if="person.image"
+				width="400"
+				height="400"
 				class="object-cover w-full h-full transition duration-300 grayscale group-hover:grayscale-0"
 				:src="person.image as string"
 				:alt="person.name ?? ''"
@@ -25,8 +27,8 @@ const flipped = ref(false);
 				class="absolute inset-0 p-2 -m-2 overflow-hidden bg-primary/80 backdrop-blur-sm"
 				:initial="{
 					opacity: 0,
-					y: 100,
-					x: 100,
+					y: 25,
+					x: 200,
 					scale: 0.9,
 				}"
 				:enter="{
@@ -34,14 +36,12 @@ const flipped = ref(false);
 					scale: 1,
 					x: 0,
 					y: 0,
-					transformOrigin: 'bottom right',
 				}"
 				:leave="{
 					opacity: 0,
 					scale: 0.9,
-					x: 100,
-					y: 100,
-					transformOrigin: 'bottom right',
+					x: 200,
+					y: 25,
 				}"
 			>
 				<div class="relative p-4 space-y-2">
@@ -69,7 +69,7 @@ const flipped = ref(false);
 				<TypographyHeadline v-if="person.name" :content="person.name" size="sm" class="text-white drop-shadow">
 					{{ person?.name }}
 				</TypographyHeadline>
-				<TypographyTitle v-if="person.job_title">
+				<TypographyTitle v-if="person.job_title" class="text-white/50">
 					{{ person?.job_title }}
 				</TypographyTitle>
 			</div>