This commit introduces dark mode support by defining CSS variables and applies optimizations for mobile devices by reducing polygon counts in 3D models. Co-authored-by: matissjurevics <matissjurevics@gmail.com>
30 lines
725 B
CSS
30 lines
725 B
CSS
:root {
|
|
/* Teenage Engineering Palette - Dark mode default */
|
|
--bg-color: #0a0a0a;
|
|
--text-main: #e4e4e4;
|
|
--text-dim: #888888;
|
|
--accent-orange: #ff4d00;
|
|
--grid-line: #333333;
|
|
--product-bg: #1a1a1a;
|
|
--product-bg-hover: #2a2a2a;
|
|
|
|
/* Typos */
|
|
--font-main: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
--spacing-unit: 8px;
|
|
|
|
/* Layout */
|
|
--header-height: 60px;
|
|
}
|
|
|
|
@media (prefers-color-scheme: light) {
|
|
:root {
|
|
/* Light mode overrides */
|
|
--bg-color: #e4e4e4;
|
|
--text-main: #000000;
|
|
--text-dim: #666666;
|
|
--grid-line: #cccccc;
|
|
--product-bg: #f5f5f5;
|
|
--product-bg-hover: #ffffff;
|
|
}
|
|
}
|