fix: improve dropdown text readability in dark theme on usage page (#997)

- Add global CSS rules for select elements in dark mode
- Use color-scheme property to signal dark mode to browser
- Explicitly style option elements with dark theme colors
- Fix UsageStats dropdown to use correct CSS variables (bg-surface, text-text-main)

Fixes dropdown text being unreadable in dark theme on usage page:
- Provider filter dropdown
- Table view selector (Model/Account/API Key/Endpoint)
- Pagination page size selector

Tested in Chrome and Firefox with both light and dark themes.
This commit is contained in:
Zanuar Tri Romadon authored and GitHub committed 2026-05-10 21:07:59 +07:00
1 parent 530dc9cb3b
commit c7c1074f28
4 files changed
+20 -1

No files matched your search

+1
View File
@@ -63,6 +63,7 @@ export default function Pagination({
"text-sm text-text-main focus:outline-none focus:ring-2 focus:ring-primary/20",
"cursor-pointer"
)}
style={{ colorScheme: 'auto' }}
>
{[10, 20, 50].map((size) => (
<option key={size} value={size}>