Labyricorn/voicebox
1
0
Fork 0
mirror of https://github.com/jamiepine/voicebox.git synced 2026-09-19 14:50:38 -07:00
Code Issues Packages Projects Releases Wiki Activity

Update UI components and styles for improved functionality and aesthetics

Browse Source 
- Changed accent color variables in index.css for better visual consistency.
- Added a new voicebox logo to the Sidebar component for branding enhancement.
- Refactored AudioPlayer to utilize CSS variables for wave and progress colors, improving theme adaptability.
- Adjusted HistoryTable column widths for better layout and readability.
- Enhanced ProfileCard layout with improved button positioning and styling.
- Updated button styles to use accent colors for better visual coherence.
- Improved CircleButton styling for consistent appearance across the application.
This commit is contained in:
Jamie Pine
2026-01-25 17:06:14 -08:00
parent e7e3a0a440
commit 586b19f40f
48 changed files with 113 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/index.css
+19 -19
View File
@@ -42,26 +42,26 @@
}
:root {
--background: 0 0% 100%;
--background: 0 0% 95%;
--foreground: 222.2 84% 4.9%;
--card: 0 0% 100%;
--card: 0 0% 97%;
--card-foreground: 222.2 84% 4.9%;
--popover: 0 0% 100%;
--popover: 0 0% 97%;
--popover-foreground: 222.2 84% 4.9%;
--primary: 222.2 47.4% 11.2%;
--primary-foreground: 210 40% 98%;
--secondary: 210 40% 96.1%;
--secondary: 210 40% 92%;
--secondary-foreground: 222.2 47.4% 11.2%;
--muted: 210 40% 96.1%;
--muted: 210 40% 90%;
--muted-foreground: 215.4 16.3% 46.9%;
--accent: 210 40% 96.1%;
--accent: 43 50% 50%;
--accent-foreground: 222.2 47.4% 11.2%;
--destructive: 0 84.2% 60.2%;
--destructive-foreground: 210 40% 98%;
--border: 214.3 31.8% 91.4%;
--input: 214.3 31.8% 91.4%;
--border: 214.3 31.8% 85%;
--input: 214.3 31.8% 88%;
--ring: 222.2 84% 4.9%;
--sidebar: 0 0% 98%;
--sidebar: 0 0% 92%;
--radius: 0.5rem;
--chart-1: 12 76% 61%;
--chart-2: 173 58% 39%;
@@ -71,26 +71,26 @@
}
.dark {
--background: 0 0% 8%;
--background: 0 0% 6%;
--foreground: 0 0% 95%;
--card: 0 0% 10%;
--card: 0 0% 8%;
--card-foreground: 0 0% 95%;
--popover: 0 0% 10%;
--popover: 0 0% 8%;
--popover-foreground: 0 0% 95%;
--primary: 0 0% 20%;
--primary: 0 0% 18%;
--primary-foreground: 0 0% 95%;
--secondary: 0 0% 15%;
--secondary: 0 0% 12%;
--secondary-foreground: 0 0% 95%;
--muted: 0 0% 15%;
--muted: 0 0% 12%;
--muted-foreground: 0 0% 60%;
--accent: 0 0% 15%;
--accent: 43 50% 45%;
--accent-foreground: 0 0% 95%;
--destructive: 0 62.8% 50%;
--destructive-foreground: 0 0% 95%;
--border: 0 0% 15%;
--input: 0 0% 15%;
--border: 0 0% 12%;
--input: 0 0% 12%;
--ring: 0 0% 40%;
--sidebar: 0 0% 6%;
--sidebar: 0 0% 4%;
--chart-1: 220 70% 50%;
--chart-2: 160 60% 45%;
--chart-3: 30 80% 55%;