alexei.dolgolyov/web-app-launcher
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat(mvp): phase 7 - UI polish & ambient backgrounds

Browse Source 
Add layout system (sidebar, header, main layout), dark/light/system theme
with HSL customization, 3 ambient backgrounds (mesh gradient, particle field,
aurora), Cmd/Ctrl+K search dialog, page transitions, card hover effects,
status pulse animations, skeleton loaders, and responsive design. Polish
all existing pages with consistent theming.
This commit is contained in:
Admin
2026-03-24 21:37:16 +03:00
parent c5166ba3a9
commit 0bd30c5e17
41 changed files with 2106 additions and 391 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/board/BoardCard.svelte
+7 -7
View File
@@ -20,36 +20,36 @@
<a
href="/boards/{board.id}"
class="group block rounded-lg border border-gray-700 bg-gray-800/50 p-5 transition-colors hover:border-indigo-500/50 hover:bg-gray-800"
class="card-hover group block rounded-xl border border-border bg-card p-5 transition-colors hover:border-primary/50"
>
<div class="flex items-start gap-3">
{#if board.icon}
<span class="text-xl">{board.icon}</span>
{:else}
<span class="flex h-8 w-8 items-center justify-center rounded-md bg-gray-700 text-sm text-gray-400">
<span class="flex h-8 w-8 items-center justify-center rounded-md bg-muted text-sm text-muted-foreground">
B
</span>
{/if}
<div class="min-w-0 flex-1">
<div class="flex items-center gap-2">
<h3 class="truncate font-semibold text-white group-hover:text-indigo-300 transition-colors">
<h3 class="truncate font-semibold text-foreground transition-colors group-hover:text-primary">
{board.name}
</h3>
{#if board.isDefault}
<span class="shrink-0 rounded bg-indigo-600/20 px-1.5 py-0.5 text-xs text-indigo-400">
<span class="shrink-0 rounded bg-primary/15 px-1.5 py-0.5 text-xs text-primary">
Default
</span>
{/if}
{#if board.isGuestAccessible}
<span class="shrink-0 rounded bg-green-600/20 px-1.5 py-0.5 text-xs text-green-400">
<span class="shrink-0 rounded bg-accent px-1.5 py-0.5 text-xs text-accent-foreground">
Guest
</span>
{/if}
</div>
{#if board.description}
<p class="mt-1 line-clamp-2 text-sm text-gray-400">{board.description}</p>
<p class="mt-1 line-clamp-2 text-sm text-muted-foreground">{board.description}</p>
{/if}
<p class="mt-2 text-xs text-gray-500">
<p class="mt-2 text-xs text-muted-foreground/70">
{sectionCount} section{sectionCount === 1 ? '' : 's'}
</p>
</div>