Cleanup.

src/components/CalendarDay.vue

@@ -62,18 +62,10 @@ const formattedDate = computed(() => {
   justify-items: center;
 }
 .cell h1.day-number {
-  margin: 0;
-  padding: 0;
   position: absolute;
-  inset-block: 1.5rem;
-  inset-inline: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
   font-size: 5vmin;
-  font-weight: 600;
+  font-weight: 800;
   color: var(--ink);
-  opacity: 0.8;
   transition: all 0.15s ease;
 }
 .cell.firstday h1.day-number {
@@ -91,11 +83,11 @@ const formattedDate = computed(() => {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  width: calc(100% + .3rem);
-  height: calc(100% + .3rem);
+  width: calc(100% + .2rem);
+  height: calc(100% + .2rem);
   border-radius: 1rem;
   background: transparent;
-  border: 0.1em solid var(--today);
+  border: 0.3em solid var(--today);
   z-index: 15;
   pointer-events: none;
 }
@@ -103,7 +95,7 @@ const formattedDate = computed(() => {
   opacity: 0.3;
   filter: brightness(1.2);
 }
-.cell.holiday {
+.cell {
   background-image: linear-gradient(
     135deg,
     var(--holiday-grad-start, rgba(255, 255, 255, 0.5)) 0%,
@@ -111,7 +103,7 @@ const formattedDate = computed(() => {
   );
 }
 @media (prefers-color-scheme: dark) {
-  .cell.holiday {
+  .cell {
     background-image: linear-gradient(
       135deg,
       var(--holiday-grad-start, rgba(255, 255, 255, 0.1)) 0%,

src/components/Jogwheel.vue

@@ -30,9 +30,9 @@ let dragScale = 1 // mainScrollPixels per mouse pixel
 let accumDelta = 0
 let pointerLocked = false
 
-// Jogwheel content height is 1/10th of main calendar
+// Jogwheel content height is 1/4h of main calendar
 const jogwheelHeight = computed(() => {
-  return (props.totalVirtualWeeks * props.rowHeight) / 10
+  return (props.totalVirtualWeeks * props.rowHeight) / 4
 })
 
 const handleJogwheelScroll = () => {