Replaced all hardcoded colors and JS template literal styling with Mantine's canonical approach using CSS modules and CSS variables. This ensures colors transition programmatically without JS interpolation. - Updated globals.css to use data-mantine-color-scheme selectors - Created CSS modules for all navigation components and chat page - Removed useComputedColorScheme/useMantineTheme hooks where not needed - Fixed body background to properly adapt to light/dark mode - All borders, backgrounds, and colors now use CSS variables - Maintained full theme support across all components 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
16 lines
289 B
CSS
16 lines
289 B
CSS
.header {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 100;
|
|
}
|
|
|
|
[data-mantine-color-scheme="light"] .header {
|
|
border-bottom: 1px solid var(--mantine-color-gray-3);
|
|
}
|
|
|
|
[data-mantine-color-scheme="dark"] .header {
|
|
border-bottom: 1px solid var(--mantine-color-dark-5);
|
|
}
|