torbjorn/antigravity-claude-proxy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): enhance header subtitles with badge styling

Browse Source 
Refactor subtitle elements in accounts, dashboard, and models views to use styled badge containers with rounded backgrounds, borders, and improved typography for better visual consistency.
This commit is contained in:
jgor20
2026-01-11 13:56:11 +00:00
parent 0a0e3e2851
commit f53195bd34
3 changed files with 22 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
public/views/accounts.html
View File

@@ -2,15 +2,17 @@
<!-- Compact Header --> <!-- Compact Header -->
<div class="flex items-center justify-between gap-4 mb-6"> <div class="flex items-center justify-between gap-4 mb-6">
<!-- Title with inline subtitle --> <!-- Title with inline subtitle -->
<div class="flex items-baseline gap-3"> <div class="flex flex-wrap items-center gap-4">
<h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('accountManagement')"> <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('accountManagement')">
Account Management Account Management
</h1> </h1>
<span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]" <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
<span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
x-text="$store.global.t('manageTokens')"> x-text="$store.global.t('manageTokens')">
Manage Google Account tokens and authorization states Manage Google Account tokens and authorization states
</span> </span>
</div> </div>
</div>
<!-- Action Buttons --> <!-- Action Buttons -->
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">

8
public/views/dashboard.html
View File

@@ -2,18 +2,20 @@
<!-- Compact Header --> <!-- Compact Header -->
<div class="flex items-center justify-between gap-4 mb-6"> <div class="flex items-center justify-between gap-4 mb-6">
<!-- Title with inline subtitle --> <!-- Title with inline subtitle -->
<div class="flex items-baseline gap-3"> <div class="flex flex-wrap items-center gap-4">
<h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('dashboard')"> <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('dashboard')">
Dashboard Dashboard
</h1> </h1>
<span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]" <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
<span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
x-text="$store.global.t('systemDesc')"> x-text="$store.global.t('systemDesc')">
CLAUDE PROXY SYSTEM CLAUDE PROXY SYSTEM
</span> </span>
</div> </div>
</div>
<!-- Compact Status Indicator --> <!-- Compact Status Indicator -->
<div class="flex items-center gap-2 px-2.5 py-1.5 rounded-lg bg-space-900/60 border border-space-border/40"> <div class="flex items-center gap-2 px-2.5 py-1.5 rounded-lg bg-space-900/60 border border-space-border/40 whitespace-nowrap flex-shrink-0">
<div class="relative flex items-center justify-center"> <div class="relative flex items-center justify-center">
<span class="absolute w-1.5 h-1.5 bg-neon-green rounded-full animate-ping opacity-75"></span> <span class="absolute w-1.5 h-1.5 bg-neon-green rounded-full animate-ping opacity-75"></span>
<span class="relative w-1.5 h-1.5 bg-neon-green rounded-full"></span> <span class="relative w-1.5 h-1.5 bg-neon-green rounded-full"></span>

6
public/views/models.html
View File

@@ -2,15 +2,17 @@
<!-- Compact Header --> <!-- Compact Header -->
<div class="flex items-center justify-between gap-4 mb-6"> <div class="flex items-center justify-between gap-4 mb-6">
<!-- Title with inline subtitle --> <!-- Title with inline subtitle -->
<div class="flex items-baseline gap-3"> <div class="flex flex-wrap items-center gap-4">
<h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('models')"> <h1 class="text-2xl font-bold text-white tracking-tight" x-text="$store.global.t('models')">
Models Models
</h1> </h1>
<span class="text-[10px] font-mono text-gray-600 uppercase tracking-[0.15em]" <div class="flex items-center h-6 px-3 rounded-full bg-space-800/80 border border-space-border/50 shadow-sm backdrop-blur-sm">
<span class="text-[10px] font-mono text-gray-400 uppercase tracking-wider"
x-text="$store.global.t('modelsPageDesc')"> x-text="$store.global.t('modelsPageDesc')">
Real-time quota and status for all available models. Real-time quota and status for all available models.
</span> </span>
</div> </div>
</div>
<!-- Search Bar --> <!-- Search Bar -->
<div class="relative w-72 h-9"> <div class="relative w-72 h-9">