diff --git a/src/lib/components/calendar.svelte b/src/lib/components/calendar.svelte
index 77ad8dd..0d4f9e3 100644
--- a/src/lib/components/calendar.svelte
+++ b/src/lib/components/calendar.svelte
@@ -5,43 +5,51 @@
         image?: string;
         content: string;
     }
-    
+
     let {
-      year = $bindable('2026'),
-      month = $bindable('0'),
-      entries
-    } = $props()
-    
+        year = $bindable("2026"),
+        month = $bindable("0"),
+        entries,
+    } = $props();
+
     var headers = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
     let days = $state([]);
     let expanded = $state(false);
     let currentYear = $state(parseInt(year));
     let currentMonth = $state(parseInt(month));
-    
+
     // Helper function to find entry for a specific day
-    function getEntryForDay(year: number, month: number, date: number): Entry | undefined {
+    function getEntryForDay(
+        year: number,
+        month: number,
+        date: number,
+    ): Entry | undefined {
         if (!entries) return undefined;
-        const dateStr = new Date(year, month, date).toISOString().split('T')[0];
-        return entries.find(entry => {
-            const entryDate = entry.date.split('T')[0];
+        const dateStr = new Date(year, month, date).toISOString().split("T")[0];
+        return entries.find((entry) => {
+            const entryDate = entry.date.split("T")[0];
             return entryDate === dateStr;
         });
     }
-    
+
     // Get current week when in week view
     function getCurrentWeek() {
         const today = new Date();
         const currentDay = today.getDay();
         const diff = currentDay === 0 ? -6 : 1 - currentDay; // Adjust for Monday start
-        
+
         const monday = new Date(today);
         monday.setDate(today.getDate() + diff);
-        
+
         const week = [];
         for (let i = 0; i < 7; i++) {
             const day = new Date(monday);
             day.setDate(monday.getDate() + i);
-            const entry = getEntryForDay(day.getFullYear(), day.getMonth(), day.getDate());
+            const entry = getEntryForDay(
+                day.getFullYear(),
+                day.getMonth(),
+                day.getDate(),
+            );
             week.push({
                 date: day.getDate(),
                 month: day.getMonth(),
@@ -49,24 +57,24 @@
                 dayName: headers[i],
                 isCurrentMonth: day.getMonth() === today.getMonth(),
                 isToday: day.toDateString() === today.toDateString(),
-                entry
+                entry,
             });
         }
         return week;
     }
-    
+
     // Generate calendar for a full month
     function generateMonth(year: number, month: number) {
         const firstDay = new Date(year, month, 1);
         const lastDay = new Date(year, month + 1, 0);
         const daysInMonth = lastDay.getDate();
-        
+
         // Get the day of week for first day (0 = Sunday, adjust to Monday = 0)
         let startDay = firstDay.getDay() - 1;
         if (startDay === -1) startDay = 6; // Sunday becomes 6
-        
+
         const days = [];
-        
+
         // Previous month days
         const prevMonthLastDay = new Date(year, month, 0).getDate();
         for (let i = startDay - 1; i >= 0; i--) {
@@ -82,16 +90,17 @@
                 dayName: headers[dayIndex],
                 isCurrentMonth: false,
                 isToday: false,
-                entry
+                entry,
             });
         }
-        
+
         // Current month days
         const today = new Date();
         for (let i = 1; i <= daysInMonth; i++) {
-            const isToday = today.getDate() === i && 
-                           today.getMonth() === month && 
-                           today.getFullYear() === year;
+            const isToday =
+                today.getDate() === i &&
+                today.getMonth() === month &&
+                today.getFullYear() === year;
             const dayIndex = days.length % 7;
             const entry = getEntryForDay(year, month, i);
             days.push({
@@ -101,10 +110,10 @@
                 dayName: headers[dayIndex],
                 isCurrentMonth: true,
                 isToday,
-                entry
+                entry,
             });
         }
-        
+
         // Next month days to fill the grid
         const remaining = 42 - days.length; // 6 rows * 7 days
         for (let i = 1; i <= remaining; i++) {
@@ -119,13 +128,13 @@
                 dayName: headers[dayIndex],
                 isCurrentMonth: false,
                 isToday: false,
-                entry
+                entry,
             });
         }
-        
+
         return days;
     }
-    
+
     // Update days when expanded state or month changes
     $effect(() => {
         if (expanded) {
@@ -134,7 +143,7 @@
             days = getCurrentWeek();
         }
     });
-    
+
     function toggleExpanded() {
         expanded = !expanded;
         if (expanded) {
@@ -144,7 +153,7 @@
             currentMonth = today.getMonth();
         }
     }
