From deb22a5c1b31c9b8cd4b6eb244b015cc6a1fbb88 Mon Sep 17 00:00:00 2001 From: Volpeon <git@volpeon.ink> Date: Mon, 9 Dec 2024 17:57:32 +0100 Subject: Init --- src/_core.vars.scss | 50 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/_core.vars.scss (limited to 'src/_core.vars.scss') diff --git a/src/_core.vars.scss b/src/_core.vars.scss new file mode 100644 index 0000000..65ebb65 --- /dev/null +++ b/src/_core.vars.scss @@ -0,0 +1,50 @@ +@use 'sass:list'; +@use 'sass:map'; +@use 'sass:math'; +@use 'iro-sass/src/props'; +@use 'iro-sass/src/easing'; +@use 'iro-design/src/functions' as fn; + +$themes-spec: ( + --light: ( + --levels: ( + --grays: ( + --50: (-16) .8 0, + --75: (-8) .9 0, + --100: (0) 1 0, + + --200: (easing.cubic-bezier(.2, .1, .7, 1, math.div(1, 7)) * 87) (1 + 1 * math.div(1, 7)) (-30 * math.div(1, 7)), + --300: (easing.cubic-bezier(.2, .1, .7, 1, math.div(2, 7)) * 87) (1 + 1 * math.div(2, 7)) (-30 * math.div(2, 7)), + --400: (easing.cubic-bezier(.2, .1, .7, 1, math.div(3, 7)) * 87) (1 + 1 * math.div(3, 7)) (-30 * math.div(3, 7)), + + --500: (easing.cubic-bezier(.2, .1, .7, 1, math.div(4, 7)) * 87) (1 + 1 * math.div(4, 7)) (-30 * math.div(4, 7)), + --600: (easing.cubic-bezier(.2, .1, .7, 1, math.div(5, 7)) * 87) (1 + 1 * math.div(5, 7)) (-30 * math.div(5, 7)), + --700: (easing.cubic-bezier(.2, .1, .7, 1, math.div(6, 7)) * 87) (1 + 1 * math.div(6, 7)) (-30 * math.div(6, 7)), + --800: (easing.cubic-bezier(.2, .1, .7, 1, math.div(7, 7)) * 87) (1 + 1 * math.div(7, 7)) (-30 * math.div(7, 7)), + --900: #000 + ), + ), + + --palettes: ( + --base: #edddc4 --grays, + ), + ), +); + +$themes: (); + +@each $theme-name, $theme in $themes-spec { + $compiled: props.def(--colors, (), 'color'); + + @each $palette-name, $palette in map.get($theme, --palettes) { + $base-color: list.nth($palette, 1); + $levels: list.nth($palette, 2); + + $palette: fn.palette($base-color, map.get($theme, --levels, $levels), list.nth(map.get($theme, --palettes, --base), 1)); + $compiled: props.merge($compiled, ( $palette-name: $palette )); + } + + $themes: map.set($themes, $theme-name, $compiled); +} + +$theme: map.get($themes, --light); -- cgit v1.2.3-70-g09d2