feat: make docs theme-aware using CSS variables

- Update Tailwind config to use CSS variables instead of hardcoded colors
- Colors now reference theme variables: var(--text-primary), var(--text-secondary), etc.
- Fix Tokyo Night theme: text-secondary corrected from #565f89 to #9aa5ce
- Typography plugin now uses var() for theme-aware prose styling
- Enables docs to respect theme system like rest of app
This commit is contained in:
2026-02-03 09:55:51 -05:00
parent 0c5c7e4e41
commit c2cc2361d9
2 changed files with 12 additions and 12 deletions
+11 -11
View File
@@ -21,20 +21,20 @@ const config: Config = {
800: '#075985',
900: '#0c4a6e',
},
'bg-primary': '#1a1b26',
'bg-secondary': '#16161e',
'text-primary': '#a9b1d6',
'text-secondary': '#565f89',
'accent': '#7aa2f7',
'border': '#414868',
'bg-primary': 'var(--bg-primary)',
'bg-secondary': 'var(--bg-secondary)',
'text-primary': 'var(--text-primary)',
'text-secondary': 'var(--text-secondary)',
'accent': 'var(--accent)',
'border': 'var(--border)',
},
typography: ({ theme }) => ({
invert: {
css: {
'--tw-prose-pre-bg': theme('colors.background.secondary'),
'--tw-prose-pre-bg': 'var(--bg-secondary)',
code: {
backgroundColor: theme('colors.background.primary'),
color: theme('colors.text.primary'),
backgroundColor: 'var(--bg-primary)',
color: 'var(--text-primary)',
fontWeight: '400',
},
'code::before': {
@@ -48,8 +48,8 @@ const config: Config = {
color: 'inherit',
},
pre: {
backgroundColor: theme('colors.background.secondary'),
color: theme('colors.text.primary'),
backgroundColor: 'var(--bg-secondary)',
color: 'var(--text-primary)',
},
},
},
+1 -1
View File
@@ -17,7 +17,7 @@
--bg-primary: #1a1b26;
--bg-secondary: #16161e;
--text-primary: #a9b1d6;
--text-secondary: #565f89;
--text-secondary: #9aa5ce;
--accent: #7aa2f7;
--border: #414868;
}