-    
+
     function previousMonth() {
         if (!expanded) return;
         if (currentMonth === 0) {
@@ -154,7 +163,7 @@
             currentMonth--;
         }
     }
-    
+
     function nextMonth() {
         if (!expanded) return;
         if (currentMonth === 11) {
@@ -164,34 +173,53 @@
             currentMonth++;
         }
     }
-    
-    const monthNames = ["January", "February", "March", "April", "May", "June",
-                        "July", "August", "September", "October", "November", "December"];
-    
+
+    const monthNames = [
+        "January",
+        "February",
+        "March",
+        "April",
+        "May",
+        "June",
+        "July",
+        "August",
+        "September",
+        "October",
+        "November",
+        "December",
+    ];
 </script>
 
 <div class="calendar-container">
     <div class="calendar-header">
-        <button class="expand-btn" onclick={toggleExpanded} title={expanded ? "Show week view" : "Show month view"}>
-            {expanded ? '−' : '+'}
+        <button
+            class="expand-btn"
+            onclick={toggleExpanded}
+            title={expanded ? "Show week view" : "Show month view"}
+        >
+            {expanded ? "−" : "+"}
         </button>
         {#if expanded}
             <button class="nav-btn" onclick={previousMonth}>‹</button>
-            <span class="month-year">{monthNames[currentMonth]} {currentYear}</span>
+            <span class="month-year"
+                >{monthNames[currentMonth]} {currentYear}</span
+            >
             <button class="nav-btn" onclick={nextMonth}>›</button>
         {:else}
             <span class="month-year">Current Week</span>
         {/if}
     </div>
-    
+
     <div class="calendar">
         {#each days as day, index}
-            <div 
-                class="day" 
-                class:other-month={!day.isCurrentMonth} 
+            <div
+                class="day"
+                class:other-month={!day.isCurrentMonth}
                 class:today={day.isToday}
                 class:has-image={day.entry?.image}
-                style={day.entry?.image ? `background-image: url(${day.entry.image}); background-size: cover; background-position: center;` : ''}
+                style={day.entry?.image
+                    ? `background-image: url(${day.entry.image}); background-size: cover; background-position: center;`
+                    : ""}
             >
                 {#if day.entry?.image}
                     <div class="image-overlay"></div>
@@ -210,191 +238,147 @@
     </div>
 </div>
 
-
 <style>
-.calendar-container {
-  width: 100%;
-}
+    .calendar-container {
+        width: 100%;
+    }
 
-.calendar-header {
-  display: flex;
-  align-items: center;
-  gap: 15px;
-  padding: 15px;
-  background: rgba(166, 168, 179, 0.05);
-  border-bottom: 1px solid rgba(166, 168, 179, 0.12);
-}
+    .calendar-header {
+        display: flex;
+        align-items: center;
+        gap: 15px;
+        padding: 15px;
+        background: rgba(166, 168, 179, 0.05);
+        border-bottom: 1px solid rgba(166, 168, 179, 0.12);
+    }
 
-.expand-btn {
-  width: 36px;
-  height: 36px;
-  border: 1px solid rgba(166, 168, 179, 0.2);
-  background: transparent;
-  color: #009FB7;
-  font-size: 24px;
-  cursor: pointer;
-  border-radius: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.2s;
-}
+    .expand-btn {
+        width: 36px;
+        height: 36px;
+        border: 1px solid rgba(166, 168, 179, 0.2);
+        background: transparent;
+        color: #009fb7;
+        font-size: 24px;
+        cursor: pointer;
+        border-radius: 4px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.2s;
+    }
 
-.expand-btn:hover {
-  background: rgba(255, 255, 255, 0.1);
-  border-color: #009FB7;
-}
+    .expand-btn:hover {
+        background: rgba(255, 255, 255, 0.1);
+        border-color: #009fb7;
+    }
 
-.nav-btn {
-  width: 32px;
-  height: 32px;
-  border: 1px solid rgba(166, 168, 179, 0.2);
-  background: transparent;
-  color: #009FB7;
-  font-size: 20px;
-  cursor: pointer;
-  border-radius: 4px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.2s;
-}
+    .nav-btn {
+        width: 32px;
+        height: 32px;
+        border: 1px solid rgba(166, 168, 179, 0.2);
+        background: transparent;
+        color: #009fb7;
+        font-size: 20px;
+        cursor: pointer;
+        border-radius: 4px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.2s;
+    }
 
-.nav-btn:hover {
-  background: rgba(0, 159, 183, 0.1);
-  border-color: #009FB7;
-}
+    .nav-btn:hover {
+        background: rgba(0, 159, 183, 0.1);
+        border-color: #009fb7;
+    }
 
-.month-year {
-  font-size: 18px;
-  font-weight: 600;
-  color: #009FB7;
-  flex: 1;
-  text-align: center;
-}
+    .month-year {
+        font-size: 18px;
+        font-weight: 600;
+        color: #009fb7;
+        flex: 1;
+        text-align: center;
+    }
 
-.calendar {
-  display: grid;
-  width: 100%;
-  grid-template-columns: repeat(7, minmax(120px, 1fr));
-  grid-auto-rows: 120px;
-  overflow: auto;
-}
+    .calendar {
+        display: grid;
+        width: 100%;
+        grid-template-columns: repeat(7, minmax(120px, 1fr));
+        grid-auto-rows: 120px;
+        overflow: auto;
+    }
 
-.day {
-  border-bottom: 1px solid rgba(166, 168, 179, 0.12);
-  border-right: 1px solid rgba(166, 168, 179, 0.12);
-  padding: 14px 20px;
-  box-sizing: border-box;
-  color: #98a0a6;
-  position: relative;
-  z-index: 1;
-}
+    .day {
+        border-bottom: 1px solid rgba(166, 168, 179, 0.12);
+        border-right: 1px solid rgba(166, 168, 179, 0.12);
+        padding: 14px 20px;
+        box-sizing: border-box;
+        color: #98a0a6;
+        position: relative;
+        z-index: 1;
+    }
 
-.day.has-image {
-  background-color: transparent;
-}
+    .day.has-image {
+        background-color: transparent;
+    }
 
-.image-overlay {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.3);
-  z-index: 1;
-}
+    .image-overlay {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0, 0, 0, 0.3);
+        z-index: 1;
+    }
 
-.day-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 8px;
-  position: relative;
-  z-index: 2;
-}
+    .day-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 8px;
+        position: relative;
+        z-index: 2;
+    }
 
