89 lines
2.7 KiB
SCSS
89 lines
2.7 KiB
SCSS
@use '@lucas-labs/lui-micro' as lui;
|
|
@use './_utils/color-utils' as c;
|
|
@use './theme' as theme;
|
|
|
|
$is-dark: false;
|
|
$brand: #6296e2;
|
|
|
|
$colors: (
|
|
primary: c.variants($brand),
|
|
secondary: c.variants(#bcc0cc),
|
|
text: #484b60,
|
|
subtle: #656c90, // same as elevation/10
|
|
palette: (
|
|
'red': c.variants(#d20f39), // red
|
|
'orange': c.variants(#fe640b), // peach
|
|
'yellow': c.variants(#df8e1d), // yellow
|
|
'olive': c.variants(#e2f095),
|
|
'green': c.variants(#34ac56), // green
|
|
'teal': c.variants(#179299), // teal
|
|
'blue': c.variants(#1e66f5), // blue
|
|
'violet': c.variants(#7287fd), // lavender
|
|
'purple': c.variants(#8652e7), // mauve
|
|
'pink': c.variants(#ea76cb), // pink
|
|
'brown': c.variants(#dd7878), // flamingo
|
|
'black': c.variants(#181825), // black
|
|
'white': c.variants(#e6edf3), // white
|
|
),
|
|
elevation: (
|
|
'1': #fcfcfd, // elevation/1
|
|
'2': #f6f7f9, // elevation/2
|
|
'3': #eff1f5, // elevation/3
|
|
'4': #e6e9ef, // elevation/4
|
|
'5': #d7dce6, // elevation/5
|
|
'6': #bcc0cc, // elevation/6
|
|
'7': #9ba7bf, // elevation/7
|
|
'8': #838fae, // elevation/8
|
|
'9': #717a9f, // elevation/9
|
|
'10': #656c90, // elevation/10
|
|
'11': #565b77, // elevation/11
|
|
'12': #484b60, // elevation/12
|
|
)
|
|
);
|
|
|
|
$variables: (
|
|
'font-size': (
|
|
'xs': .714rem,
|
|
'sm': .857rem,
|
|
'md': 1rem,
|
|
'lg': 1.143rem,
|
|
'xl': 1.286rem,
|
|
),
|
|
'font-family': '-apple-system, "Segoe UI", system-ui, "SF Pro Text", Inter, Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
'code-font-family': 'ui-monospace, SFMono-Regular, "Source Code Pro", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace, var(--fonts-emoji)',
|
|
'emoji-font-family': '"Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla"',
|
|
'measure': (
|
|
'.25x': 4px,
|
|
'.375x': 6px,
|
|
'.5x': 8px,
|
|
'.75x': 12px,
|
|
'.875x': 14px,
|
|
'1x': 16px,
|
|
'1.25x': 20px,
|
|
'1.5x': 24px,
|
|
'2x': 32px,
|
|
'2.5x': 40px,
|
|
'3x': 48px,
|
|
'4x': 64px,
|
|
),
|
|
'navbar-logo': (
|
|
'width': 56px,
|
|
'height': 20px,
|
|
),
|
|
'repo-home': (
|
|
'sidebar-width': 296px,
|
|
)
|
|
);
|
|
|
|
// init lui-micro, css-vars only (no reboot, no basic)
|
|
@include lui.init(
|
|
$theme: (colors: $colors, variables: $variables),
|
|
$options: (
|
|
reboot: false,
|
|
basic: false,
|
|
fg-var-name: 'text',
|
|
bg-var-name: 'elevation/1',
|
|
),
|
|
);
|
|
|
|
@include theme.make-theme($is-dark); |