refine: adjust schedule board spacing and grid layout

This commit is contained in:
2026-05-27 11:00:32 +02:00
parent ab37268e8b
commit 7e77f57a6f

View File

@@ -166,7 +166,7 @@
</div> </div>
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<div class="grid min-w-[1120px] grid-cols-7 gap-3 2xl:min-w-0"> <div class="grid gap-4 [grid-template-columns:repeat(7,minmax(260px,1fr))]">
{{range .ScheduleDays}} {{range .ScheduleDays}}
<section class="min-w-0 bg-background-surface ring-1 ring-black/5"> <section class="min-w-0 bg-background-surface ring-1 ring-black/5">
<header class="flex items-center justify-between gap-3 border-b border-black/5 bg-background px-3 py-2"> <header class="flex items-center justify-between gap-3 border-b border-black/5 bg-background px-3 py-2">
@@ -175,13 +175,13 @@
<h2 class="mt-0.5 text-base font-medium leading-tight text-foreground">{{.WeekdayLabel}}</h2> <h2 class="mt-0.5 text-base font-medium leading-tight text-foreground">{{.WeekdayLabel}}</h2>
</div> </div>
</header> </header>
<div class="flex flex-col gap-2 p-2"> <div class="flex flex-col gap-3 p-3">
{{if eq (len .Entries) 0}} {{if eq (len .Entries) 0}}
<div class="flex min-h-20 items-center justify-center bg-background px-3 py-6 text-center text-sm text-foreground-muted ring-1 ring-black/5">No releases scheduled</div> <div class="flex min-h-20 items-center justify-center bg-background px-3 py-6 text-center text-sm text-foreground-muted ring-1 ring-black/5">No releases scheduled</div>
{{else}} {{else}}
{{range .Entries}} {{range .Entries}}
<a href="/browse?q={{urlquery .Title}}" class="group flex min-h-24 gap-3 overflow-hidden bg-background p-2 ring-1 ring-black/5 transition-colors hover:bg-[color:var(--color-surface-hover)] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent"> <a href="/browse?q={{urlquery .Title}}" class="group flex min-h-28 gap-3 overflow-hidden bg-background p-3 ring-1 ring-black/5 transition-colors hover:bg-[color:var(--color-surface-hover)] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent">
<div class="relative aspect-2/3 h-24 shrink-0 overflow-hidden bg-background-surface"> <div class="relative aspect-2/3 h-28 shrink-0 overflow-hidden bg-background-surface">
{{if .ImageURL}} {{if .ImageURL}}
<img src="{{.ImageURL}}" alt="{{.Title}}" class="h-full w-full object-cover transition-transform duration-200 group-hover:scale-[1.03]" loading="lazy" /> <img src="{{.ImageURL}}" alt="{{.Title}}" class="h-full w-full object-cover transition-transform duration-200 group-hover:scale-[1.03]" loading="lazy" />
{{end}} {{end}}
@@ -195,8 +195,8 @@
<span class="ml-auto bg-accent px-2 py-1 text-[10px] font-semibold text-black/90">{{.AirType}}</span> <span class="ml-auto bg-accent px-2 py-1 text-[10px] font-semibold text-black/90">{{.AirType}}</span>
</div> </div>
<h3 class="mt-2 line-clamp-2 text-sm font-medium leading-snug text-foreground">{{.Title}}</h3> <h3 class="mt-3 line-clamp-2 text-sm font-medium leading-snug text-foreground">{{.Title}}</h3>
<div class="mt-auto pt-2 text-xs text-foreground-muted">Open details</div> <div class="mt-auto pt-3 text-xs text-foreground-muted">Open details</div>
</div> </div>
</a> </a>
{{end}} {{end}}