H1K0
135c71ae4d
- Add --color-nav-bg and --color-nav-active CSS variables - Dark: semi-transparent purple-dark tone (rgba 52,50,73 / 0.45 bg) - Light: light semi-transparent background, accent-tinted active highlight - Footer background and active nav item now use variables instead of hardcoded dark values Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
40 lines
1.0 KiB
CSS
40 lines
1.0 KiB
CSS
@import 'tailwindcss';
|
|
|
|
@theme {
|
|
--color-bg-primary: #312F45;
|
|
--color-bg-secondary: #181721;
|
|
--color-bg-elevated: #111118;
|
|
--color-accent: #9592B5;
|
|
--color-accent-hover: #7D7AA4;
|
|
--color-text-primary: #f0f0f0;
|
|
--color-text-muted: #9999AD;
|
|
--color-danger: #DB6060;
|
|
--color-info: #4DC7ED;
|
|
--color-warning: #F5E872;
|
|
--color-tag-default: #444455;
|
|
--color-nav-bg: rgba(0, 0, 0, 0.45);
|
|
--color-nav-active: rgba(52, 50, 73, 0.72);
|
|
|
|
--font-sans: 'Epilogue', sans-serif;
|
|
}
|
|
|
|
:root[data-theme="light"] {
|
|
--color-bg-primary: #f5f5f5;
|
|
--color-bg-secondary: #ffffff;
|
|
--color-bg-elevated: #e8e8ec;
|
|
--color-accent: #6B68A0;
|
|
--color-accent-hover: #5A578F;
|
|
--color-text-primary: #111118;
|
|
--color-text-muted: #555566;
|
|
--color-tag-default: #ccccdd;
|
|
--color-nav-bg: rgba(240, 240, 245, 0.85);
|
|
--color-nav-active: rgba(90, 87, 143, 0.22);
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Epilogue';
|
|
src: url('/fonts/Epilogue-VariableFont_wght.ttf') format('truetype');
|
|
font-weight: 100 900;
|
|
font-display: swap;
|
|
}
|