-.day-name {
-  font-size: 12px;
-  text-transform: uppercase;
-  color: #009FB7;
-  font-weight: 500;
-}
+    .day-name {
+        font-size: 12px;
+        text-transform: uppercase;
+        color: #009fb7;
+        font-weight: 500;
+    }
 
-.date {
-  font-size: 18px;
-  font-weight: 600;
-  letter-spacing: 1px;
-}
+    .date {
+        font-size: 18px;
+        font-weight: 600;
+        letter-spacing: 1px;
+    }
 
-.entry-indicator {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  background-color: #4a9eff;
-  display: inline-block;
-  margin-left: 8px;
-}
+    .entry-indicator {
+        width: 8px;
+        height: 8px;
+        border-radius: 50%;
+        background-color: #4a9eff;
+        display: inline-block;
+        margin-left: 8px;
+    }
 
-.day.has-image .day-name,
-.day.has-image .date {
-  color: white;
-  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
-}
+    .day.has-image .day-name,
+    .day.has-image .date {
+        color: white;
+        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
+    }
 
-.day.other-month {
-  opacity: 0.3;
-}
+    .day.other-month {
+        opacity: 0.3;
+    }
 
-.day.today {
-  background: rgba(0, 159, 183, 0.1);
-}
+    .day.today {
+        background: rgba(0, 159, 183, 0.1);
+    }
 
-.day.today .date {
-  color: #009FB7;
-  font-weight: 700;
-}
-
-.day:nth-of-type(7n + 7) {
-  border-right: 0;
-}
-.day:nth-of-type(n + 1):nth-of-type(-n + 7) {
-  grid-row: 1;
-}
-.day:nth-of-type(n + 8):nth-of-type(-n + 14) {
-  grid-row: 2;
-}
-.day:nth-of-type(n + 15):nth-of-type(-n + 21) {
-  grid-row: 3;
-}
-.day:nth-of-type(n + 22):nth-of-type(-n + 28) {
-  grid-row: 4;
-}
-.day:nth-of-type(n + 29):nth-of-type(-n + 35) {
-  grid-row: 5;
-}
-.day:nth-of-type(n + 36):nth-of-type(-n + 42) {
-  grid-row: 6;
-}
-.day:nth-of-type(7n + 1) {
-  grid-column: 1/1;
-}
-.day:nth-of-type(7n + 2) {
-  grid-column: 2/2;
-}
-.day:nth-of-type(7n + 3) {
-  grid-column: 3/3;
-}
-.day:nth-of-type(7n + 4) {
-  grid-column: 4/4;
-}
-.day:nth-of-type(7n + 5) {
-  grid-column: 5/5;
-}
-.day:nth-of-type(7n + 6) {
-  grid-column: 6/6;
-}
-.day:nth-of-type(7n + 7) {
-  grid-column: 7/7;
-}
-</style>
\ No newline at end of file
+    .day.today .date {
+        color: #009fb7;
+        font-weight: 700;
+    }
+</style>