Add API key authentication for external access
Some checks failed
Lint and Build / build (pull_request) Failing after 1m44s
Some checks failed
Lint and Build / build (pull_request) Failing after 1m44s
- Create API key context for managing authentication state - Add dedicated settings page for API key management - Move performance metrics to dedicated page in navigation - Update middleware to support URL parameter fallback - Enhance UI with proper glass morphism styling - Add Solarized color utilities to CSS - Improve spacing and padding throughout UI components - Remove manual bullet points from list items 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
4f9e6d2097
commit
bc4cfe607d
10 changed files with 620 additions and 48 deletions
|
@ -73,7 +73,8 @@ body {
|
|||
}
|
||||
|
||||
/* Glass Card Component */
|
||||
.glass {
|
||||
.glass,
|
||||
.glass-panel {
|
||||
background: rgba(7, 54, 66, 0.4);
|
||||
backdrop-filter: blur(10px);
|
||||
border: 1px solid rgba(88, 110, 117, 0.3);
|
||||
|
@ -489,4 +490,59 @@ body {
|
|||
background: rgba(7, 54, 66, 0.2);
|
||||
border: 1px solid rgba(88, 110, 117, 0.2);
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Solarized Color Utilities */
|
||||
.text-base03 { color: var(--solarized-base03); }
|
||||
.text-base02 { color: var(--solarized-base02); }
|
||||
.text-base01 { color: var(--solarized-base01); }
|
||||
.text-base00 { color: var(--solarized-base00); }
|
||||
.text-base0 { color: var(--solarized-base0); }
|
||||
.text-base1 { color: var(--solarized-base1); }
|
||||
.text-base2 { color: var(--solarized-base2); }
|
||||
.text-base3 { color: var(--solarized-base3); }
|
||||
.text-blue { color: var(--solarized-blue); }
|
||||
.text-cyan { color: var(--solarized-cyan); }
|
||||
.text-green { color: var(--solarized-green); }
|
||||
.text-yellow { color: var(--solarized-yellow); }
|
||||
.text-orange { color: var(--solarized-orange); }
|
||||
.text-red { color: var(--solarized-red); }
|
||||
.text-magenta { color: var(--solarized-magenta); }
|
||||
.text-violet { color: var(--solarized-violet); }
|
||||
|
||||
.bg-base03 { background-color: var(--solarized-base03); }
|
||||
.bg-base02 { background-color: var(--solarized-base02); }
|
||||
.bg-base01 { background-color: var(--solarized-base01); }
|
||||
.bg-base00 { background-color: var(--solarized-base00); }
|
||||
.bg-base0 { background-color: var(--solarized-base0); }
|
||||
.bg-base1 { background-color: var(--solarized-base1); }
|
||||
.bg-base2 { background-color: var(--solarized-base2); }
|
||||
.bg-base3 { background-color: var(--solarized-base3); }
|
||||
.bg-blue { background-color: var(--solarized-blue); }
|
||||
.bg-cyan { background-color: var(--solarized-cyan); }
|
||||
.bg-green { background-color: var(--solarized-green); }
|
||||
.bg-yellow { background-color: var(--solarized-yellow); }
|
||||
.bg-orange { background-color: var(--solarized-orange); }
|
||||
.bg-red { background-color: var(--solarized-red); }
|
||||
.bg-magenta { background-color: var(--solarized-magenta); }
|
||||
.bg-violet { background-color: var(--solarized-violet); }
|
||||
|
||||
.border-base01 { border-color: var(--solarized-base01); }
|
||||
.border-base02 { border-color: var(--solarized-base02); }
|
||||
.border-blue { border-color: var(--solarized-blue); }
|
||||
.border-cyan { border-color: var(--solarized-cyan); }
|
||||
.border-green { border-color: var(--solarized-green); }
|
||||
.border-yellow { border-color: var(--solarized-yellow); }
|
||||
.border-orange { border-color: var(--solarized-orange); }
|
||||
.border-red { border-color: var(--solarized-red); }
|
||||
|
||||
/* Border opacity utilities */
|
||||
.border-green\/30 { border-color: rgba(133, 153, 0, 0.3); }
|
||||
.border-yellow\/30 { border-color: rgba(181, 137, 0, 0.3); }
|
||||
.border-blue\/30 { border-color: rgba(38, 139, 210, 0.3); }
|
||||
.border-red\/30 { border-color: rgba(220, 50, 47, 0.3); }
|
||||
|
||||
/* Focus utilities */
|
||||
.focus\:outline-none:focus { outline: none; }
|
||||
.focus\:ring-2:focus { box-shadow: 0 0 0 2px var(--solarized-blue); }
|
||||
.focus\:ring-blue:focus { box-shadow: 0 0 0 2px var(--solarized-blue); }
|
Loading…
Add table
Add a link
Reference in a new issue