feat(docker-watcher): phase 14 - frontend polish & modern UI

Design system with CSS custom properties (light/dark themes).
38 Lucide SVG icon components. Dark mode with system preference.
EN/RU localization with i18n store. Skeleton loaders, empty states,
toggle switches, micro-interactions. Responsive sidebar with
mobile hamburger menu. All pages polished with consistent styling.
This commit is contained in:
2026-03-27 23:53:09 +03:00
parent d4659146fc
commit a3aa5912d9
74 changed files with 2954 additions and 1750 deletions
@@ -0,0 +1,24 @@
<!--
Task 8: Skeleton card placeholder for project cards during loading.
-->
<script lang="ts">
import Skeleton from './Skeleton.svelte';
</script>
<div class="rounded-xl border border-[var(--border-primary)] bg-[var(--surface-card)] p-5 shadow-[var(--shadow-sm)]">
<div class="flex items-start justify-between">
<div class="flex-1 space-y-2">
<Skeleton width="60%" height="1.25rem" />
<Skeleton width="80%" height="0.875rem" />
</div>
<Skeleton width="4rem" height="1.5rem" rounded />
</div>
<div class="mt-4 flex gap-4">
<Skeleton width="5rem" height="0.875rem" />
<Skeleton width="4rem" height="0.875rem" />
</div>
<div class="mt-3 flex gap-3">
<Skeleton width="3.5rem" height="0.75rem" />
<Skeleton width="4.5rem" height="0.75rem" />
</div>
</div>