A personal media tracker built on the AT Protocol
opnshelf.xyz
style: make selected week highlighting more subtle
- Use very light 5% opacity tint (bg-[var(--accent)]/5) instead of accent-subtle
- Remove ring and accent border from selected week
- Keep standard text color for selected week days
- Only today gets accent text color
+2
-2
+2
-2
apps/web/src/routes/calendar.tsx
+2
-2
apps/web/src/routes/calendar.tsx
···
330
330
}}
331
331
className={`relative h-24 flex flex-col items-start rounded-lg border p-1.5 text-left transition-all ${
332
332
inSelectedWeek
333
-
? "border-[var(--accent)] bg-[var(--accent-subtle)] ring-1 ring-[var(--accent)]"
333
+
? "border-[var(--border)] bg-[var(--accent)]/5"
334
334
: isToday
335
335
? "border-[var(--accent)] bg-[var(--accent-subtle)]"
336
336
: "border-[var(--border)] bg-[var(--background-elevated)] hover:border-[var(--border-strong)]"
···
338
338
>
339
339
<span
340
340
className={`text-sm font-medium ${
341
-
isToday || inSelectedWeek
341
+
isToday
342
342
? "text-[var(--accent)]"
343
343
: "text-[var(--foreground)]"
344
344
}`}