My personal website
1import { cn } from '@/lib/utils';
2import { PageTheme } from './Layout.types';
3
4export const getLayoutStyles = (theme: PageTheme = 'default') =>
5 cn(
6 'grid grid-cols-1 md:grid-cols-[2fr_auto_1fr] min-h-screen gap-0',
7 // Accent theme: blue (light) / mediumblue (dark), white text
8 theme === 'accent' && 'bg-bones-blue dark:bg-bones-mediumblue text-bones-white',
9 // Default theme: white (light) / black (dark), black/white text
10 theme === 'default' && 'bg-bones-white dark:bg-bones-black text-bones-black dark:text-bones-white',
11 );
12
13export const main = 'p-12';
14
15export const getAsideStyles = (theme: PageTheme = 'default') =>
16 cn(
17 'p-12',
18 // Theme-specific styles (border removed - now using Divider component)
19 );