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
+33
View File
@@ -0,0 +1,33 @@
<script>
/**
* Icon.svelte — Renders inline SVG icons.
*
* Usage:
* <Icon name="puzzle" size={18} />
* <Icon name="flask" class="my-icon" />
*
* Rules:
* - NO emoji, NO unicode pictographic symbols
* - ALL icons must be SVG registered in ../ui/icons.js
* - If name is not found, renders a default dot icon
*/
import { iconPaths } from './icons.js';
export let name = 'dot';
export let size = 16;
export let className = '';
$: icon = iconPaths[name] || iconPaths.dot;
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox={icon.viewBox}
width={size}
height={size}
class={className}
>
{#each icon.paths as p}
<path d={p.d} {...p.attrs} />
{/each}
</svg>