From 76f1bedf662e6eca0df72e52f237c6d622c54177 Mon Sep 17 00:00:00 2001
From: Minh Vo <minh.vo2@mail.mcgill.ca>
Date: Tue, 30 Dec 2025 11:03:05 -0500
Subject: [PATCH] fix styling issue

---
 src/components/event/EventBlock.svelte | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/components/event/EventBlock.svelte b/src/components/event/EventBlock.svelte
index f98c9a0..d5fea7c 100644
--- a/src/components/event/EventBlock.svelte
+++ b/src/components/event/EventBlock.svelte
@@ -84,7 +84,7 @@
 				onclick={flipCard}
 			></div>
 			<!-- Image Container with Gradient Overlay -->
-			<div class="relative h-80 overflow-hidden rounded-2xl">
+			<div class="relative h-80 overflow-hidden rounded-t-2xl">
 				{#if thumbnail}
 					<img class="h-full w-full object-cover" src={thumbnail} alt={eventTitle} />
 				{:else if eventCategory?.[0] === 'social'}
@@ -105,7 +105,7 @@
 
 				<!-- Gradient overlay -->
 				<div
-					class="via-ecsess-800/30 to-ecsess-950 absolute inset-0 rounded-2xl bg-gradient-to-b from-transparent"
+					class="via-ecsess-800/30 to-ecsess-950 absolute inset-0 rounded-t-2xl bg-gradient-to-b from-transparent"
 				></div>
 				<!-- Event Title Overlay -->
 				<div class="absolute right-0 bottom-0 left-0 p-6">
@@ -284,9 +284,6 @@
 
 <style>
 	.flip-box {
-		/* height: 100%;
-		width: 100%;
-		perspective: 1000px; Remove this if you don't want the 3D effect */
 		@apply h-full w-full perspective-[1000px];
 	}
 
@@ -319,14 +316,14 @@
 
 	.flip-box-front,
 	.flip-box-back {
-		@apply grid-1/1 h-full w-full rounded-2xl [-webkit-backface-visibility:hidden] backface-hidden;
+		@apply col-1 row-1 h-full w-full  [-webkit-backface-visibility:hidden] backface-hidden;
 	}
 	.flip-box-front {
-		@apply transform-rotate-y-0 z-2 transform-3d;
+		@apply rotate-y-0 z-2 transform-3d;
 	}
-
+ 
 	.flip-box-back {
-		@apply transform-rotate-y-180;
+		@apply rotate-y-180;
 	}
 
 	.show-back {