diff --git a/webclient/CLAUDE.md b/webclient/CLAUDE.md index bc196ee..20813e6 100644 --- a/webclient/CLAUDE.md +++ b/webclient/CLAUDE.md @@ -67,3 +67,27 @@ - Tool call visibility — the user wants to see what the agent is doing - Thinking blocks — collapsible, clearly separated from the response - Profile indicator and ability to create sessions with a specific profile + +## Design system (gnexus-ui-kit v1.0) + +Full component docs, rules and demo live in the vendored copy: +**`vendor/gnexus-ui-kit/CLAUDE.md`** — read it before styling anything. + +Facts specific to this app: + +- Kit is consumed as **prebuilt CSS**: `import 'gnexus-ui-kit/css'` in `src/main.js` + (kit v1.0's `_fonts.scss` references fonts by relative url(), which breaks + Sass source compilation — the Vite bundler resolves them instead). +- **Theme**: default dark `dist/css/kit.css`. No theme switcher. +- **Tokens**: CSS variables `--gn-*` (colors/surfaces/borders/motion/spacing) + everywhere in styles; SCSS structural tokens (`$space-*`, `$color-*`, `$border-*`, + `focus_ring`) via `@use 'kit-deps' as *` (aliased to `vendor/gnexus-ui-kit/src/scss` + in loadPaths). Typography tokens are NOT exported by kit-deps — use the + `--gn-font-*` CSS variables or literals. +- **Icons**: Phosphor web font. Icon props and classes must carry the `ph` base + class and `ph-` prefix (`ph ph-copy`, or `ph-copy` is auto-prefixed by kit). +- App-owned classes (`.card-grid-*`, `.card-modal-*` on CardGrid content, chat + domain cards, `.session-item`) are locked by tests — do not rename. +- Surfaces intentionally NOT kit components (documented escape hatches): + LoginScreen (SSO redirect, GnLoginCard doesn't fit), chat domain cards, + MessageList, ImageLightbox. diff --git a/webclient/src/components/settings/ApiKeysPanel.vue b/webclient/src/components/settings/ApiKeysPanel.vue index 498fdfa..22d8b4f 100644 --- a/webclient/src/components/settings/ApiKeysPanel.vue +++ b/webclient/src/components/settings/ApiKeysPanel.vue @@ -41,7 +41,6 @@