feat(phase2): localization EN/RU + additional widget types

- 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
This commit is contained in:
2026-03-24 23:18:05 +03:00
parent bf4e5089ee
commit 477c0e4d52
52 changed files with 1776 additions and 395 deletions
+12 -10
View File
@@ -1,4 +1,6 @@
<script lang="ts">
import { t } from 'svelte-i18n';
interface Props {
iconType: string;
iconValue: string;
@@ -22,7 +24,7 @@
</script>
<div class="space-y-2">
<label class="block text-sm font-medium text-card-foreground">Icon</label>
<label class="block text-sm font-medium text-card-foreground">{$t('app.icon')}</label>
<div class="flex gap-2">
<select
@@ -30,10 +32,10 @@
onchange={handleTypeChange}
class="rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
>
<option value="lucide">Lucide Icon</option>
<option value="simple">Simple Icons</option>
<option value="url">Image URL</option>
<option value="emoji">Emoji</option>
<option value="lucide">{$t('app.icon_lucide')}</option>
<option value="simple">{$t('app.icon_simple')}</option>
<option value="url">{$t('app.icon_url')}</option>
<option value="emoji">{$t('app.icon_emoji')}</option>
</select>
<input
@@ -41,12 +43,12 @@
value={iconValue}
oninput={handleValueChange}
placeholder={iconType === 'lucide'
? 'e.g. globe, server, home'
? $t('app.icon_lucide_placeholder')
: iconType === 'simple'
? 'e.g. github, docker'
? $t('app.icon_simple_placeholder')
: iconType === 'url'
? 'https://example.com/icon.png'
: 'e.g. 🌐'}
? $t('app.icon_url_placeholder')
: $t('app.icon_emoji_placeholder')}
class="flex-1 rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
/>
</div>
@@ -54,7 +56,7 @@
{#if iconType === 'emoji' && iconValue}
<div class="text-2xl">{iconValue}</div>
{:else if iconType === 'url' && iconValue}
<img src={iconValue} alt="Icon preview" class="h-8 w-8 rounded object-contain" />
<img src={iconValue} alt={$t('app.icon_preview')} class="h-8 w-8 rounded object-contain" />
{:else if iconType === 'simple' && iconValue}
<img
src="https://cdn.simpleicons.org/{iconValue.toLowerCase()}"