mirror of
https://github.com/lukaszraczylo/traefik-llmgateway.git
synced 2026-10-15 05:29:28 +00:00
feat(webui): redesign admin key gate
Add a circular key-icon badge and a small "LLM Gateway" wordmark, so the screen reads as this product's door and not a generic prompt. Restructure the dense security paragraph into a short description plus a three-item muted checklist. Each claim keeps its original strength: the key stays in this tab's session storage, the browser never writes it to disk, and requests go only to this page's own /admin/api/* routes. Add a show/hide toggle for the key input. It reuses the ghost icon-button composition SearchInput.vue already uses for its clear button. Autofocus the input on mount. Disable submit while the trimmed input is empty. Add a brief shake on the key input when auth.error is set. The animation respects prefers-reduced-motion and lives in a scoped <style> block local to this file — the first one in webui/src/components, added because no Tailwind-core or tw-animate-css keyframe reads as "rejected". Extend the header in App.vue with a GitHub repository link, per an operator scope addition mid-task: an icon-only ghost button that opens github.com/lukaszraczylo/traefik-llmgateway in a new tab. The link sits in App.vue's header, above the gate/dashboard switch, so it renders on every screen including the auth gate. Installs @fortawesome/free-brands-svg-icons, pinned like the other fontawesome packages, for the faGithub icon. auth.submit() semantics, dashboard.refresh() timing, and the backend stay unchanged.
This commit is contained in:
@@ -11,6 +11,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@fortawesome/fontawesome-svg-core": "^7.3.1",
|
||||
"@fortawesome/free-brands-svg-icons": "^7.3.1",
|
||||
"@fortawesome/free-solid-svg-icons": "^7.3.1",
|
||||
"@fortawesome/vue-fontawesome": "^3.3.3",
|
||||
"@tanstack/vue-table": "^8.21.3",
|
||||
|
||||
Reference in New Issue
Block a user