diff options
Diffstat (limited to 'src/_config.scss')
| -rw-r--r-- | src/_config.scss | 97 |
1 files changed, 48 insertions, 49 deletions
diff --git a/src/_config.scss b/src/_config.scss index 5449a04..3ec6607 100644 --- a/src/_config.scss +++ b/src/_config.scss | |||
| @@ -5,7 +5,6 @@ | |||
| 5 | @use 'iro-sass/src/responsive' as res; | 5 | @use 'iro-sass/src/responsive' as res; |
| 6 | @use 'iro-sass/src/easing' as easing; | 6 | @use 'iro-sass/src/easing' as easing; |
| 7 | @use 'include-media/dist/include-media' as media; | 7 | @use 'include-media/dist/include-media' as media; |
| 8 | @use '@oddbird/blend'; | ||
| 9 | 8 | ||
| 10 | iro.$vars-root-size: 16px; | 9 | iro.$vars-root-size: 16px; |
| 11 | 10 | ||
| @@ -25,7 +24,7 @@ media.$unit-intervals: ( | |||
| 25 | 24 | ||
| 26 | res.$named-viewports: media.$breakpoints; | 25 | res.$named-viewports: media.$breakpoints; |
| 27 | 26 | ||
| 28 | $palette-precision: 0.01 !default; | 27 | $palette-precision: .01 !default; |
| 29 | 28 | ||
| 30 | $palette-chroma-easing: 'ease' !default; | 29 | $palette-chroma-easing: 'ease' !default; |
| 31 | 30 | ||
| @@ -33,27 +32,27 @@ $static-colors: ( | |||
| 33 | --base: hsl(0, 0%, 98%), | 32 | --base: hsl(0, 0%, 98%), |
| 34 | 33 | ||
| 35 | --contrasts: ( | 34 | --contrasts: ( |
| 36 | --100: math.div( 0, 12) * 110 - 10, | 35 | --100: math.div(0, 12) * 110 - 10, |
| 37 | --200: math.div( 1, 12) * 110 - 10, | 36 | --200: math.div(1, 12) * 110 - 10, |
| 38 | --300: math.div( 2, 12) * 110 - 10, | 37 | --300: math.div(2, 12) * 110 - 10, |
| 39 | --400: math.div( 3, 12) * 110 - 10, | 38 | --400: math.div(3, 12) * 110 - 10, |
| 40 | --500: math.div( 4, 12) * 110 - 10, | 39 | --500: math.div(4, 12) * 110 - 10, |
| 41 | --600: math.div( 5, 12) * 110 - 10, | 40 | --600: math.div(5, 12) * 110 - 10, |
| 42 | --700: math.div( 6, 12) * 110 - 10, | 41 | --700: math.div(6, 12) * 110 - 10, |
| 43 | --800: math.div( 7, 12) * 110 - 10, | 42 | --800: math.div(7, 12) * 110 - 10, |
| 44 | --900: math.div( 8, 12) * 110 - 10, | 43 | --900: math.div(8, 12) * 110 - 10, |
| 45 | --1000: math.div( 9, 12) * 110 - 10, | 44 | --1000: math.div(9, 12) * 110 - 10, |
| 46 | --1100: math.div(10, 12) * 110 - 10, | 45 | --1100: math.div(10, 12) * 110 - 10, |
| 47 | --1200: math.div(11, 12) * 110 - 10, | 46 | --1200: math.div(11, 12) * 110 - 10, |
| 48 | --1300: math.div(12, 12) * 110 - 10, | 47 | --1300: math.div(12, 12) * 110 - 10, |
| 49 | ), | 48 | ), |
| 50 | 49 | ||
| 51 | --palettes: ( | 50 | --palettes: ( |
| 52 | --blue: oklch(56% 0.14 265.25), | 51 | --blue: oklch(56% .14 265.25), |
| 53 | --purple: oklch(56% 0.14 305.58), | 52 | --purple: oklch(56% .14 305.58), |
| 54 | --red: oklch(56% 0.14 18.69), | 53 | --red: oklch(56% .14 18.69), |
| 55 | --green: oklch(56% 0.14 150.48), | 54 | --green: oklch(56% .14 150.48), |
| 56 | --yellow: oklch(56% 0.14 84.08), | 55 | --yellow: oklch(56% .14 84.08), |
| 57 | ), | 56 | ), |
| 58 | 57 | ||
| 59 | --transparents: ( | 58 | --transparents: ( |
| @@ -121,16 +120,16 @@ $theme-light: ( | |||
| 121 | ), | 120 | ), |
| 122 | 121 | ||
| 123 | --colors: ( | 122 | --colors: ( |
| 124 | --100: math.div( 0, 12) * 96 + 5, | 123 | --100: math.div(0, 12) * 96 + 5, |
| 125 | --200: math.div( 1, 12) * 96 + 5, | 124 | --200: math.div(1, 12) * 96 + 5, |
| 126 | --300: math.div( 2, 12) * 96 + 5, | 125 | --300: math.div(2, 12) * 96 + 5, |
| 127 | --400: math.div( 3, 12) * 96 + 5, | 126 | --400: math.div(3, 12) * 96 + 5, |
| 128 | --500: math.div( 4, 12) * 96 + 5, | 127 | --500: math.div(4, 12) * 96 + 5, |
| 129 | --600: math.div( 5, 12) * 96 + 5, | 128 | --600: math.div(5, 12) * 96 + 5, |
| 130 | --700: math.div( 6, 12) * 96 + 5, | 129 | --700: math.div(6, 12) * 96 + 5, |
| 131 | --800: math.div( 7, 12) * 96 + 5, | 130 | --800: math.div(7, 12) * 96 + 5, |
| 132 | --900: math.div( 8, 12) * 96 + 5, | 131 | --900: math.div(8, 12) * 96 + 5, |
| 133 | --1000: math.div( 9, 12) * 96 + 5, | 132 | --1000: math.div(9, 12) * 96 + 5, |
| 134 | --1100: math.div(10, 12) * 96 + 5, | 133 | --1100: math.div(10, 12) * 96 + 5, |
| 135 | --1200: math.div(11, 12) * 96 + 5, | 134 | --1200: math.div(11, 12) * 96 + 5, |
| 136 | --1300: math.div(12, 12) * 96 + 5, | 135 | --1300: math.div(12, 12) * 96 + 5, |
| @@ -144,11 +143,11 @@ $theme-light: ( | |||
| 144 | 143 | ||
| 145 | --palettes: ( | 144 | --palettes: ( |
| 146 | --base: hsl(0, 0%, 98%) --grays --full, | 145 | --base: hsl(0, 0%, 98%) --grays --full, |
| 147 | --blue: oklch(56% 0.16 265.25) --colors --muted, | 146 | --blue: oklch(56% .16 265.25) --colors --muted, |
| 148 | --purple: oklch(56% 0.16 305.58) --colors --muted, | 147 | --purple: oklch(56% .16 305.58) --colors --muted, |
| 149 | --red: oklch(56% 0.16 18.69) --colors --muted, | 148 | --red: oklch(56% .16 18.69) --colors --muted, |
| 150 | --green: oklch(56% 0.16 150.48) --colors --muted, | 149 | --green: oklch(56% .16 150.48) --colors --muted, |
| 151 | --yellow: oklch(56% 0.16 84.08) --colors --muted, | 150 | --yellow: oklch(56% .16 84.08) --colors --muted, |
| 152 | ), | 151 | ), |
| 153 | 152 | ||
| 154 | --semantic: map.merge($semantic-colors-common, ( | 153 | --semantic: map.merge($semantic-colors-common, ( |
| @@ -158,7 +157,7 @@ $theme-light: ( | |||
| 158 | )), | 157 | )), |
| 159 | 158 | ||
| 160 | --constants: ( | 159 | --constants: ( |
| 161 | --shadow: rgba(#000, 0.15), | 160 | --shadow: rgba(#000, .15), |
| 162 | ), | 161 | ), |
| 163 | ) !default; | 162 | ) !default; |
| 164 | 163 | ||
| @@ -181,16 +180,16 @@ $theme-dark: ( | |||
| 181 | ), | 180 | ), |
| 182 | 181 | ||
| 183 | --colors: ( | 182 | --colors: ( |
| 184 | --100: math.div( 0, 12) * -100 - 5, | 183 | --100: math.div(0, 12) * -100 - 5, |
| 185 | --200: math.div( 1, 12) * -100 - 5, | 184 | --200: math.div(1, 12) * -100 - 5, |
| 186 | --300: math.div( 2, 12) * -100 - 5, | 185 | --300: math.div(2, 12) * -100 - 5, |
| 187 | --400: math.div( 3, 12) * -100 - 5, | 186 | --400: math.div(3, 12) * -100 - 5, |
| 188 | --500: math.div( 4, 12) * -100 - 5, | 187 | --500: math.div(4, 12) * -100 - 5, |
| 189 | --600: math.div( 5, 12) * -100 - 5, | 188 | --600: math.div(5, 12) * -100 - 5, |
| 190 | --700: math.div( 6, 12) * -100 - 5, | 189 | --700: math.div(6, 12) * -100 - 5, |
| 191 | --800: math.div( 7, 12) * -100 - 5, | 190 | --800: math.div(7, 12) * -100 - 5, |
| 192 | --900: math.div( 8, 12) * -100 - 5, | 191 | --900: math.div(8, 12) * -100 - 5, |
| 193 | --1000: math.div( 9, 12) * -100 - 5, | 192 | --1000: math.div(9, 12) * -100 - 5, |
| 194 | --1100: math.div(10, 12) * -100 - 5, | 193 | --1100: math.div(10, 12) * -100 - 5, |
| 195 | --1200: math.div(11, 12) * -100 - 5, | 194 | --1200: math.div(11, 12) * -100 - 5, |
| 196 | --1300: math.div(12, 12) * -100 - 5, | 195 | --1300: math.div(12, 12) * -100 - 5, |
| @@ -204,11 +203,11 @@ $theme-dark: ( | |||
| 204 | 203 | ||
| 205 | --palettes: ( | 204 | --palettes: ( |
| 206 | --base: hsl(0, 0%, 20%) --grays --full, | 205 | --base: hsl(0, 0%, 20%) --grays --full, |
| 207 | --blue: oklch(56% 0.16 265.25) --colors --muted, | 206 | --blue: oklch(56% .16 265.25) --colors --muted, |
| 208 | --purple: oklch(56% 0.16 305.58) --colors --muted, | 207 | --purple: oklch(56% .16 305.58) --colors --muted, |
| 209 | --red: oklch(56% 0.16 18.69) --colors --muted, | 208 | --red: oklch(56% .16 18.69) --colors --muted, |
| 210 | --green: oklch(56% 0.16 150.48) --colors --muted, | 209 | --green: oklch(56% .16 150.48) --colors --muted, |
| 211 | --yellow: oklch(56% 0.16 84.08) --colors --muted, | 210 | --yellow: oklch(56% .16 84.08) --colors --muted, |
| 212 | ), | 211 | ), |
| 213 | 212 | ||
| 214 | --semantic: map.merge($semantic-colors-common, ( | 213 | --semantic: map.merge($semantic-colors-common, ( |
| @@ -218,7 +217,7 @@ $theme-dark: ( | |||
| 218 | )), | 217 | )), |
| 219 | 218 | ||
| 220 | --constants: ( | 219 | --constants: ( |
| 221 | --shadow: rgba(#000, 0.5), | 220 | --shadow: rgba(#000, .5), |
| 222 | ), | 221 | ), |
| 223 | ) !default; | 222 | ) !default; |
| 224 | 223 | ||
