fix: replace emoji icons with inline SVG (Icon.svelte + icons.js)

All emoji characters replaced with inline SVG icons:
- Plugin Manager sidebar: puzzle SVG icon
- Verstak logo: stack/tray SVG icon
- Plugin icons: flask SVG (from plugin manifest)
- Warning/error indicators: warning triangle SVG
- Settings button: gear SVG
- Vault recent: vault/shield SVG
- Fallback: dot SVG

New components:
- frontend/src/lib/ui/icons.js — SVG path map
- frontend/src/lib/ui/Icon.svelte — reusable SVG icon component

Icon policy: NO emoji or unicode pictographic symbols in the app.
Only SVG icons registered in icons.js are allowed.
Wails WebKitGTK does not render colour emoji.
This commit is contained in:
2026-06-17 19:02:51 +08:00
parent c2e14cae69
commit 6d2f7858eb
8 changed files with 214 additions and 26 deletions
@@ -1,6 +1,7 @@
<script>
import { onMount, onDestroy } from 'svelte';
import * as App from '../../../wailsjs/go/api/App';
import Icon from '../ui/Icon.svelte';
// Import the VerstakPluginAPI contract
import './VerstakPluginAPI.js';
@@ -168,7 +169,7 @@
{:else if loadState === 'error'}
<div class="host-state error">
<div class="error-icon">⚠️</div>
<Icon name="warning" size={24} className="error-icon" />
<p class="error-title">Plugin View Error</p>
<div class="error-details">
<p><strong>Plugin:</strong> {currentPluginId || 'unknown'}</p>
@@ -238,7 +239,7 @@
color: #e94560;
}
.error-icon {
.host-state.error :global(.error-icon) {
font-size: 2rem;
margin-bottom: 0.5rem;
}