alexei.dolgolyov
477c0e4d52
- Add svelte-i18n with 224 translation keys (English + Russian) - Language switcher in header (EN/RU toggle, persists to localStorage) - Extract all hardcoded strings from 37 component/page files - Add 4 new widget types: Bookmark, Note (markdown), Embed (iframe), Status - WidgetRenderer dispatches by type, WidgetGrid supports full-width widgets - Type-specific config forms in board editor - Install marked for markdown rendering
61 lines
1.7 KiB
Svelte
61 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import { t } from 'svelte-i18n';
|
|
import DynamicIcon from '$lib/components/ui/DynamicIcon.svelte';
|
|
|
|
interface BoardSummary {
|
|
id: string;
|
|
name: string;
|
|
icon: string | null;
|
|
description: string | null;
|
|
isDefault: boolean;
|
|
isGuestAccessible: boolean;
|
|
_count?: { sections: number };
|
|
}
|
|
|
|
interface Props {
|
|
board: BoardSummary;
|
|
}
|
|
|
|
let { board }: Props = $props();
|
|
|
|
const sectionCount = $derived(board._count?.sections ?? 0);
|
|
</script>
|
|
|
|
<a
|
|
href="/boards/{board.id}"
|
|
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}
|
|
<DynamicIcon name={board.icon} size={22} />
|
|
{:else}
|
|
<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-foreground transition-colors group-hover:text-primary">
|
|
{board.name}
|
|
</h3>
|
|
{#if board.isDefault}
|
|
<span class="shrink-0 rounded bg-primary/15 px-1.5 py-0.5 text-xs text-primary">
|
|
{$t('board.default')}
|
|
</span>
|
|
{/if}
|
|
{#if board.isGuestAccessible}
|
|
<span class="shrink-0 rounded bg-accent px-1.5 py-0.5 text-xs text-accent-foreground">
|
|
{$t('board.guest')}
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
{#if board.description}
|
|
<p class="mt-1 line-clamp-2 text-sm text-muted-foreground">{board.description}</p>
|
|
{/if}
|
|
<p class="mt-2 text-xs text-muted-foreground/70">
|
|
{$t('board.sections_count', { values: { count: sectionCount } })}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</a>
|