From 09585d8954676b81b274c33c37fcba127d9f04f6 Mon Sep 17 00:00:00 2001
From: June <self@breadone.net>
Date: Wed, 11 Feb 2026 19:55:48 +1300
Subject: [PATCH] images go behind the dates now

---
 src/lib/components/calendar.svelte                      | 4 ++--
 src/lib/components/ui/calendar/calendar-day.svelte      | 2 +-
 src/lib/components/ui/calendar/calendar-grid-row.svelte | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/calendar.svelte b/src/lib/components/calendar.svelte
index 0ad3448..2b2d49a 100644
--- a/src/lib/components/calendar.svelte
+++ b/src/lib/components/calendar.svelte
@@ -53,15 +53,15 @@
 >
     {#snippet day({ day })}
         <CalendarDay>
-            {day.day}
             {@const img = getImageForDate(day)}
             {#if img}
                 <img
                     src={img}
                     alt=""
-                    class="h-4 w-full rounded-sm object-cover"
+                    class="absolute inset-0 h-full w-full rounded-sm object-cover hover:opacity-20"
                 />
             {/if}
+            <span class="relative z-10 text-white">{day.day}</span>
         </CalendarDay>
     {/snippet}
 </Calendar>
diff --git a/src/lib/components/ui/calendar/calendar-day.svelte b/src/lib/components/ui/calendar/calendar-day.svelte
index 19d7bde..89664cf 100644
--- a/src/lib/components/ui/calendar/calendar-day.svelte
+++ b/src/lib/components/ui/calendar/calendar-day.svelte
@@ -14,7 +14,7 @@
 	bind:ref
 	class={cn(
 		buttonVariants({ variant: "ghost" }),
-		"flex size-(--cell-size) flex-col items-center justify-center gap-1 p-0 leading-none font-normal whitespace-nowrap select-none",
+		"relative flex flex-1 flex-col items-center justify-center gap-1 p-0 leading-none font-normal whitespace-nowrap select-none",
 		"[&[data-today]:not([data-selected])]:bg-accent [&[data-today]:not([data-selected])]:text-accent-foreground [&[data-today][data-disabled]]:text-muted-foreground",
 		"data-[selected]:bg-primary dark:data-[selected]:hover:bg-accent/50 data-[selected]:text-primary-foreground",
 		// Outside months
diff --git a/src/lib/components/ui/calendar/calendar-grid-row.svelte b/src/lib/components/ui/calendar/calendar-grid-row.svelte
index 9032236..e03aaf6 100644
--- a/src/lib/components/ui/calendar/calendar-grid-row.svelte
+++ b/src/lib/components/ui/calendar/calendar-grid-row.svelte
@@ -9,4 +9,4 @@
 	}: CalendarPrimitive.GridRowProps = $props();
 </script>
 
-<CalendarPrimitive.GridRow bind:ref class={cn("flex", className)} {...restProps} />
+<CalendarPrimitive.GridRow bind:ref class={cn("flex flex-1 gap-1", className)} {...restProps} />