@graupl/core 1.0.0-beta.22 → 1.0.0-beta.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/css/base/button.css +2 -2
- package/dist/css/base/button.css.map +1 -1
- package/dist/css/base/form.css +2 -2
- package/dist/css/base/form.css.map +1 -1
- package/dist/css/base/link.css +2 -2
- package/dist/css/base/link.css.map +1 -1
- package/dist/css/base/table.css +2 -2
- package/dist/css/base/table.css.map +1 -1
- package/dist/css/base.css +2 -2
- package/dist/css/base.css.map +1 -1
- package/dist/css/component/accordion.css +2 -5
- package/dist/css/component/accordion.css.map +1 -1
- package/dist/css/component/alert.css +2 -2
- package/dist/css/component/alert.css.map +1 -1
- package/dist/css/component/badge.css +2 -2
- package/dist/css/component/badge.css.map +1 -1
- package/dist/css/component/card.css +2 -2
- package/dist/css/component/card.css.map +1 -1
- package/dist/css/component/carousel.css +2 -2
- package/dist/css/component/carousel.css.map +1 -1
- package/dist/css/component/disclosure.css +2 -2
- package/dist/css/component/disclosure.css.map +1 -1
- package/dist/css/component/input-group.css +2 -2
- package/dist/css/component/input-group.css.map +1 -1
- package/dist/css/component/list.css +2 -2
- package/dist/css/component/list.css.map +1 -1
- package/dist/css/component/menu.css +2 -2
- package/dist/css/component/menu.css.map +1 -1
- package/dist/css/component/navigation.css +2 -2
- package/dist/css/component/navigation.css.map +1 -1
- package/dist/css/component.css +2 -5
- package/dist/css/component.css.map +1 -1
- package/dist/css/graupl.css +2 -5
- package/dist/css/graupl.css.map +1 -1
- package/dist/css/init.css +2 -2
- package/dist/css/init.css.map +1 -1
- package/dist/css/layout/columns.css +2 -2
- package/dist/css/layout/columns.css.map +1 -1
- package/dist/css/layout/container.css +2 -2
- package/dist/css/layout/container.css.map +1 -1
- package/dist/css/layout/flex-columns.css +2 -2
- package/dist/css/layout/flex-columns.css.map +1 -1
- package/dist/css/layout.css +2 -5
- package/dist/css/layout.css.map +1 -1
- package/dist/css/normalize.css +2 -2
- package/dist/css/normalize.css.map +1 -1
- package/dist/css/state/focus.css +2 -2
- package/dist/css/state/focus.css.map +1 -1
- package/dist/css/state.css +2 -2
- package/dist/css/state.css.map +1 -1
- package/dist/css/theme/color.css +2 -2
- package/dist/css/theme/color.css.map +1 -1
- package/dist/css/theme/typography.css +2 -2
- package/dist/css/theme/typography.css.map +1 -1
- package/dist/css/theme.css +2 -2
- package/dist/css/theme.css.map +1 -1
- package/dist/css/utilities/alignment.css +1 -1
- package/dist/css/utilities/alignment.css.map +1 -1
- package/dist/css/utilities/background.css +2 -2
- package/dist/css/utilities/background.css.map +1 -1
- package/dist/css/utilities/border.css +2 -2
- package/dist/css/utilities/border.css.map +1 -1
- package/dist/css/utilities/color.css +2 -2
- package/dist/css/utilities/color.css.map +1 -1
- package/dist/css/utilities/container.css +1 -1
- package/dist/css/utilities/container.css.map +1 -1
- package/dist/css/utilities/display.css +2 -2
- package/dist/css/utilities/display.css.map +1 -1
- package/dist/css/utilities/flex.css +2 -2
- package/dist/css/utilities/flex.css.map +1 -1
- package/dist/css/utilities/gradient.css +2 -2
- package/dist/css/utilities/gradient.css.map +1 -1
- package/dist/css/utilities/height.css +2 -2
- package/dist/css/utilities/height.css.map +1 -1
- package/dist/css/utilities/inset.css +2 -2
- package/dist/css/utilities/inset.css.map +1 -1
- package/dist/css/utilities/justification.css +1 -1
- package/dist/css/utilities/justification.css.map +1 -1
- package/dist/css/utilities/list.css +1 -1
- package/dist/css/utilities/list.css.map +1 -1
- package/dist/css/utilities/order.css +2 -2
- package/dist/css/utilities/order.css.map +1 -1
- package/dist/css/utilities/position.css +2 -2
- package/dist/css/utilities/position.css.map +1 -1
- package/dist/css/utilities/ratio.css +2 -2
- package/dist/css/utilities/ratio.css.map +1 -1
- package/dist/css/utilities/spacing.css +2 -2
- package/dist/css/utilities/spacing.css.map +1 -1
- package/dist/css/utilities/typography.css +2 -2
- package/dist/css/utilities/typography.css.map +1 -1
- package/dist/css/utilities/visibility.css +2 -2
- package/dist/css/utilities/visibility.css.map +1 -1
- package/dist/css/utilities/visually-hidden.css +2 -2
- package/dist/css/utilities/visually-hidden.css.map +1 -1
- package/dist/css/utilities/width.css +2 -2
- package/dist/css/utilities/width.css.map +1 -1
- package/dist/css/utilities/z-index.css +1 -1
- package/dist/css/utilities/z-index.css.map +1 -1
- package/dist/css/utilities.css +2 -2
- package/dist/css/utilities.css.map +1 -1
- package/dist/js/accordion.js.map +1 -1
- package/dist/js/alert.js.map +1 -1
- package/dist/js/carousel.js.map +1 -1
- package/dist/js/component/accordion.cjs.js.map +1 -1
- package/dist/js/component/accordion.es.js.map +1 -1
- package/dist/js/component/accordion.iife.js.map +1 -1
- package/dist/js/component/alert.cjs.js.map +1 -1
- package/dist/js/component/alert.es.js.map +1 -1
- package/dist/js/component/alert.iife.js.map +1 -1
- package/dist/js/component/carousel.cjs.js.map +1 -1
- package/dist/js/component/carousel.es.js.map +1 -1
- package/dist/js/component/carousel.iife.js.map +1 -1
- package/dist/js/component/disclosure.cjs.js +2 -2
- package/dist/js/component/disclosure.cjs.js.map +1 -1
- package/dist/js/component/disclosure.es.js +2 -2
- package/dist/js/component/disclosure.es.js.map +1 -1
- package/dist/js/component/disclosure.iife.js +2 -2
- package/dist/js/component/disclosure.iife.js.map +1 -1
- package/dist/js/component/tabs.cjs.js +5 -0
- package/dist/js/component/tabs.cjs.js.map +1 -0
- package/dist/js/component/tabs.es.js +5 -0
- package/dist/js/component/tabs.es.js.map +1 -0
- package/dist/js/component/tabs.iife.js +5 -0
- package/dist/js/component/tabs.iife.js.map +1 -0
- package/dist/js/disclosure.js +2 -2
- package/dist/js/disclosure.js.map +1 -1
- package/dist/js/generator/accordion.cjs.js.map +1 -1
- package/dist/js/generator/accordion.es.js.map +1 -1
- package/dist/js/generator/accordion.iife.js.map +1 -1
- package/dist/js/generator/alert.cjs.js.map +1 -1
- package/dist/js/generator/alert.es.js.map +1 -1
- package/dist/js/generator/alert.iife.js.map +1 -1
- package/dist/js/generator/carousel.cjs.js.map +1 -1
- package/dist/js/generator/carousel.es.js.map +1 -1
- package/dist/js/generator/carousel.iife.js.map +1 -1
- package/dist/js/generator/disclosure.cjs.js +2 -2
- package/dist/js/generator/disclosure.cjs.js.map +1 -1
- package/dist/js/generator/disclosure.es.js +2 -2
- package/dist/js/generator/disclosure.es.js.map +1 -1
- package/dist/js/generator/disclosure.iife.js +2 -2
- package/dist/js/generator/disclosure.iife.js.map +1 -1
- package/dist/js/generator/navigation.cjs.js.map +1 -1
- package/dist/js/generator/navigation.es.js.map +1 -1
- package/dist/js/generator/navigation.iife.js.map +1 -1
- package/dist/js/generator/tabs.cjs.js +5 -0
- package/dist/js/generator/tabs.cjs.js.map +1 -0
- package/dist/js/generator/tabs.es.js +5 -0
- package/dist/js/generator/tabs.es.js.map +1 -0
- package/dist/js/generator/tabs.iife.js +5 -0
- package/dist/js/generator/tabs.iife.js.map +1 -0
- package/dist/js/graupl.js +5 -5
- package/dist/js/graupl.js.map +1 -1
- package/dist/js/navigation.js.map +1 -1
- package/dist/js/tabs.js +5 -0
- package/dist/js/tabs.js.map +1 -0
- package/package.json +4 -3
- package/src/js/disclosure/Disclosure.js +25 -45
- package/src/js/domHelpers.js +39 -22
- package/src/js/tabs/TabToggle.js +378 -0
- package/src/js/tabs/Tabs.js +1091 -0
- package/src/js/tabs/generator.js +32 -0
- package/src/js/tabs/index.js +5 -0
- package/src/scss/_defaults.scss +21 -88
- package/src/scss/_variables.scss +70 -0
- package/src/scss/base/button/_defaults.scss +2 -24
- package/src/scss/base/button/_index.scss +53 -52
- package/src/scss/base/button/_mixins.scss +24 -58
- package/src/scss/base/button/_variables.scss +139 -0
- package/src/scss/base/form/_defaults.scss +72 -2
- package/src/scss/base/form/_index.scss +196 -70
- package/src/scss/base/form/_variables.scss +166 -0
- package/src/scss/base/link/_defaults.scss +31 -0
- package/src/scss/base/link/_index.scss +177 -172
- package/src/scss/base/link/_variables.scss +215 -0
- package/src/scss/base/table/_defaults.scss +1 -11
- package/src/scss/base/table/_index.scss +126 -117
- package/src/scss/base/table/_variables.scss +214 -3
- package/src/scss/component/_index.scss +1 -0
- package/src/scss/component/accordion/_defaults.scss +73 -22
- package/src/scss/component/accordion/_index.scss +437 -62
- package/src/scss/component/accordion/_variables.scss +527 -101
- package/src/scss/component/alert/_defaults.scss +23 -32
- package/src/scss/component/alert/_index.scss +236 -30
- package/src/scss/component/alert/_variables.scss +155 -6
- package/src/scss/component/badge/_defaults.scss +1 -0
- package/src/scss/component/badge/_index.scss +25 -28
- package/src/scss/component/badge/_variables.scss +66 -2
- package/src/scss/component/card/_defaults.scss +64 -13
- package/src/scss/component/card/_index.scss +276 -30
- package/src/scss/component/card/_variables.scss +132 -0
- package/src/scss/component/carousel/_defaults.scss +73 -15
- package/src/scss/component/carousel/_index.scss +357 -41
- package/src/scss/component/carousel/_variables.scss +391 -0
- package/src/scss/component/disclosure/_index.scss +4 -4
- package/src/scss/component/disclosure/_variables.scss +127 -2
- package/src/scss/component/input-group/_defaults.scss +10 -3
- package/src/scss/component/input-group/_index.scss +72 -4
- package/src/scss/component/input-group/_variables.scss +37 -0
- package/src/scss/component/list/_defaults.scss +35 -2
- package/src/scss/component/list/_index.scss +159 -5
- package/src/scss/component/list/_variables.scss +152 -0
- package/src/scss/component/menu/_defaults.scss +49 -7
- package/src/scss/component/menu/_index.scss +325 -99
- package/src/scss/component/menu/_variables.scss +484 -1
- package/src/scss/component/navigation/_defaults.scss +45 -3
- package/src/scss/component/navigation/_index.scss +249 -98
- package/src/scss/component/navigation/_variables.scss +334 -5
- package/src/scss/component/tabs/_defaults.scss +82 -0
- package/src/scss/component/tabs/_index.scss +497 -0
- package/src/scss/component/tabs/_variables.scss +974 -0
- package/src/scss/layout/columns/_defaults.scss +5 -3
- package/src/scss/layout/columns/_index.scss +27 -21
- package/src/scss/layout/columns/_variables.scss +13 -0
- package/src/scss/layout/container/_defaults.scss +28 -11
- package/src/scss/layout/container/_index.scss +305 -161
- package/src/scss/layout/container/_variables.scss +148 -15
- package/src/scss/layout/flex-columns/_defaults.scss +5 -3
- package/src/scss/layout/flex-columns/_index.scss +28 -20
- package/src/scss/layout/flex-columns/_variables.scss +9 -0
- package/src/scss/mixins/_state.scss +37 -0
- package/src/scss/mixins/_theme.scss +36 -1
- package/src/scss/state/focus/_index.scss +17 -12
- package/src/scss/state/focus/_variables.scss +30 -4
- package/src/scss/theme/color/_defaults.scss +6 -35
- package/src/scss/theme/color/_index.scss +167 -1
- package/src/scss/theme/color/_variables.scss +155 -0
- package/src/scss/theme/typography/_defaults.scss +26 -19
- package/src/scss/theme/typography/_index.scss +176 -20
- package/src/scss/theme/typography/_variables.scss +186 -0
- package/src/scss/utilities/_template/_index.scss +0 -1
- package/src/scss/utilities/alignment/_defaults.scss +0 -33
- package/src/scss/utilities/alignment/_index.scss +24 -25
- package/src/scss/utilities/background/_defaults.scss +0 -77
- package/src/scss/utilities/background/_index.scss +32 -37
- package/src/scss/utilities/border/_defaults.scss +0 -33
- package/src/scss/utilities/border/_index.scss +25 -26
- package/src/scss/utilities/color/_defaults.scss +0 -19
- package/src/scss/utilities/color/_index.scss +22 -22
- package/src/scss/utilities/container/_defaults.scss +0 -11
- package/src/scss/utilities/container/_index.scss +20 -19
- package/src/scss/utilities/display/_defaults.scss +0 -11
- package/src/scss/utilities/display/_index.scss +20 -19
- package/src/scss/utilities/flex/_defaults.scss +0 -55
- package/src/scss/utilities/flex/_index.scss +28 -31
- package/src/scss/utilities/gradient/_defaults.scss +0 -28
- package/src/scss/utilities/gradient/_index.scss +27 -28
- package/src/scss/utilities/gradient/_variables.scss +15 -0
- package/src/scss/utilities/height/_defaults.scss +0 -8
- package/src/scss/utilities/height/_index.scss +22 -21
- package/src/scss/utilities/inset/_defaults.scss +0 -16
- package/src/scss/utilities/inset/_index.scss +20 -20
- package/src/scss/utilities/justification/_defaults.scss +0 -33
- package/src/scss/utilities/justification/_index.scss +24 -25
- package/src/scss/utilities/list/_defaults.scss +0 -22
- package/src/scss/utilities/list/_index.scss +22 -22
- package/src/scss/utilities/order/_defaults.scss +0 -8
- package/src/scss/utilities/order/_index.scss +20 -19
- package/src/scss/utilities/position/_defaults.scss +0 -11
- package/src/scss/utilities/position/_index.scss +20 -19
- package/src/scss/utilities/ratio/_defaults.scss +0 -8
- package/src/scss/utilities/ratio/_index.scss +22 -21
- package/src/scss/utilities/ratio/_variables.scss +6 -0
- package/src/scss/utilities/spacing/_defaults.scss +0 -11
- package/src/scss/utilities/spacing/_index.scss +18 -17
- package/src/scss/utilities/typography/_defaults.scss +0 -22
- package/src/scss/utilities/typography/_index.scss +27 -26
- package/src/scss/utilities/visibility/_defaults.scss +0 -11
- package/src/scss/utilities/visibility/_index.scss +19 -18
- package/src/scss/utilities/visually-hidden/_index.scss +19 -17
- package/src/scss/utilities/width/_defaults.scss +0 -8
- package/src/scss/utilities/width/_index.scss +21 -20
- package/src/scss/utilities/z-index/_defaults.scss +0 -11
- package/src/scss/utilities/z-index/_index.scss +19 -18
package/dist/css/theme.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer graupl.theme{:root{background:var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))));color:var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-primary:#2063df;--graupl-primary--100:#e6eeff;--graupl-primary--200:#9ebefa;--graupl-primary--300:#5e90ed;--graupl-primary--400:#3672e2;--graupl-primary--500:#2063df;--graupl-primary--600:#1d59c9;--graupl-primary--700:#1244a1;--graupl-primary--800:#052561;--graupl-primary--900:#001233;--graupl-secondary:#6c7093;--graupl-secondary--100:#edeef7;--graupl-secondary--200:#bdbfdb;--graupl-secondary--300:#9497b8;--graupl-secondary--400:#7b7e9d;--graupl-secondary--500:#6c7093;--graupl-secondary--600:#626484;--graupl-secondary--700:#474a6b;--graupl-secondary--800:#242642;--graupl-secondary--900:#0f1124;--graupl-tertiary:#c36;--graupl-tertiary--100:#fde7ef;--graupl-tertiary--200:#f2a6bf;--graupl-tertiary--300:#e06c92;--graupl-tertiary--400:#d14775;--graupl-tertiary--500:#c36;--graupl-tertiary--600:#b82e5c;--graupl-tertiary--700:#931f46;--graupl-tertiary--800:#590d26;--graupl-tertiary--900:#2f0412;--graupl-theme-active--primary:var(--graupl-theme--light--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--primary--200:var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--300:var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--400:var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--500:var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--700:var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--800:var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--900:var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233));--graupl-theme-active--secondary:var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--secondary--200:var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--300:var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--400:var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--500:var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--700:var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--800:var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--900:var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--tertiary:var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef));--graupl-theme-active--tertiary--200:var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--300:var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--400:var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--500:var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--700:var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--800:var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--900:var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412))}.active-mode{--graupl-theme-active--primary:var(--graupl-theme-active--primary,var(--graupl-theme--light--primary,var(--graupl-primary,#2063df)));--graupl-theme-active--primary--100:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-theme-active--primary--200:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-theme-active--primary--300:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)));--graupl-theme-active--primary--400:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)));--graupl-theme-active--primary--500:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)));--graupl-theme-active--primary--600:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)));--graupl-theme-active--primary--700:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-theme-active--primary--800:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)));--graupl-theme-active--primary--900:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-theme-active--secondary:var(--graupl-theme-active--secondary,var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093)));--graupl-theme-active--secondary--100:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-theme-active--secondary--200:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-theme-active--secondary--300:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)));--graupl-theme-active--secondary--400:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)));--graupl-theme-active--secondary--500:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)));--graupl-theme-active--secondary--600:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)));--graupl-theme-active--secondary--700:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-theme-active--secondary--800:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)));--graupl-theme-active--secondary--900:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-theme-active--tertiary:var(--graupl-theme-active--tertiary,var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36)));--graupl-theme-active--tertiary--100:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-theme-active--tertiary--200:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-theme-active--tertiary--300:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)));--graupl-theme-active--tertiary--400:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)));--graupl-theme-active--tertiary--500:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)));--graupl-theme-active--tertiary--600:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)));--graupl-theme-active--tertiary--700:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-theme-active--tertiary--800:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)));--graupl-theme-active--tertiary--900:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));color-scheme:active}.light-mode{--graupl-theme-active--primary:var(--graupl-theme--light--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--primary--200:var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--300:var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--400:var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--500:var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--700:var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--800:var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--900:var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233));--graupl-theme-active--secondary:var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--secondary--200:var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--300:var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--400:var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--500:var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--700:var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--800:var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--900:var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--tertiary:var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef));--graupl-theme-active--tertiary--200:var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--300:var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--400:var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--500:var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--700:var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--800:var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--900:var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412));color-scheme:light}.dark-mode{--graupl-theme-active--primary:var(--graupl-theme--dark--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-dark--primary--100,var(--graupl-primary--900,#001233));--graupl-theme-active--primary--200:var(--graupl-theme-dark--primary--200,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--300:var(--graupl-theme-dark--primary--300,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--400:var(--graupl-theme-dark--primary--400,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--500:var(--graupl-theme-dark--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-dark--primary--600,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--700:var(--graupl-theme-dark--primary--700,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--800:var(--graupl-theme-dark--primary--800,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--900:var(--graupl-theme-dark--primary--900,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--secondary:var(--graupl-theme--dark--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-dark--secondary--100,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--secondary--200:var(--graupl-theme-dark--secondary--200,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--300:var(--graupl-theme-dark--secondary--300,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--400:var(--graupl-theme-dark--secondary--400,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--500:var(--graupl-theme-dark--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-dark--secondary--600,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--700:var(--graupl-theme-dark--secondary--700,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--800:var(--graupl-theme-dark--secondary--800,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--900:var(--graupl-theme-dark--secondary--900,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--tertiary:var(--graupl-theme--dark--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-dark--tertiary--100,var(--graupl-tertiary--900,#2f0412));--graupl-theme-active--tertiary--200:var(--graupl-theme-dark--tertiary--200,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--300:var(--graupl-theme-dark--tertiary--300,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--400:var(--graupl-theme-dark--tertiary--400,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--500:var(--graupl-theme-dark--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-dark--tertiary--600,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--700:var(--graupl-theme-dark--tertiary--700,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--800:var(--graupl-theme-dark--tertiary--800,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--900:var(--graupl-theme-dark--tertiary--900,var(--graupl-tertiary--100,#fde7ef));color-scheme:dark}}@layer graupl.base{p{margin:var(--graupl-paragraph-margin,0 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0)}small{margin:var(--graupl-small-margin,0 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0)}h1{margin:var(--graupl-h1-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}h2{margin:var(--graupl-h2-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}h3{margin:var(--graupl-h3-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}h4{margin:var(--graupl-h4-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}h5{margin:var(--graupl-h5-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}h6{margin:var(--graupl-h6-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)) 0 var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)) 0))}}@layer graupl.theme{:root{font-family:var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif);font-size:var(--graupl-root-font-size,clamp(.85rem,.8rem + .5vw,1.25rem))}b,strong{font-weight:var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))}body{color:var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))));font-size:var(--graupl-body-font-size,var(--graupl-font-base,calc(var(--graupl-font-size-base, 1rem)*1)));font-weight:var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400));line-height:var(--graupl-body-line-height,var(--graupl-line-height,1.2em))}p{color:var(--graupl-paragraph-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));font-size:var(--graupl-paragraph-font-size,var(--graupl-body-font-size,var(--graupl-font-base,calc(var(--graupl-font-size-base, 1rem)*1))));font-weight:var(--graupl-paragraph-font-weight,var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400)));line-height:var(--graupl-paragraph-line-height,var(--graupl-body-line-height,var(--graupl-line-height,1.2em)))}small{color:var(--graupl-small-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));font-size:var(--graupl-small-font-size,var(--graupl-font-sm,calc(var(--graupl-font-size-base, 1rem)*.833)));font-weight:var(--graupl-small-font-weight,var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400)));line-height:var(--graupl-small-line-height,var(--graupl-line-height,1.2em))}h1{color:var(--graupl-h1-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h1-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h1-font-size,var(--graupl-font-5xl,calc(var(--graupl-font-size-base, 1rem)*2.986)));font-weight:var(--graupl-h1-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h1-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h2{color:var(--graupl-h2-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h2-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h2-font-size,var(--graupl-font-4xl,calc(var(--graupl-font-size-base, 1rem)*2.488)));font-weight:var(--graupl-h2-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h2-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h3{color:var(--graupl-h3-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h3-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h3-font-size,var(--graupl-font-3xl,calc(var(--graupl-font-size-base, 1rem)*2.074)));font-weight:var(--graupl-h3-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h3-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h4{color:var(--graupl-h4-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h4-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h4-font-size,var(--graupl-font-2xl,calc(var(--graupl-font-size-base, 1rem)*1.728)));font-weight:var(--graupl-h4-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h4-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h5{color:var(--graupl-h5-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h5-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h5-font-size,var(--graupl-font-xl,calc(var(--graupl-font-size-base, 1rem)*1.44)));font-weight:var(--graupl-h5-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h5-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h6{color:var(--graupl-h6-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h6-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h6-font-size,var(--graupl-font-lg,calc(var(--graupl-font-size-base, 1rem)*1.2)));font-weight:var(--graupl-h6-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h6-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}}
|
|
2
|
-
/*# sourceMappingURL=theme.css.map */
|
|
1
|
+
@layer graupl.theme{:root{background:var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))));color:var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-primary:#2063df;--graupl-primary--100:#e6eeff;--graupl-primary--200:#9ebefa;--graupl-primary--300:#5e90ed;--graupl-primary--400:#3672e2;--graupl-primary--500:#2063df;--graupl-primary--600:#1d59c9;--graupl-primary--700:#1244a1;--graupl-primary--800:#052561;--graupl-primary--900:#001233;--graupl-secondary:#6c7093;--graupl-secondary--100:#edeef7;--graupl-secondary--200:#bdbfdb;--graupl-secondary--300:#9497b8;--graupl-secondary--400:#7b7e9d;--graupl-secondary--500:#6c7093;--graupl-secondary--600:#626484;--graupl-secondary--700:#474a6b;--graupl-secondary--800:#242642;--graupl-secondary--900:#0f1124;--graupl-tertiary:#c36;--graupl-tertiary--100:#fde7ef;--graupl-tertiary--200:#f2a6bf;--graupl-tertiary--300:#e06c92;--graupl-tertiary--400:#d14775;--graupl-tertiary--500:#c36;--graupl-tertiary--600:#b82e5c;--graupl-tertiary--700:#931f46;--graupl-tertiary--800:#590d26;--graupl-tertiary--900:#2f0412;--graupl-theme-active--primary:var(--graupl-theme--light--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--primary--200:var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--300:var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--400:var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--500:var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--700:var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--800:var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--900:var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233));--graupl-theme-active--secondary:var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--secondary--200:var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--300:var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--400:var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--500:var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--700:var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--800:var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--900:var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--tertiary:var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef));--graupl-theme-active--tertiary--200:var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--300:var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--400:var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--500:var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--700:var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--800:var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--900:var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412))}.active-mode{--graupl-theme-active--primary:var(--graupl-theme-active--primary,var(--graupl-theme--light--primary,var(--graupl-primary,#2063df)));--graupl-theme-active--primary--100:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-theme-active--primary--200:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-theme-active--primary--300:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)));--graupl-theme-active--primary--400:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)));--graupl-theme-active--primary--500:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)));--graupl-theme-active--primary--600:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)));--graupl-theme-active--primary--700:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-theme-active--primary--800:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)));--graupl-theme-active--primary--900:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-theme-active--secondary:var(--graupl-theme-active--secondary,var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093)));--graupl-theme-active--secondary--100:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-theme-active--secondary--200:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-theme-active--secondary--300:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)));--graupl-theme-active--secondary--400:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)));--graupl-theme-active--secondary--500:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)));--graupl-theme-active--secondary--600:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)));--graupl-theme-active--secondary--700:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-theme-active--secondary--800:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)));--graupl-theme-active--secondary--900:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-theme-active--tertiary:var(--graupl-theme-active--tertiary,var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36)));--graupl-theme-active--tertiary--100:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-theme-active--tertiary--200:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-theme-active--tertiary--300:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)));--graupl-theme-active--tertiary--400:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)));--graupl-theme-active--tertiary--500:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)));--graupl-theme-active--tertiary--600:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)));--graupl-theme-active--tertiary--700:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-theme-active--tertiary--800:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)));--graupl-theme-active--tertiary--900:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));color-scheme:normal}.light-mode{--graupl-theme-active--primary:var(--graupl-theme--light--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--primary--200:var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--300:var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--400:var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--500:var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--700:var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--800:var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--900:var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233));--graupl-theme-active--secondary:var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--secondary--200:var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--300:var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--400:var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--500:var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--700:var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--800:var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--900:var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--tertiary:var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef));--graupl-theme-active--tertiary--200:var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--300:var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--400:var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--500:var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--700:var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--800:var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--900:var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412));color-scheme:light}.dark-mode{--graupl-theme-active--primary:var(--graupl-theme--dark--primary,var(--graupl-primary,#2063df));--graupl-theme-active--primary--100:var(--graupl-theme-dark--primary--100,var(--graupl-primary--900,#001233));--graupl-theme-active--primary--200:var(--graupl-theme-dark--primary--200,var(--graupl-primary--800,#052561));--graupl-theme-active--primary--300:var(--graupl-theme-dark--primary--300,var(--graupl-primary--700,#1244a1));--graupl-theme-active--primary--400:var(--graupl-theme-dark--primary--400,var(--graupl-primary--600,#1d59c9));--graupl-theme-active--primary--500:var(--graupl-theme-dark--primary--500,var(--graupl-primary--500,#2063df));--graupl-theme-active--primary--600:var(--graupl-theme-dark--primary--600,var(--graupl-primary--400,#3672e2));--graupl-theme-active--primary--700:var(--graupl-theme-dark--primary--700,var(--graupl-primary--300,#5e90ed));--graupl-theme-active--primary--800:var(--graupl-theme-dark--primary--800,var(--graupl-primary--200,#9ebefa));--graupl-theme-active--primary--900:var(--graupl-theme-dark--primary--900,var(--graupl-primary--100,#e6eeff));--graupl-theme-active--secondary:var(--graupl-theme--dark--secondary,var(--graupl-secondary,#6c7093));--graupl-theme-active--secondary--100:var(--graupl-theme-dark--secondary--100,var(--graupl-secondary--900,#0f1124));--graupl-theme-active--secondary--200:var(--graupl-theme-dark--secondary--200,var(--graupl-secondary--800,#242642));--graupl-theme-active--secondary--300:var(--graupl-theme-dark--secondary--300,var(--graupl-secondary--700,#474a6b));--graupl-theme-active--secondary--400:var(--graupl-theme-dark--secondary--400,var(--graupl-secondary--600,#626484));--graupl-theme-active--secondary--500:var(--graupl-theme-dark--secondary--500,var(--graupl-secondary--500,#6c7093));--graupl-theme-active--secondary--600:var(--graupl-theme-dark--secondary--600,var(--graupl-secondary--400,#7b7e9d));--graupl-theme-active--secondary--700:var(--graupl-theme-dark--secondary--700,var(--graupl-secondary--300,#9497b8));--graupl-theme-active--secondary--800:var(--graupl-theme-dark--secondary--800,var(--graupl-secondary--200,#bdbfdb));--graupl-theme-active--secondary--900:var(--graupl-theme-dark--secondary--900,var(--graupl-secondary--100,#edeef7));--graupl-theme-active--tertiary:var(--graupl-theme--dark--tertiary,var(--graupl-tertiary,#c36));--graupl-theme-active--tertiary--100:var(--graupl-theme-dark--tertiary--100,var(--graupl-tertiary--900,#2f0412));--graupl-theme-active--tertiary--200:var(--graupl-theme-dark--tertiary--200,var(--graupl-tertiary--800,#590d26));--graupl-theme-active--tertiary--300:var(--graupl-theme-dark--tertiary--300,var(--graupl-tertiary--700,#931f46));--graupl-theme-active--tertiary--400:var(--graupl-theme-dark--tertiary--400,var(--graupl-tertiary--600,#b82e5c));--graupl-theme-active--tertiary--500:var(--graupl-theme-dark--tertiary--500,var(--graupl-tertiary--500,#c36));--graupl-theme-active--tertiary--600:var(--graupl-theme-dark--tertiary--600,var(--graupl-tertiary--400,#d14775));--graupl-theme-active--tertiary--700:var(--graupl-theme-dark--tertiary--700,var(--graupl-tertiary--300,#e06c92));--graupl-theme-active--tertiary--800:var(--graupl-theme-dark--tertiary--800,var(--graupl-tertiary--200,#f2a6bf));--graupl-theme-active--tertiary--900:var(--graupl-theme-dark--tertiary--900,var(--graupl-tertiary--100,#fde7ef));color-scheme:dark}:root{font-family:var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif);font-size:var(--graupl-root-font-size,clamp(.85rem,.8rem + .5vw,1.25rem))}b,strong{font-weight:var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))}body{color:var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))));font-size:var(--graupl-body-font-size,var(--graupl-font-base,calc(1*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400));line-height:var(--graupl-body-line-height,var(--graupl-line-height,1.2em))}p{color:var(--graupl-paragraph-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));font-size:var(--graupl-paragraph-font-size,var(--graupl-body-font-size,var(--graupl-font-base,calc(1*var(--graupl-font-size-base,1rem)))));font-weight:var(--graupl-paragraph-font-weight,var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400)));line-height:var(--graupl-paragraph-line-height,var(--graupl-body-line-height,var(--graupl-line-height,1.2em)))}small{color:var(--graupl-small-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));font-size:var(--graupl-small-font-size,var(--graupl-font-sm,calc(.833*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-small-font-weight,var(--graupl-body-font-weight,var(--graupl-font-weight-normal,400)));line-height:var(--graupl-small-line-height,var(--graupl-line-height,1.2em))}h1{color:var(--graupl-h1-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h1-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h1-font-size,var(--graupl-font-5xl,calc(2.986*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h1-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h1-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h2{color:var(--graupl-h2-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h2-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h2-font-size,var(--graupl-font-4xl,calc(2.488*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h2-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h2-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h3{color:var(--graupl-h3-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h3-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h3-font-size,var(--graupl-font-3xl,calc(2.074*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h3-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h3-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h4{color:var(--graupl-h4-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h4-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h4-font-size,var(--graupl-font-2xl,calc(1.728*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h4-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h4-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h5{color:var(--graupl-h5-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h5-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h5-font-size,var(--graupl-font-xl,calc(1.44*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h5-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h5-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}h6{color:var(--graupl-h6-color,var(--graupl-heading-color,var(--graupl-body-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));font-family:var(--graupl-h6-font-family,var(--graupl-heading-font-family,var(--graupl-root-font-family,system-ui,-apple-system,blinkmacsystemfont,Segoe UI,roboto,Helvetica Neue,arial,sans-serif)));font-size:var(--graupl-h6-font-size,var(--graupl-font-lg,calc(1.2*var(--graupl-font-size-base,1rem))));font-weight:var(--graupl-h6-font-weight,var(--graupl-heading-font-weight,var(--graupl-font-weight-bold,var(--graupl-font-weight-bold,700))));line-height:var(--graupl-h6-line-height,var(--graupl-heading-line-height,var(--graupl-line-height,1.2em)))}}@layer graupl.base{p{margin:var(--graupl-paragraph-margin,0 0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0)}small{margin:var(--graupl-small-margin,0 0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0)}h1{margin:var(--graupl-h1-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}h2{margin:var(--graupl-h2-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}h3{margin:var(--graupl-h3-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}h4{margin:var(--graupl-h4-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}h5{margin:var(--graupl-h5-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}h6{margin:var(--graupl-h6-margin,var(--graupl-heading-margin,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))0 var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem)))0))}}
|
|
2
|
+
/*# sourceMappingURL=theme.css.map */
|
package/dist/css/theme.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/scss/mixins/_layer.scss","../../src/scss/theme/color/_index.scss","../../src/scss/theme/color/_variables.scss","theme.css","../../src/scss/mixins/_theme.scss","../../src/scss/theme/typography/_index.scss","../../src/scss/theme/typography/_variables.scss"],"names":[],"mappings":"AASI,oBCCF,MACE,4JCkJgB,CDjJhB,kJC0IW,CDnIL,wBAAA,CAEA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAAA,6BAAA,CAFA,0BAAA,CAEA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAAA,+BAAA,CAFA,sBAAA,CAEA,8BAAA,CAAA,8BAAA,CAAA,8BAAA,CAAA,8BAAA,CAAA,2BAAA,CAAA,8BAAA,CAAA,8BAAA,CAAA,8BAAA,CAAA,8BAAA,CAUA,gGAAA,CAEA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAFA,sGAAA,CAEA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAFA,gGAAA,CAEA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,8GAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHE+BR,CCrDA,aHmCU,oIAAA,CAEA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAAA,uJAAA,CAFA,4IAAA,CAEA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAAA,+JAAA,CAFA,qIAAA,CAEA,2JAAA,CAAA,2JAAA,CAAA,2JAAA,CAAA,2JAAA,CAAA,wJAAA,CAAA,2JAAA,CAAA,2JAAA,CAAA,2JAAA,CAAA,2JAAA,CAKN,mBE4CJ,CCtFA,YHmCU,gGAAA,CAEA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAAA,8GAAA,CAFA,sGAAA,CAEA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAAA,oHAAA,CAFA,gGAAA,CAEA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,8GAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAAA,iHAAA,CAKN,kBE6EJ,CCvHA,WHmCU,+FAAA,CAEA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAAA,6GAAA,CAFA,qGAAA,CAEA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAAA,mHAAA,CAFA,+FAAA,CAEA,gHAAA,CAAA,gHAAA,CAAA,gHAAA,CAAA,gHAAA,CAAA,6GAAA,CAAA,gHAAA,CAAA,gHAAA,CAAA,gHAAA,CAAA,gHAAA,CAKN,iBE8GJ,CACF,CH3JI,mBKFF,EACE,uGFiKF,CE9JA,MACE,mGFgKF,CE7JA,GACE,qLF+JF,CE5JA,GACE,qLF8JF,CE3JA,GACE,qLF6JF,CE1JA,GACE,qLF4JF,CEzJA,GACE,qLF2JF,CExJA,GACE,qLF0JF,CACF,CHtLI,oBKgCF,MACE,qICGe,CDFf,yEFyJF,CEtJA,SAEE,6EFwJF,CErJA,KACE,+LCeS,CDdT,yGCEa,CDDb,+ECSe,CDRf,0EFuJF,CEpJA,EACE,6NC4Bc,CD3Bd,2ICWkB,CDVlB,mHCsBoB,CDrBpB,8GFsJF,CEnJA,MACE,yNCyCU,CDxCV,2GCwBc,CDvBd,+GCmCgB,CDlChB,2EFqJF,CElJA,GACE,kPC0EO,CDzEP,oMCiEa,CDhEb,0GCuDW,CDtDX,4ICmEa,CDlEb,0GFoJF,CEjJA,GACE,kPCsFO,CDrFP,oMC6Ea,CD5Eb,0GCmEW,CDlEX,4IC+Ea,CD9Eb,0GFmJF,CEhJA,GACE,kPCkGO,CDjGP,oMCyFa,CDxFb,0GC+EW,CD9EX,4IC2Fa,CD1Fb,0GFkJF,CE/IA,GACE,kPC8GO,CD7GP,oMCqGa,CDpGb,0GC2FW,CD1FX,4ICuGa,CDtGb,0GFiJF,CE9IA,GACE,kPC0HO,CDzHP,oMCiHa,CDhHb,wGCuGW,CDtGX,4ICmHa,CDlHb,0GFgJF,CE7IA,GACE,kPCsIO,CDrIP,oMC6Ha,CD5Hb,uGCmHW,CDlHX,4IC+Ha,CD9Hb,0GF+IF,CACF","file":"theme.css"}
|
|
1
|
+
{"version":3,"sourceRoot":null,"mappings":"ACSI,oBCsKF,++IEjKA,0iJAAA,20GAAA,2yGE6KA,sNAM+B,uFAMA,ycAQK,8kBAQJ,ugBAQH,6xBASA,6xBASA,6xBASA,6xBASA,2xBASA,2xBLnQ3B,mBKwIkC,wGAKJ,wGAKH,qLAKA,qLAKA,qLAKA,qLAKA,qLAKA","sources":["dist/css/theme.css","var/www/html/packages/core/src/scss/mixins/_layer.scss","var/www/html/packages/core/src/scss/theme/color/_index.scss","var/www/html/packages/core/src/scss/theme/color/_variables.scss","var/www/html/packages/core/src/scss/mixins/_theme.scss","var/www/html/packages/core/src/scss/theme/typography/_defaults.scss","var/www/html/packages/core/src/scss/theme/typography/_index.scss","var/www/html/packages/core/src/scss/theme/typography/_variables.scss"],"sourcesContent":["@layer graupl.theme {\n :root {\n background: var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n color: var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n --graupl-primary: hsl(219, 75%, 50%);\n --graupl-primary--100: hsl(219, 100%, 95%);\n --graupl-primary--200: hsl(219, 90%, 80%);\n --graupl-primary--300: hsl(219, 80%, 65%);\n --graupl-primary--400: hsl(219, 75%, 55%);\n --graupl-primary--500: hsl(219, 75%, 50%);\n --graupl-primary--600: hsl(219, 75%, 45%);\n --graupl-primary--700: hsl(219, 80%, 35%);\n --graupl-primary--800: hsl(219, 90%, 20%);\n --graupl-primary--900: hsl(219, 100%, 10%);\n --graupl-secondary: hsl(235, 15%, 50%);\n --graupl-secondary--100: hsl(235, 40%, 95%);\n --graupl-secondary--200: hsl(235, 30%, 80%);\n --graupl-secondary--300: hsl(235, 20%, 65%);\n --graupl-secondary--400: hsl(235, 15%, 55%);\n --graupl-secondary--500: hsl(235, 15%, 50%);\n --graupl-secondary--600: hsl(235, 15%, 45%);\n --graupl-secondary--700: hsl(235, 20%, 35%);\n --graupl-secondary--800: hsl(235, 30%, 20%);\n --graupl-secondary--900: hsl(235, 40%, 10%);\n --graupl-tertiary: hsl(340, 60%, 50%);\n --graupl-tertiary--100: hsl(340, 85%, 95%);\n --graupl-tertiary--200: hsl(340, 75%, 80%);\n --graupl-tertiary--300: hsl(340, 65%, 65%);\n --graupl-tertiary--400: hsl(340, 60%, 55%);\n --graupl-tertiary--500: hsl(340, 60%, 50%);\n --graupl-tertiary--600: hsl(340, 60%, 45%);\n --graupl-tertiary--700: hsl(340, 65%, 35%);\n --graupl-tertiary--800: hsl(340, 75%, 20%);\n --graupl-tertiary--900: hsl(340, 85%, 10%);\n --graupl-theme-active--primary: var(--graupl-theme--light--primary, var(--graupl-primary, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--100: var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)));\n --graupl-theme-active--primary--200: var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)));\n --graupl-theme-active--primary--300: var(--graupl-theme-light--primary--300, var(--graupl-primary--300, hsl(219, 80%, 65%)));\n --graupl-theme-active--primary--400: var(--graupl-theme-light--primary--400, var(--graupl-primary--400, hsl(219, 75%, 55%)));\n --graupl-theme-active--primary--500: var(--graupl-theme-light--primary--500, var(--graupl-primary--500, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--600: var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%)));\n --graupl-theme-active--primary--700: var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)));\n --graupl-theme-active--primary--800: var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%)));\n --graupl-theme-active--primary--900: var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)));\n --graupl-theme-active--secondary: var(--graupl-theme--light--secondary, var(--graupl-secondary, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--100: var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%)));\n --graupl-theme-active--secondary--200: var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)));\n --graupl-theme-active--secondary--300: var(--graupl-theme-light--secondary--300, var(--graupl-secondary--300, hsl(235, 20%, 65%)));\n --graupl-theme-active--secondary--400: var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)));\n --graupl-theme-active--secondary--500: var(--graupl-theme-light--secondary--500, var(--graupl-secondary--500, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--600: var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%)));\n --graupl-theme-active--secondary--700: var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%)));\n --graupl-theme-active--secondary--800: var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%)));\n --graupl-theme-active--secondary--900: var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%)));\n --graupl-theme-active--tertiary: var(--graupl-theme--light--tertiary, var(--graupl-tertiary, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--100: var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%)));\n --graupl-theme-active--tertiary--200: var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%)));\n --graupl-theme-active--tertiary--300: var(--graupl-theme-light--tertiary--300, var(--graupl-tertiary--300, hsl(340, 65%, 65%)));\n --graupl-theme-active--tertiary--400: var(--graupl-theme-light--tertiary--400, var(--graupl-tertiary--400, hsl(340, 60%, 55%)));\n --graupl-theme-active--tertiary--500: var(--graupl-theme-light--tertiary--500, var(--graupl-tertiary--500, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--600: var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%)));\n --graupl-theme-active--tertiary--700: var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)));\n --graupl-theme-active--tertiary--800: var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%)));\n --graupl-theme-active--tertiary--900: var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%)));\n }\n .active-mode {\n --graupl-theme-active--primary: var(--graupl-theme-active--primary, var(--graupl-theme--light--primary, var(--graupl-primary, hsl(219, 75%, 50%))));\n --graupl-theme-active--primary--100: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-theme-active--primary--200: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n --graupl-theme-active--primary--300: var(--graupl-theme-active--primary--300, var(--graupl-theme-light--primary--300, var(--graupl-primary--300, hsl(219, 80%, 65%))));\n --graupl-theme-active--primary--400: var(--graupl-theme-active--primary--400, var(--graupl-theme-light--primary--400, var(--graupl-primary--400, hsl(219, 75%, 55%))));\n --graupl-theme-active--primary--500: var(--graupl-theme-active--primary--500, var(--graupl-theme-light--primary--500, var(--graupl-primary--500, hsl(219, 75%, 50%))));\n --graupl-theme-active--primary--600: var(--graupl-theme-active--primary--600, var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%))));\n --graupl-theme-active--primary--700: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n --graupl-theme-active--primary--800: var(--graupl-theme-active--primary--800, var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%))));\n --graupl-theme-active--primary--900: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-theme-active--secondary: var(--graupl-theme-active--secondary, var(--graupl-theme--light--secondary, var(--graupl-secondary, hsl(235, 15%, 50%))));\n --graupl-theme-active--secondary--100: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-theme-active--secondary--200: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n --graupl-theme-active--secondary--300: var(--graupl-theme-active--secondary--300, var(--graupl-theme-light--secondary--300, var(--graupl-secondary--300, hsl(235, 20%, 65%))));\n --graupl-theme-active--secondary--400: var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))));\n --graupl-theme-active--secondary--500: var(--graupl-theme-active--secondary--500, var(--graupl-theme-light--secondary--500, var(--graupl-secondary--500, hsl(235, 15%, 50%))));\n --graupl-theme-active--secondary--600: var(--graupl-theme-active--secondary--600, var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%))));\n --graupl-theme-active--secondary--700: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n --graupl-theme-active--secondary--800: var(--graupl-theme-active--secondary--800, var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%))));\n --graupl-theme-active--secondary--900: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-theme-active--tertiary: var(--graupl-theme-active--tertiary, var(--graupl-theme--light--tertiary, var(--graupl-tertiary, hsl(340, 60%, 50%))));\n --graupl-theme-active--tertiary--100: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-theme-active--tertiary--200: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n --graupl-theme-active--tertiary--300: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-light--tertiary--300, var(--graupl-tertiary--300, hsl(340, 65%, 65%))));\n --graupl-theme-active--tertiary--400: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-light--tertiary--400, var(--graupl-tertiary--400, hsl(340, 60%, 55%))));\n --graupl-theme-active--tertiary--500: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-light--tertiary--500, var(--graupl-tertiary--500, hsl(340, 60%, 50%))));\n --graupl-theme-active--tertiary--600: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%))));\n --graupl-theme-active--tertiary--700: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n --graupl-theme-active--tertiary--800: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%))));\n --graupl-theme-active--tertiary--900: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n color-scheme: active;\n }\n .light-mode {\n --graupl-theme-active--primary: var(--graupl-theme--light--primary, var(--graupl-primary, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--100: var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)));\n --graupl-theme-active--primary--200: var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)));\n --graupl-theme-active--primary--300: var(--graupl-theme-light--primary--300, var(--graupl-primary--300, hsl(219, 80%, 65%)));\n --graupl-theme-active--primary--400: var(--graupl-theme-light--primary--400, var(--graupl-primary--400, hsl(219, 75%, 55%)));\n --graupl-theme-active--primary--500: var(--graupl-theme-light--primary--500, var(--graupl-primary--500, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--600: var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%)));\n --graupl-theme-active--primary--700: var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)));\n --graupl-theme-active--primary--800: var(--graupl-theme-light--primary--800, var(--graupl-primary--800, hsl(219, 90%, 20%)));\n --graupl-theme-active--primary--900: var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)));\n --graupl-theme-active--secondary: var(--graupl-theme--light--secondary, var(--graupl-secondary, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--100: var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%)));\n --graupl-theme-active--secondary--200: var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)));\n --graupl-theme-active--secondary--300: var(--graupl-theme-light--secondary--300, var(--graupl-secondary--300, hsl(235, 20%, 65%)));\n --graupl-theme-active--secondary--400: var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)));\n --graupl-theme-active--secondary--500: var(--graupl-theme-light--secondary--500, var(--graupl-secondary--500, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--600: var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%)));\n --graupl-theme-active--secondary--700: var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%)));\n --graupl-theme-active--secondary--800: var(--graupl-theme-light--secondary--800, var(--graupl-secondary--800, hsl(235, 30%, 20%)));\n --graupl-theme-active--secondary--900: var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%)));\n --graupl-theme-active--tertiary: var(--graupl-theme--light--tertiary, var(--graupl-tertiary, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--100: var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%)));\n --graupl-theme-active--tertiary--200: var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%)));\n --graupl-theme-active--tertiary--300: var(--graupl-theme-light--tertiary--300, var(--graupl-tertiary--300, hsl(340, 65%, 65%)));\n --graupl-theme-active--tertiary--400: var(--graupl-theme-light--tertiary--400, var(--graupl-tertiary--400, hsl(340, 60%, 55%)));\n --graupl-theme-active--tertiary--500: var(--graupl-theme-light--tertiary--500, var(--graupl-tertiary--500, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--600: var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%)));\n --graupl-theme-active--tertiary--700: var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)));\n --graupl-theme-active--tertiary--800: var(--graupl-theme-light--tertiary--800, var(--graupl-tertiary--800, hsl(340, 75%, 20%)));\n --graupl-theme-active--tertiary--900: var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%)));\n color-scheme: light;\n }\n .dark-mode {\n --graupl-theme-active--primary: var(--graupl-theme--dark--primary, var(--graupl-primary, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--100: var(--graupl-theme-dark--primary--100, var(--graupl-primary--900, hsl(219, 100%, 10%)));\n --graupl-theme-active--primary--200: var(--graupl-theme-dark--primary--200, var(--graupl-primary--800, hsl(219, 90%, 20%)));\n --graupl-theme-active--primary--300: var(--graupl-theme-dark--primary--300, var(--graupl-primary--700, hsl(219, 80%, 35%)));\n --graupl-theme-active--primary--400: var(--graupl-theme-dark--primary--400, var(--graupl-primary--600, hsl(219, 75%, 45%)));\n --graupl-theme-active--primary--500: var(--graupl-theme-dark--primary--500, var(--graupl-primary--500, hsl(219, 75%, 50%)));\n --graupl-theme-active--primary--600: var(--graupl-theme-dark--primary--600, var(--graupl-primary--400, hsl(219, 75%, 55%)));\n --graupl-theme-active--primary--700: var(--graupl-theme-dark--primary--700, var(--graupl-primary--300, hsl(219, 80%, 65%)));\n --graupl-theme-active--primary--800: var(--graupl-theme-dark--primary--800, var(--graupl-primary--200, hsl(219, 90%, 80%)));\n --graupl-theme-active--primary--900: var(--graupl-theme-dark--primary--900, var(--graupl-primary--100, hsl(219, 100%, 95%)));\n --graupl-theme-active--secondary: var(--graupl-theme--dark--secondary, var(--graupl-secondary, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--100: var(--graupl-theme-dark--secondary--100, var(--graupl-secondary--900, hsl(235, 40%, 10%)));\n --graupl-theme-active--secondary--200: var(--graupl-theme-dark--secondary--200, var(--graupl-secondary--800, hsl(235, 30%, 20%)));\n --graupl-theme-active--secondary--300: var(--graupl-theme-dark--secondary--300, var(--graupl-secondary--700, hsl(235, 20%, 35%)));\n --graupl-theme-active--secondary--400: var(--graupl-theme-dark--secondary--400, var(--graupl-secondary--600, hsl(235, 15%, 45%)));\n --graupl-theme-active--secondary--500: var(--graupl-theme-dark--secondary--500, var(--graupl-secondary--500, hsl(235, 15%, 50%)));\n --graupl-theme-active--secondary--600: var(--graupl-theme-dark--secondary--600, var(--graupl-secondary--400, hsl(235, 15%, 55%)));\n --graupl-theme-active--secondary--700: var(--graupl-theme-dark--secondary--700, var(--graupl-secondary--300, hsl(235, 20%, 65%)));\n --graupl-theme-active--secondary--800: var(--graupl-theme-dark--secondary--800, var(--graupl-secondary--200, hsl(235, 30%, 80%)));\n --graupl-theme-active--secondary--900: var(--graupl-theme-dark--secondary--900, var(--graupl-secondary--100, hsl(235, 40%, 95%)));\n --graupl-theme-active--tertiary: var(--graupl-theme--dark--tertiary, var(--graupl-tertiary, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--100: var(--graupl-theme-dark--tertiary--100, var(--graupl-tertiary--900, hsl(340, 85%, 10%)));\n --graupl-theme-active--tertiary--200: var(--graupl-theme-dark--tertiary--200, var(--graupl-tertiary--800, hsl(340, 75%, 20%)));\n --graupl-theme-active--tertiary--300: var(--graupl-theme-dark--tertiary--300, var(--graupl-tertiary--700, hsl(340, 65%, 35%)));\n --graupl-theme-active--tertiary--400: var(--graupl-theme-dark--tertiary--400, var(--graupl-tertiary--600, hsl(340, 60%, 45%)));\n --graupl-theme-active--tertiary--500: var(--graupl-theme-dark--tertiary--500, var(--graupl-tertiary--500, hsl(340, 60%, 50%)));\n --graupl-theme-active--tertiary--600: var(--graupl-theme-dark--tertiary--600, var(--graupl-tertiary--400, hsl(340, 60%, 55%)));\n --graupl-theme-active--tertiary--700: var(--graupl-theme-dark--tertiary--700, var(--graupl-tertiary--300, hsl(340, 65%, 65%)));\n --graupl-theme-active--tertiary--800: var(--graupl-theme-dark--tertiary--800, var(--graupl-tertiary--200, hsl(340, 75%, 80%)));\n --graupl-theme-active--tertiary--900: var(--graupl-theme-dark--tertiary--900, var(--graupl-tertiary--100, hsl(340, 85%, 95%)));\n color-scheme: dark;\n }\n}\n/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n@layer graupl.base {\n p {\n margin: var(--graupl-paragraph-margin, 0 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0);\n }\n small {\n margin: var(--graupl-small-margin, 0 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0);\n }\n h1 {\n margin: var(--graupl-h1-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n h2 {\n margin: var(--graupl-h2-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n h3 {\n margin: var(--graupl-h3-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n h4 {\n margin: var(--graupl-h4-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n h5 {\n margin: var(--graupl-h5-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n h6 {\n margin: var(--graupl-h6-margin, var(--graupl-heading-margin, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) 0 var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) 0));\n }\n}\n@layer graupl.theme {\n :root {\n font-family: var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif);\n font-size: var(--graupl-root-font-size, clamp(0.85rem, 0.8rem + 0.5vw, 1.25rem));\n }\n b,\n strong {\n font-weight: var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700));\n }\n body {\n color: var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n font-size: var(--graupl-body-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-body-font-weight, var(--graupl-font-weight-normal, 400));\n line-height: var(--graupl-body-line-height, var(--graupl-line-height, 1.2em));\n }\n p {\n color: var(--graupl-paragraph-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n font-size: var(--graupl-paragraph-font-size, var(--graupl-body-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem)))));\n font-weight: var(--graupl-paragraph-font-weight, var(--graupl-body-font-weight, var(--graupl-font-weight-normal, 400)));\n line-height: var(--graupl-paragraph-line-height, var(--graupl-body-line-height, var(--graupl-line-height, 1.2em)));\n }\n small {\n color: var(--graupl-small-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n font-size: var(--graupl-small-font-size, var(--graupl-font-sm, calc(0.833 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-small-font-weight, var(--graupl-body-font-weight, var(--graupl-font-weight-normal, 400)));\n line-height: var(--graupl-small-line-height, var(--graupl-line-height, 1.2em));\n }\n h1 {\n color: var(--graupl-h1-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h1-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h1-font-size, var(--graupl-font-5xl, calc(2.986 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h1-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h1-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n h2 {\n color: var(--graupl-h2-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h2-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h2-font-size, var(--graupl-font-4xl, calc(2.488 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h2-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h2-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n h3 {\n color: var(--graupl-h3-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h3-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h3-font-size, var(--graupl-font-3xl, calc(2.074 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h3-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h3-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n h4 {\n color: var(--graupl-h4-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h4-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h4-font-size, var(--graupl-font-2xl, calc(1.728 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h4-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h4-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n h5 {\n color: var(--graupl-h5-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h5-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h5-font-size, var(--graupl-font-xl, calc(1.44 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h5-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h5-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n h6 {\n color: var(--graupl-h6-color, var(--graupl-heading-color, var(--graupl-body-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n font-family: var(--graupl-h6-font-family, var(--graupl-heading-font-family, var(--graupl-root-font-family, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif)));\n font-size: var(--graupl-h6-font-size, var(--graupl-font-lg, calc(1.2 * var(--graupl-font-size-base, 1rem))));\n font-weight: var(--graupl-h6-font-weight, var(--graupl-heading-font-weight, var(--graupl-font-weight-bold, var(--graupl-font-weight-bold, 700))));\n line-height: var(--graupl-h6-line-height, var(--graupl-heading-line-height, var(--graupl-line-height, 1.2em)));\n }\n}","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n @if root-defaults.$use-layers {\n @layer #{root-defaults.$id}.#{$layer} {\n @content;\n }\n } @else {\n @content;\n }\n}\n","// @graupl/core color theme styles.\n//\n// This module wires up the global colour tokens and theme variants.\n//\n// The following selectors are generated by default:\n// - `:root`: Defines base colours and the active theme properties.\n// - `.light-mode`: Defines the light theme properties and sets `color-scheme: light`.\n// - `.dark-mode`: Defines the dark theme properties and sets `color-scheme: dark`.\n//\n// The following custom properties can be used to customize colour theming:\n// | Property | Description | Default Value |\n// | --- | --- | --- |\n// | `--graupl-primary` | Primary base colour. | `hsl(219deg 75% 50%)` |\n// | `--graupl-primary--100` | Primary shade 100. | `hsl(219deg 100% 95%)` |\n// | `--graupl-primary--200` | Primary shade 200. | `hsl(219deg 90% 80%)` |\n// | `--graupl-primary--300` | Primary shade 300. | `hsl(219deg 80% 65%)` |\n// | `--graupl-primary--400` | Primary shade 400. | `hsl(219deg 75% 55%)` |\n// | `--graupl-primary--500` | Primary shade 500. | `hsl(219deg 75% 50%)` |\n// | `--graupl-primary--600` | Primary shade 600. | `hsl(219deg 75% 45%)` |\n// | `--graupl-primary--700` | Primary shade 700. | `hsl(219deg 80% 35%)` |\n// | `--graupl-primary--800` | Primary shade 800. | `hsl(219deg 90% 20%)` |\n// | `--graupl-primary--900` | Primary shade 900. | `hsl(219deg 100% 10%)` |\n// | `--graupl-secondary` | Secondary base colour. | `hsl(235deg 15% 50%)` |\n// | `--graupl-secondary--100` | Secondary shade 100. | `hsl(235deg 40% 95%)` |\n// | `--graupl-secondary--200` | Secondary shade 200. | `hsl(235deg 30% 80%)` |\n// | `--graupl-secondary--300` | Secondary shade 300. | `hsl(235deg 20% 65%)` |\n// | `--graupl-secondary--400` | Secondary shade 400. | `hsl(235deg 15% 55%)` |\n// | `--graupl-secondary--500` | Secondary shade 500. | `hsl(235deg 15% 50%)` |\n// | `--graupl-secondary--600` | Secondary shade 600. | `hsl(235deg 15% 45%)` |\n// | `--graupl-secondary--700` | Secondary shade 700. | `hsl(235deg 20% 35%)` |\n// | `--graupl-secondary--800` | Secondary shade 800. | `hsl(235deg 30% 20%)` |\n// | `--graupl-secondary--900` | Secondary shade 900. | `hsl(235deg 40% 10%)` |\n// | `--graupl-tertiary` | Tertiary base colour. | `hsl(340deg 60% 50%)` |\n// | `--graupl-tertiary--100` | Tertiary shade 100. | `hsl(340deg 85% 95%)` |\n// | `--graupl-tertiary--200` | Tertiary shade 200. | `hsl(340deg 75% 80%)` |\n// | `--graupl-tertiary--300` | Tertiary shade 300. | `hsl(340deg 65% 65%)` |\n// | `--graupl-tertiary--400` | Tertiary shade 400. | `hsl(340deg 60% 55%)` |\n// | `--graupl-tertiary--500` | Tertiary shade 500. | `hsl(340deg 60% 50%)` |\n// | `--graupl-tertiary--600` | Tertiary shade 600. | `hsl(340deg 60% 45%)` |\n// | `--graupl-tertiary--700` | Tertiary shade 700. | `hsl(340deg 65% 35%)` |\n// | `--graupl-tertiary--800` | Tertiary shade 800. | `hsl(340deg 75% 20%)` |\n// | `--graupl-tertiary--900` | Tertiary shade 900. | `hsl(340deg 85% 10%)` |\n// | `--graupl-theme-light--primary` | Light theme primary base colour. | `var(--graupl-primary)` |\n// | `--graupl-theme-light--primary--100` | Light theme primary shade 100. | `var(--graupl-primary--100)` |\n// | `--graupl-theme-light--primary--200` | Light theme primary shade 200. | `var(--graupl-primary--200)` |\n// | `--graupl-theme-light--primary--300` | Light theme primary shade 300. | `var(--graupl-primary--300)` |\n// | `--graupl-theme-light--primary--400` | Light theme primary shade 400. | `var(--graupl-primary--400)` |\n// | `--graupl-theme-light--primary--500` | Light theme primary shade 500. | `var(--graupl-primary--500)` |\n// | `--graupl-theme-light--primary--600` | Light theme primary shade 600. | `var(--graupl-primary--600)` |\n// | `--graupl-theme-light--primary--700` | Light theme primary shade 700. | `var(--graupl-primary--700)` |\n// | `--graupl-theme-light--primary--800` | Light theme primary shade 800. | `var(--graupl-primary--800)` |\n// | `--graupl-theme-light--primary--900` | Light theme primary shade 900. | `var(--graupl-primary--900)` |\n// | `--graupl-theme-light--secondary` | Light theme secondary base colour. | `var(--graupl-secondary)` |\n// | `--graupl-theme-light--secondary--100` | Light theme secondary shade 100. | `var(--graupl-secondary--100)` |\n// | `--graupl-theme-light--secondary--200` | Light theme secondary shade 200. | `var(--graupl-secondary--200)` |\n// | `--graupl-theme-light--secondary--300` | Light theme secondary shade 300. | `var(--graupl-secondary--300)` |\n// | `--graupl-theme-light--secondary--400` | Light theme secondary shade 400. | `var(--graupl-secondary--400)` |\n// | `--graupl-theme-light--secondary--500` | Light theme secondary shade 500. | `var(--graupl-secondary--500)` |\n// | `--graupl-theme-light--secondary--600` | Light theme secondary shade 600. | `var(--graupl-secondary--600)` |\n// | `--graupl-theme-light--secondary--700` | Light theme secondary shade 700. | `var(--graupl-secondary--700)` |\n// | `--graupl-theme-light--secondary--800` | Light theme secondary shade 800. | `var(--graupl-secondary--800)` |\n// | `--graupl-theme-light--secondary--900` | Light theme secondary shade 900. | `var(--graupl-secondary--900)` |\n// | `--graupl-theme-light--tertiary` | Light theme tertiary base colour. | `var(--graupl-tertiary)` |\n// | `--graupl-theme-light--tertiary--100` | Light theme tertiary shade 100. | `var(--graupl-tertiary--100)` |\n// | `--graupl-theme-light--tertiary--200` | Light theme tertiary shade 200. | `var(--graupl-tertiary--200)` |\n// | `--graupl-theme-light--tertiary--300` | Light theme tertiary shade 300. | `var(--graupl-tertiary--300)` |\n// | `--graupl-theme-light--tertiary--400` | Light theme tertiary shade 400. | `var(--graupl-tertiary--400)` |\n// | `--graupl-theme-light--tertiary--500` | Light theme tertiary shade 500. | `var(--graupl-tertiary--500)` |\n// | `--graupl-theme-light--tertiary--600` | Light theme tertiary shade 600. | `var(--graupl-tertiary--600)` |\n// | `--graupl-theme-light--tertiary--700` | Light theme tertiary shade 700. | `var(--graupl-tertiary--700)` |\n// | `--graupl-theme-light--tertiary--800` | Light theme tertiary shade 800. | `var(--graupl-tertiary--800)` |\n// | `--graupl-theme-light--tertiary--900` | Light theme tertiary shade 900. | `var(--graupl-tertiary--900)` |\n// | `--graupl-theme-dark--primary` | Dark theme primary base colour. | `var(--graupl-primary)` |\n// | `--graupl-theme-dark--primary--100` | Dark theme primary shade 100. | `var(--graupl-primary--900)` |\n// | `--graupl-theme-dark--primary--200` | Dark theme primary shade 200. | `var(--graupl-primary--800)` |\n// | `--graupl-theme-dark--primary--300` | Dark theme primary shade 300. | `var(--graupl-primary--700)` |\n// | `--graupl-theme-dark--primary--400` | Dark theme primary shade 400. | `var(--graupl-primary--600)` |\n// | `--graupl-theme-dark--primary--500` | Dark theme primary shade 500. | `var(--graupl-primary--500)` |\n// | `--graupl-theme-dark--primary--600` | Dark theme primary shade 600. | `var(--graupl-primary--400)` |\n// | `--graupl-theme-dark--primary--700` | Dark theme primary shade 700. | `var(--graupl-primary--300)` |\n// | `--graupl-theme-dark--primary--800` | Dark theme primary shade 800. | `var(--graupl-primary--200)` |\n// | `--graupl-theme-dark--primary--900` | Dark theme primary shade 900. | `var(--graupl-primary--100)` |\n// | `--graupl-theme-dark--secondary` | Dark theme secondary base colour. | `var(--graupl-secondary)` |\n// | `--graupl-theme-dark--secondary--100` | Dark theme secondary shade 100. | `var(--graupl-secondary--900)` |\n// | `--graupl-theme-dark--secondary--200` | Dark theme secondary shade 200. | `var(--graupl-secondary--800)` |\n// | `--graupl-theme-dark--secondary--300` | Dark theme secondary shade 300. | `var(--graupl-secondary--700)` |\n// | `--graupl-theme-dark--secondary--400` | Dark theme secondary shade 400. | `var(--graupl-secondary--600)` |\n// | `--graupl-theme-dark--secondary--500` | Dark theme secondary shade 500. | `var(--graupl-secondary--500)` |\n// | `--graupl-theme-dark--secondary--600` | Dark theme secondary shade 600. | `var(--graupl-secondary--400)` |\n// | `--graupl-theme-dark--secondary--700` | Dark theme secondary shade 700. | `var(--graupl-secondary--300)` |\n// | `--graupl-theme-dark--secondary--800` | Dark theme secondary shade 800. | `var(--graupl-secondary--200)` |\n// | `--graupl-theme-dark--secondary--900` | Dark theme secondary shade 900. | `var(--graupl-secondary--100)` |\n// | `--graupl-theme-dark--tertiary` | Dark theme tertiary base colour. | `var(--graupl-tertiary)` |\n// | `--graupl-theme-dark--tertiary--100` | Dark theme tertiary shade 100. | `var(--graupl-tertiary--900)` |\n// | `--graupl-theme-dark--tertiary--200` | Dark theme tertiary shade 200. | `var(--graupl-tertiary--800)` |\n// | `--graupl-theme-dark--tertiary--300` | Dark theme tertiary shade 300. | `var(--graupl-tertiary--700)` |\n// | `--graupl-theme-dark--tertiary--400` | Dark theme tertiary shade 400. | `var(--graupl-tertiary--600)` |\n// | `--graupl-theme-dark--tertiary--500` | Dark theme tertiary shade 500. | `var(--graupl-tertiary--500)` |\n// | `--graupl-theme-dark--tertiary--600` | Dark theme tertiary shade 600. | `var(--graupl-tertiary--400)` |\n// | `--graupl-theme-dark--tertiary--700` | Dark theme tertiary shade 700. | `var(--graupl-tertiary--300)` |\n// | `--graupl-theme-dark--tertiary--800` | Dark theme tertiary shade 800. | `var(--graupl-tertiary--200)` |\n// | `--graupl-theme-dark--tertiary--900` | Dark theme tertiary shade 900. | `var(--graupl-tertiary--100)` |\n// | `--graupl-theme-active--primary` | Active theme primary base colour. | `var(--graupl-theme-light--primary)` |\n// | `--graupl-theme-active--primary--100` | Active theme primary shade 100. | `var(--graupl-theme-light--primary--100)` |\n// | `--graupl-theme-active--primary--200` | Active theme primary shade 200. | `var(--graupl-theme-light--primary--200)` |\n// | `--graupl-theme-active--primary--300` | Active theme primary shade 300. | `var(--graupl-theme-light--primary--300)` |\n// | `--graupl-theme-active--primary--400` | Active theme primary shade 400. | `var(--graupl-theme-light--primary--400)` |\n// | `--graupl-theme-active--primary--500` | Active theme primary shade 500. | `var(--graupl-theme-light--primary--500)` |\n// | `--graupl-theme-active--primary--600` | Active theme primary shade 600. | `var(--graupl-theme-light--primary--600)` |\n// | `--graupl-theme-active--primary--700` | Active theme primary shade 700. | `var(--graupl-theme-light--primary--700)` |\n// | `--graupl-theme-active--primary--800` | Active theme primary shade 800. | `var(--graupl-theme-light--primary--800)` |\n// | `--graupl-theme-active--primary--900` | Active theme primary shade 900. | `var(--graupl-theme-light--primary--900)` |\n// | `--graupl-theme-active--secondary` | Active theme secondary base colour. | `var(--graupl-theme-light--secondary)` |\n// | `--graupl-theme-active--secondary--100` | Active theme secondary shade 100. | `var(--graupl-theme-light--secondary--100)` |\n// | `--graupl-theme-active--secondary--200` | Active theme secondary shade 200. | `var(--graupl-theme-light--secondary--200)` |\n// | `--graupl-theme-active--secondary--300` | Active theme secondary shade 300. | `var(--graupl-theme-light--secondary--300)` |\n// | `--graupl-theme-active--secondary--400` | Active theme secondary shade 400. | `var(--graupl-theme-light--secondary--400)` |\n// | `--graupl-theme-active--secondary--500` | Active theme secondary shade 500. | `var(--graupl-theme-light--secondary--500)` |\n// | `--graupl-theme-active--secondary--600` | Active theme secondary shade 600. | `var(--graupl-theme-light--secondary--600)` |\n// | `--graupl-theme-active--secondary--700` | Active theme secondary shade 700. | `var(--graupl-theme-light--secondary--700)` |\n// | `--graupl-theme-active--secondary--800` | Active theme secondary shade 800. | `var(--graupl-theme-light--secondary--800)` |\n// | `--graupl-theme-active--secondary--900` | Active theme secondary shade 900. | `var(--graupl-theme-light--secondary--900)` |\n// | `--graupl-theme-active--tertiary` | Active theme tertiary base colour. | `var(--graupl-theme-light--tertiary)` |\n// | `--graupl-theme-active--tertiary--100` | Active theme tertiary shade 100. | `var(--graupl-theme-light--tertiary--100)` |\n// | `--graupl-theme-active--tertiary--200` | Active theme tertiary shade 200. | `var(--graupl-theme-light--tertiary--200)` |\n// | `--graupl-theme-active--tertiary--300` | Active theme tertiary shade 300. | `var(--graupl-theme-light--tertiary--300)` |\n// | `--graupl-theme-active--tertiary--400` | Active theme tertiary shade 400. | `var(--graupl-theme-light--tertiary--400)` |\n// | `--graupl-theme-active--tertiary--500` | Active theme tertiary shade 500. | `var(--graupl-theme-light--tertiary--500)` |\n// | `--graupl-theme-active--tertiary--600` | Active theme tertiary shade 600. | `var(--graupl-theme-light--tertiary--600)` |\n// | `--graupl-theme-active--tertiary--700` | Active theme tertiary shade 700. | `var(--graupl-theme-light--tertiary--700)` |\n// | `--graupl-theme-active--tertiary--800` | Active theme tertiary shade 800. | `var(--graupl-theme-light--tertiary--800)` |\n// | `--graupl-theme-active--tertiary--900` | Active theme tertiary shade 900. | `var(--graupl-theme-light--tertiary--900)` |\n// | `--graupl-root-color` | Base text colour applied to `:root`. | `var(--graupl-theme-active--primary--900)` |\n// | `--graupl-root-background` | Base background colour applied to `:root`. | `var(--graupl-theme-active--primary--100)` |\n// | `--graupl-color` | Text colour token. | `var(--graupl-root-color)` |\n// | `--graupl-background` | Background colour token. | `var(--graupl-root-background)` |\n// | `--graupl-border-color` | Border colour token. | `var(--graupl-color)` |\n//\n// The following sass variables can be used to customize colour generation:\n// | Variable | Description | Default Value |\n// | --- | --- | --- |\n// | `$selector-base` | The selector base for the component. | `.` |\n// | `$modifier-selector-base` | The selector base for component modifiers. | `.` |\n// | `$generate-base-colors` | Flag to generate base colour tokens. | `true` |\n// | `$generate-base-themes` | Flag to generate base theme tokens. | `true` |\n// | `$theme-selector-base` | The selector base for the theme modifiers. | `$modifier-selector-base` |\n// | `$theme-selector-prefix` | Prefix for theme modifiers. | `\".\"` |\n// | `$theme-selector-suffix` | Suffix for theme modifiers. | `\"-mode\"` |\n// | `$root-selector-base` | The base selector for the root component. | `\":\"` |\n// | `$root-selector` | The selector for the root component. | `\"root\"` |\n// | `$colors` | Map of base colours and shades. | See `_defaults.scss` |\n// | `$themes` | List of available themes. | `(light, dark)` |\n// | `$default-theme` | Theme used for the active tokens at `:root`. | `light` |\n// | `$theme-mappings` | Shade remapping per theme. | See `_defaults.scss` |\n// | `$theme-map` | Expanded map of theme → colour → shade references. | Auto-generated |\n//\n// @example\n// <div class=\"dark-mode\">\n// <p>Content inside a dark theme container.</p>\n// </div>\n//\n// @example\n// <div class=\"light-mode\">\n// <p>Content inside a light theme container.</p>\n// </div>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(theme) {\n // :root\n #{defaults.$root-selector-base}#{defaults.$root-selector} {\n background: $root-background;\n color: $root-color;\n\n // Generate the default colour properties.\n @each $color, $map in defaults.$colors {\n @each $shade, $value in $map {\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n --#{root-defaults.$prefix}#{$color}: #{$value};\n } @else {\n --#{root-defaults.$prefix}#{$color}--#{$shade}: #{$value};\n }\n }\n }\n\n // Generate the active theme properties.\n @each $color, $map in map.get($themes, defaults.$default-theme) {\n @each $shade, $value in $map {\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n --#{root-defaults.$prefix}theme-active--#{$color}: #{$value};\n } @else {\n --#{root-defaults.$prefix}theme-active--#{$color}--#{$shade}: #{$value};\n }\n }\n }\n }\n\n // Generate the available theme properties.\n @each $theme-name, $theme in $themes {\n // e.g. .light-mode, .dark-mode\n @include theme.theme($theme-name) {\n @each $color, $map in $theme {\n @each $shade, $value in $map {\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n --#{root-defaults.$prefix}theme-active--#{$color}: #{$value};\n } @else {\n --#{root-defaults.$prefix}theme-active--#{$color}--#{$shade}: #{$value};\n }\n }\n }\n\n color-scheme: #{$theme-name};\n }\n }\n}\n","// @graupl/core color theme variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n//\n// Custom property defaults:\n// | Custom property | Default |\n// | ------------------------------------- | ----------------------------------------- |\n// | --graupl-primary | hsl(219deg 75% 50%) |\n// | --graupl-primary--100 | hsl(219deg 100% 95%) |\n// | --graupl-primary--200 | hsl(219deg 90% 80%) |\n// | --graupl-primary--300 | hsl(219deg 80% 65%) |\n// | --graupl-primary--400 | hsl(219deg 75% 55%) |\n// | --graupl-primary--500 | hsl(219deg 75% 50%) |\n// | --graupl-primary--600 | hsl(219deg 75% 45%) |\n// | --graupl-primary--700 | hsl(219deg 80% 35%) |\n// | --graupl-primary--800 | hsl(219deg 90% 20%) |\n// | --graupl-primary--900 | hsl(219deg 100% 10%) |\n// | --graupl-secondary | hsl(235deg 15% 50%) |\n// | --graupl-secondary--100 | hsl(235deg 40% 95%) |\n// | --graupl-secondary--200 | hsl(235deg 30% 80%) |\n// | --graupl-secondary--300 | hsl(235deg 20% 65%) |\n// | --graupl-secondary--400 | hsl(235deg 15% 55%) |\n// | --graupl-secondary--500 | hsl(235deg 15% 50%) |\n// | --graupl-secondary--600 | hsl(235deg 15% 45%) |\n// | --graupl-secondary--700 | hsl(235deg 20% 35%) |\n// | --graupl-secondary--800 | hsl(235deg 30% 20%) |\n// | --graupl-secondary--900 | hsl(235deg 40% 10%) |\n// | --graupl-tertiary | hsl(340deg 60% 50%) |\n// | --graupl-tertiary--100 | hsl(340deg 85% 95%) |\n// | --graupl-tertiary--200 | hsl(340deg 75% 80%) |\n// | --graupl-tertiary--300 | hsl(340deg 65% 65%) |\n// | --graupl-tertiary--400 | hsl(340deg 60% 55%) |\n// | --graupl-tertiary--500 | hsl(340deg 60% 50%) |\n// | --graupl-tertiary--600 | hsl(340deg 60% 45%) |\n// | --graupl-tertiary--700 | hsl(340deg 65% 35%) |\n// | --graupl-tertiary--800 | hsl(340deg 75% 20%) |\n// | --graupl-tertiary--900 | hsl(340deg 85% 10%) |\n// | --graupl-theme--light--primary | var(--graupl-primary) |\n// | --graupl-theme-light--primary--100 | var(--graupl-primary--100) |\n// | --graupl-theme-light--primary--200 | var(--graupl-primary--200) |\n// | --graupl-theme-light--primary--300 | var(--graupl-primary--300) |\n// | --graupl-theme-light--primary--400 | var(--graupl-primary--400) |\n// | --graupl-theme-light--primary--500 | var(--graupl-primary--500) |\n// | --graupl-theme-light--primary--600 | var(--graupl-primary--600) |\n// | --graupl-theme-light--primary--700 | var(--graupl-primary--700) |\n// | --graupl-theme-light--primary--800 | var(--graupl-primary--800) |\n// | --graupl-theme-light--primary--900 | var(--graupl-primary--900) |\n// | --graupl-theme--light--secondary | var(--graupl-secondary) |\n// | --graupl-theme-light--secondary--100 | var(--graupl-secondary--100) |\n// | --graupl-theme-light--secondary--200 | var(--graupl-secondary--200) |\n// | --graupl-theme-light--secondary--300 | var(--graupl-secondary--300) |\n// | --graupl-theme-light--secondary--400 | var(--graupl-secondary--400) |\n// | --graupl-theme-light--secondary--500 | var(--graupl-secondary--500) |\n// | --graupl-theme-light--secondary--600 | var(--graupl-secondary--600) |\n// | --graupl-theme-light--secondary--700 | var(--graupl-secondary--700) |\n// | --graupl-theme-light--secondary--800 | var(--graupl-secondary--800) |\n// | --graupl-theme-light--secondary--900 | var(--graupl-secondary--900) |\n// | --graupl-theme--light--tertiary | var(--graupl-tertiary) |\n// | --graupl-theme-light--tertiary--100 | var(--graupl-tertiary--100) |\n// | --graupl-theme-light--tertiary--200 | var(--graupl-tertiary--200) |\n// | --graupl-theme-light--tertiary--300 | var(--graupl-tertiary--300) |\n// | --graupl-theme-light--tertiary--400 | var(--graupl-tertiary--400) |\n// | --graupl-theme-light--tertiary--500 | var(--graupl-tertiary--500) |\n// | --graupl-theme-light--tertiary--600 | var(--graupl-tertiary--600) |\n// | --graupl-theme-light--tertiary--700 | var(--graupl-tertiary--700) |\n// | --graupl-theme-light--tertiary--800 | var(--graupl-tertiary--800) |\n// | --graupl-theme-light--tertiary--900 | var(--graupl-tertiary--900) |\n// | --graupl-theme--dark--primary | var(--graupl-primary) |\n// | --graupl-theme-dark--primary--100 | var(--graupl-primary--900) |\n// | --graupl-theme-dark--primary--200 | var(--graupl-primary--800) |\n// | --graupl-theme-dark--primary--300 | var(--graupl-primary--700) |\n// | --graupl-theme-dark--primary--400 | var(--graupl-primary--600) |\n// | --graupl-theme-dark--primary--500 | var(--graupl-primary--500) |\n// | --graupl-theme-dark--primary--600 | var(--graupl-primary--400) |\n// | --graupl-theme-dark--primary--700 | var(--graupl-primary--300) |\n// | --graupl-theme-dark--primary--800 | var(--graupl-primary--200) |\n// | --graupl-theme-dark--primary--900 | var(--graupl-primary--100) |\n// | --graupl-theme--dark--secondary | var(--graupl-secondary) |\n// | --graupl-theme-dark--secondary--100 | var(--graupl-secondary--900) |\n// | --graupl-theme-dark--secondary--200 | var(--graupl-secondary--800) |\n// | --graupl-theme-dark--secondary--300 | var(--graupl-secondary--700) |\n// | --graupl-theme-dark--secondary--400 | var(--graupl-secondary--600) |\n// | --graupl-theme-dark--secondary--500 | var(--graupl-secondary--500) |\n// | --graupl-theme-dark--secondary--600 | var(--graupl-secondary--400) |\n// | --graupl-theme-dark--secondary--700 | var(--graupl-secondary--300) |\n// | --graupl-theme-dark--secondary--800 | var(--graupl-secondary--200) |\n// | --graupl-theme-dark--secondary--900 | var(--graupl-secondary--100) |\n// | --graupl-theme--dark--tertiary | var(--graupl-tertiary) |\n// | --graupl-theme-dark--tertiary--100 | var(--graupl-tertiary--900) |\n// | --graupl-theme-dark--tertiary--200 | var(--graupl-tertiary--800) |\n// | --graupl-theme-dark--tertiary--300 | var(--graupl-tertiary--700) |\n// | --graupl-theme-dark--tertiary--400 | var(--graupl-tertiary--600) |\n// | --graupl-theme-dark--tertiary--500 | var(--graupl-tertiary--500) |\n// | --graupl-theme-dark--tertiary--600 | var(--graupl-tertiary--400) |\n// | --graupl-theme-dark--tertiary--700 | var(--graupl-tertiary--300) |\n// | --graupl-theme-dark--tertiary--800 | var(--graupl-tertiary--200) |\n// | --graupl-theme-dark--tertiary--900 | var(--graupl-tertiary--100) |\n// | --graupl-theme-active--primary | var(--graupl-theme-light--primary) |\n// | --graupl-theme-active--primary--100 | var(--graupl-theme-light--primary--100) |\n// | --graupl-theme-active--primary--200 | var(--graupl-theme-light--primary--200) |\n// | --graupl-theme-active--primary--300 | var(--graupl-theme-light--primary--300) |\n// | --graupl-theme-active--primary--400 | var(--graupl-theme-light--primary--400) |\n// | --graupl-theme-active--primary--500 | var(--graupl-theme-light--primary--500) |\n// | --graupl-theme-active--primary--600 | var(--graupl-theme-light--primary--600) |\n// | --graupl-theme-active--primary--700 | var(--graupl-theme-light--primary--700) |\n// | --graupl-theme-active--primary--800 | var(--graupl-theme-light--primary--800) |\n// | --graupl-theme-active--primary--900 | var(--graupl-theme-light--primary--900) |\n// | --graupl-theme-active--secondary | var(--graupl-theme-light--secondary) |\n// | --graupl-theme-active--secondary--100 | var(--graupl-theme-light--secondary--100) |\n// | --graupl-theme-active--secondary--200 | var(--graupl-theme-light--secondary--200) |\n// | --graupl-theme-active--secondary--300 | var(--graupl-theme-light--secondary--300) |\n// | --graupl-theme-active--secondary--400 | var(--graupl-theme-light--secondary--400) |\n// | --graupl-theme-active--secondary--500 | var(--graupl-theme-light--secondary--500) |\n// | --graupl-theme-active--secondary--600 | var(--graupl-theme-light--secondary--600) |\n// | --graupl-theme-active--secondary--700 | var(--graupl-theme-light--secondary--700) |\n// | --graupl-theme-active--secondary--800 | var(--graupl-theme-light--secondary--800) |\n// | --graupl-theme-active--secondary--900 | var(--graupl-theme-light--secondary--900) |\n// | --graupl-theme-active--tertiary | var(--graupl-theme-light--tertiary) |\n// | --graupl-theme-active--tertiary--100 | var(--graupl-theme-light--tertiary--100) |\n// | --graupl-theme-active--tertiary--200 | var(--graupl-theme-light--tertiary--200) |\n// | --graupl-theme-active--tertiary--300 | var(--graupl-theme-light--tertiary--300) |\n// | --graupl-theme-active--tertiary--400 | var(--graupl-theme-light--tertiary--400) |\n// | --graupl-theme-active--tertiary--500 | var(--graupl-theme-light--tertiary--500) |\n// | --graupl-theme-active--tertiary--600 | var(--graupl-theme-light--tertiary--600) |\n// | --graupl-theme-active--tertiary--700 | var(--graupl-theme-light--tertiary--700) |\n// | --graupl-theme-active--tertiary--800 | var(--graupl-theme-light--tertiary--800) |\n// | --graupl-theme-active--tertiary--900 | var(--graupl-theme-light--tertiary--900) |\n// | --graupl-root-color | var(--graupl-theme-active--primary--900) |\n// | --graupl-root-background | var(--graupl-theme-active--primary--100) |\n// | --graupl-color | var(--graupl-root-color) |\n// | --graupl-background | var(--graupl-root-background) |\n// | --graupl-border-color | var(--graupl-color) |\n\n@use \"defaults\";\n@use \"../../defaults\" as root-defaults;\n@use \"sass:map\";\n\n// A colour map of base colours and their shades.\n$colors: ();\n\n// Create a map for each colour.\n@each $color, $map in defaults.$colors {\n // A map for the current colour.\n $color-map: ();\n\n @each $shade, $value in $map {\n $color-property: \"\";\n\n // Set the custom prop name and fallback value.\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n // --graupl-primary, --graupl-secondary, --graupl-tertiary\n $color-property: var(--#{root-defaults.$prefix}#{$color}, $value);\n } @else {\n // --graupl-primary--100, --graupl-primary--200, --graupl-primary--300, --graupl-primary--400, --graupl-primary--500, --graupl-primary--600, --graupl-primary--700, --graupl-primary--800, --graupl-primary--900\n // --graupl-secondary--100, --graupl-secondary--200, --graupl-secondary--300, --graupl-secondary--400, --graupl-secondary--500, --graupl-secondary--600, --graupl-secondary--700, --graupl-secondary--800, --graupl-secondary--900\n // --graupl-tertiary--100, --graupl-tertiary--200, --graupl-tertiary--300, --graupl-tertiary--400, --graupl-tertiary--500, --graupl-tertiary--600, --graupl-tertiary--700, --graupl-tertiary--800, --graupl-tertiary--900\n $color-property: var(\n --#{root-defaults.$prefix}#{$color}--#{$shade},\n $value\n );\n }\n\n // Add the custom prop to the map.\n $color-map: map.merge(\n $color-map,\n (\n $shade: $color-property,\n )\n );\n }\n\n // Merge the colour map with the existing colours.\n $colors: map.merge(\n $colors,\n (\n $color: $color-map,\n )\n );\n}\n\n$themes: (\n active: (),\n);\n\n// Generate all of the theme properties.\n@each $theme-name, $theme-map in defaults.$theme-map {\n $theme: ();\n\n @each $color-name, $map in $theme-map {\n $color-map: ();\n\n @each $shade, $value in $map {\n $color-property: \"\";\n\n // Set the custom prop name and fallback value.\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n // --graupl-theme--light--primary, --graupl-theme--light--secondary, --graupl-theme--light--tertiary\n // --graupl-theme--dark--primary, --graupl-theme--dark--secondary, --graupl-theme--dark--tertiary\n $color-property: var(\n --#{root-defaults.$prefix}theme--#{$theme-name}--#{$color-name},\n #{map.get($colors, map.get($value, color), map.get($value, shade))}\n );\n } @else {\n // --graupl-theme-light--primary--100, --graupl-theme-light--primary--200, --graupl-theme-light--primary--300, --graupl-theme-light--primary--400, --graupl-theme-light--primary--500, --graupl-theme-light--primary--600, --graupl-theme-light--primary--700, --graupl-theme-light--primary--800, --graupl-theme-light--primary--900\n // --graupl-theme-light--secondary--100, --graupl-theme-light--secondary--200, --graupl-theme-light--secondary--300, --graupl-theme-light--secondary--400, --graupl-theme-light--secondary--500, --graupl-theme-light--secondary--600, --graupl-theme-light--secondary--700, --graupl-theme-light--secondary--800, --graupl-theme-light--secondary--900\n // --graupl-theme-light--tertiary--100, --graupl-theme-light--tertiary--200, --graupl-theme-light--tertiary--300, --graupl-theme-light--tertiary--400, --graupl-theme-light--tertiary--500, --graupl-theme-light--tertiary--600, --graupl-theme-light--tertiary--700, --graupl-theme-light--tertiary--800, --graupl-theme-light--tertiary--900\n // --graupl-theme-dark--primary--100, --graupl-theme-dark--primary--200, --graupl-theme-dark--primary--300, --graupl-theme-dark--primary--400, --graupl-theme-dark--primary--500, --graupl-theme-dark--primary--600, --graupl-theme-dark--primary--700, --graupl-theme-dark--primary--800, --graupl-theme-dark--primary--900\n // --graupl-theme-dark--secondary--100, --graupl-theme-dark--secondary--200, --graupl-theme-dark--secondary--300, --graupl-theme-dark--secondary--400, --graupl-theme-dark--secondary--500, --graupl-theme-dark--secondary--600, --graupl-theme-dark--secondary--700, --graupl-theme-dark--secondary--800, --graupl-theme-dark--secondary--900\n // --graupl-theme-dark--tertiary--100, --graupl-theme-dark--tertiary--200, --graupl-theme-dark--tertiary--300, --graupl-theme-dark--tertiary--400, --graupl-theme-dark--tertiary--500, --graupl-theme-dark--tertiary--600, --graupl-theme-dark--tertiary--700, --graupl-theme-dark--tertiary--800, --graupl-theme-dark--tertiary--900\n $color-property: var(\n --#{root-defaults.$prefix}theme-#{$theme-name}--#{$color-name}--#{$shade},\n #{map.get($colors, map.get($value, color), map.get($value, shade))}\n );\n }\n\n $color-map: map.merge(\n $color-map,\n (\n $shade: $color-property,\n )\n );\n }\n\n $theme: map.merge(\n $theme,\n (\n $color-name: $color-map,\n )\n );\n }\n\n $themes: map.merge(\n $themes,\n (\n $theme-name: $theme,\n )\n );\n}\n\n// Generate the active theme properties.\n@if map.has-key($themes, defaults.$default-theme) {\n @each $color-name, $map in map.get($themes, defaults.$default-theme) {\n $color-map: ();\n\n @each $shade, $value in $map {\n $color-property: \"\";\n\n // Set the custom prop name and fallback value.\n // Handle _default shade vs proper shade mappings.\n @if $shade == \"_default\" {\n // --graupl-theme-active--primary, --graupl-theme-active--secondary, --graupl-theme-active--tertiary\n $color-property: var(\n --#{root-defaults.$prefix}theme-active--#{$color-name},\n #{$value}\n );\n } @else {\n // --graupl-theme-active--primary--100, --graupl-theme-active--primary--200, --graupl-theme-active--primary--300, --graupl-theme-active--primary--400, --graupl-theme-active--primary--500, --graupl-theme-active--primary--600, --graupl-theme-active--primary--700, --graupl-theme-active--primary--800, --graupl-theme-active--primary--900\n // --graupl-theme-active--secondary--100, --graupl-theme-active--secondary--200, --graupl-theme-active--secondary--300, --graupl-theme-active--secondary--400, --graupl-theme-active--secondary--500, --graupl-theme-active--secondary--600, --graupl-theme-active--secondary--700, --graupl-theme-active--secondary--800, --graupl-theme-active--secondary--900\n // --graupl-theme-active--tertiary--100, --graupl-theme-active--tertiary--200, --graupl-theme-active--tertiary--300, --graupl-theme-active--tertiary--400, --graupl-theme-active--tertiary--500, --graupl-theme-active--tertiary--600, --graupl-theme-active--tertiary--700, --graupl-theme-active--tertiary--800, --graupl-theme-active--tertiary--900\n $color-property: var(\n --#{root-defaults.$prefix}theme-active--#{$color-name}--#{$shade},\n #{$value}\n );\n }\n\n $color-map: map.merge(\n $color-map,\n (\n $shade: $color-property,\n )\n );\n }\n\n $themes: map.merge(\n $themes,\n (\n active: map.merge(\n map.get($themes, active),\n (\n $color-name: $color-map,\n )\n ),\n )\n );\n }\n}\n\n// Colour properties.\n// --graupl-root-color\n$root-color: var(--#{root-defaults.$prefix}root-color);\n\n// --graupl-root-background\n$root-background: var(--#{root-defaults.$prefix}root-background);\n\n@if map.has-key($themes, active, primary, 900) {\n // --graupl-root-color\n $root-color: var(\n --#{root-defaults.$prefix}root-color,\n #{map.get(map.get(map.get($themes, active), primary), 900)}\n );\n}\n\n@if map.has-key($themes, active, primary, 100) {\n // --graupl-root-background\n $root-background: var(\n --#{root-defaults.$prefix}root-background,\n #{map.get(map.get(map.get($themes, active), primary), 100)}\n );\n}\n\n// --graupl-color\n$color: var(--#{root-defaults.$prefix}color, #{$root-color});\n\n// --graupl-background\n$background: var(--#{root-defaults.$prefix}background, #{$root-background});\n\n// --graupl-border-color\n$border-color: var(--#{root-defaults.$prefix}border-color, #{$color});\n","// @graupl/core theme mixins.\n//\n// A series of mixins to tie styles to a theme-mode.\n\n@use \"../functions/theme\";\n@use \"../theme/color/defaults\" as color-defaults;\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific theme mode.\n///\n/// @param {string} $theme-name\n/// The name of the theme mode to apply the styles to.\n@mixin theme($theme-name) {\n #{color-defaults.$theme-selector-base}#{color-defaults.$theme-selector-prefix}#{$theme-name}#{color-defaults.$theme-selector-suffix} {\n @content;\n }\n}\n\n/// Generates a theme modifiers with custom props.\n///\n/// @param {map} $theme-map\n/// The map of custom props.\n/// @param {string} $selector-base\n/// The selector base for the theme modifier.\n/// @param {string} $selector-prefix\n/// The selector prefix for the theme modifer.\n/// @param {string} $scope\n/// The scope of the custom properties.\n/// @param {string} $base\n/// The base selector to append the theme modifier to.\n@mixin generate-modifiers(\n $theme-map,\n $selector-base,\n $selector-prefix,\n $scope: \"\",\n $base: \"&\"\n) {\n @each $color, $map in $theme-map {\n // e.g. &.primary, &.secondary, &.tertiary\n #{$base}#{$selector-base}#{$selector-prefix}#{$color} {\n @each $prop, $value in $map {\n --#{root-defaults.$prefix}#{$scope}#{$prop}: #{theme.get(\n map.get($value, color),\n map.get($value, shade)\n )};\n }\n }\n }\n}\n","// @graupl/core typography theme default values.\n//\n// Generally, these should not be used directly when styling components unless a static value is needed.\n// They are mainly used to provide class selectors, fallbacks for custom properties, or loop values.\n//\n// They should not be used to define direct property values (i.e. font-size, color, etc.).\n// Those should be defined as custom properties in the `_variables.scss` file.\n\n@use \"../../defaults\" as root-defaults;\n@use \"sass:map\";\n\n// font properties.\n$selector-base: root-defaults.$element-selector-base !default;\n$modifier-selector-base: root-defaults.$modifier-selector-base !default;\n$paragraph-selector-base: $selector-base !default;\n$paragraph-selector: \"p\";\n$small-selector-base: $selector-base !default;\n$small-selector: \"small\";\n$h1-selector-base: $selector-base !default;\n$h1-selector: \"h1\" !default;\n$h2-selector-base: $selector-base !default;\n$h2-selector: \"h2\" !default;\n$h3-selector-base: $selector-base !default;\n$h3-selector: \"h3\" !default;\n$h4-selector-base: $selector-base !default;\n$h4-selector: \"h4\" !default;\n$h5-selector-base: $selector-base !default;\n$h5-selector: \"h5\" !default;\n$h6-selector-base: $selector-base !default;\n$h6-selector: \"h6\" !default;\n$root-selector-base: \":\" !default;\n$root-selector: \"root\" !default;\n$bold-selector-base: $selector-base !default;\n$bold-selector: \"b\" !default;\n$strong-selector-base: $selector-base !default;\n$strong-selector: \"strong\" !default;\n$body-selector-base: $selector-base !default;\n$body-selector: \"body\" !default;\n$generate-base-font-sizes: root-defaults.$generate-base-font-sizes !default;\n$generate-base-font-weights: root-defaults.$generate-base-font-weights !default;\n$font-size-base: 1rem !default;\n$root-font-size: clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem) !default;\n$line-height: 1.2em !default;\n\n// Multipliers for font sizes.\n// This uses a minor third scale.\n// See: https://typescale.com/?size=16&scale=1.250&text=A%20Visual%20Type%20Scale&font=Lato&fontweight=400&bodyfont=body_font_default&bodyfontweight=400&lineheight=1.75&backgroundcolor=%23ffffff&fontcolor=%23000000\n$-font-size-multipliers: (\n xs: 0.694,\n sm: 0.833,\n base: 1,\n lg: 1.2,\n xl: 1.44,\n 2xl: 1.728,\n 3xl: 2.074,\n 4xl: 2.488,\n 5xl: 2.986,\n);\n$font-size-multipliers: () !default;\n\n// Merge the font size multipliers with the default ones.\n@if $generate-base-font-sizes {\n $font-size-multipliers: map.merge(\n $-font-size-multipliers,\n $font-size-multipliers\n );\n}\n\n// Weights.\n$-font-weights: (\n light: 300,\n normal: 400,\n bold: 700,\n);\n$font-weights: () !default;\n\n// Merge the custom font weights with the default ones.\n@if $generate-base-font-weights {\n $font-weights: map.merge($-font-weights, $font-weights);\n}\n\n/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n$root-font-family:\n system-ui,\n -apple-system,\n blinkmacsystemfont,\n \"Segoe UI\",\n roboto,\n \"Helvetica Neue\",\n arial,\n sans-serif !default;\n","// @graupl/core typography theme styles.\n//\n// This module defines typography tokens for body text, small text, and headings.\n//\n// The following selectors are generated by default:\n// - `:root`: Sets root font family and size.\n// - `b`: Applies the bold weight token.\n// - `strong`: Applies the bold weight token.\n// - `body`: Applies body typography tokens.\n// - `p`: Applies paragraph typography tokens.\n// - `small`: Applies small text typography tokens.\n// - `h1`: Applies H1 typography tokens.\n// - `h2`: Applies H2 typography tokens.\n// - `h3`: Applies H3 typography tokens.\n// - `h4`: Applies H4 typography tokens.\n// - `h5`: Applies H5 typography tokens.\n// - `h6`: Applies H6 typography tokens.\n//\n// The following custom properties can be used to customize typography:\n// | Property | Description | Default Value |\n// | --- | --- | --- |\n// | `--graupl-font-size-base` | Base font size used for scaling. | `1rem` |\n// | `--graupl-line-height` | Base line height. | `1.2em` |\n// | `--graupl-font-xs` | XS font size token. | `calc(0.694 * var(--graupl-font-size-base))` |\n// | `--graupl-font-sm` | Small font size token. | `calc(0.833 * var(--graupl-font-size-base))` |\n// | `--graupl-font-base` | Base font size token. | `var(--graupl-font-size-base)` |\n// | `--graupl-font-lg` | Large font size token. | `calc(1.2 * var(--graupl-font-size-base))` |\n// | `--graupl-font-xl` | XL font size token. | `calc(1.44 * var(--graupl-font-size-base))` |\n// | `--graupl-font-2xl` | 2XL font size token. | `calc(1.728 * var(--graupl-font-size-base))` |\n// | `--graupl-font-3xl` | 3XL font size token. | `calc(2.074 * var(--graupl-font-size-base))` |\n// | `--graupl-font-4xl` | 4XL font size token. | `calc(2.488 * var(--graupl-font-size-base))` |\n// | `--graupl-font-5xl` | 5XL font size token. | `calc(2.986 * var(--graupl-font-size-base))` |\n// | `--graupl-font-weight-light` | Light font weight token. | `300` |\n// | `--graupl-font-weight-normal` | Normal font weight token. | `400` |\n// | `--graupl-font-weight-bold` | Bold font weight token. | `700` |\n// | `--graupl-root-font-family` | Root font family. | `system-ui, -apple-system, blinkmacsystemfont, \"Segoe UI\", roboto, \"Helvetica Neue\", arial, sans-serif` |\n// | `--graupl-root-font-size` | Root font size. | `clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem)` |\n// | `--graupl-body-font-size` | Body font size. | `var(--graupl-font-base)` |\n// | `--graupl-body-line-height` | Body line height. | `var(--graupl-line-height)` |\n// | `--graupl-body-font-weight` | Body font weight. | `var(--graupl-font-weight-normal)` |\n// | `--graupl-body-color` | Body text colour. | `var(--graupl-color)` |\n// | `--graupl-paragraph-font-size` | Paragraph font size. | `var(--graupl-body-font-size)` |\n// | `--graupl-paragraph-line-height` | Paragraph line height. | `var(--graupl-body-line-height)` |\n// | `--graupl-paragraph-margin` | Paragraph margin. | `0 0 var(--graupl-spacer-2) 0` |\n// | `--graupl-paragraph-font-weight` | Paragraph font weight. | `var(--graupl-body-font-weight)` |\n// | `--graupl-paragraph-color` | Paragraph text colour. | `var(--graupl-body-color)` |\n// | `--graupl-small-font-size` | Small text font size. | `var(--graupl-font-sm)` |\n// | `--graupl-small-line-height` | Small text line height. | `var(--graupl-line-height)` |\n// | `--graupl-small-margin` | Small text margin. | `0 0 var(--graupl-spacer-2) 0` |\n// | `--graupl-small-font-weight` | Small text font weight. | `var(--graupl-body-font-weight)` |\n// | `--graupl-small-color` | Small text colour. | `var(--graupl-body-color)` |\n// | `--graupl-heading-font-family` | Heading font family. | `var(--graupl-root-font-family)` |\n// | `--graupl-heading-line-height` | Heading line height. | `var(--graupl-line-height)` |\n// | `--graupl-heading-margin` | Base heading margin. | `var(--graupl-spacer-5) 0 var(--graupl-spacer-2) 0` |\n// | `--graupl-heading-font-weight` | Base heading font weight. | `var(--graupl-font-weight-bold)` |\n// | `--graupl-heading-color` | Base heading colour. | `var(--graupl-color)` |\n// | `--graupl-h1-font-size` | H1 font size. | `var(--graupl-font-5xl)` |\n// | `--graupl-h1-line-height` | H1 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h1-margin` | H1 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h1-font-family` | H1 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h1-font-weight` | H1 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h1-color` | H1 colour. | `var(--graupl-heading-color)` |\n// | `--graupl-h2-font-size` | H2 font size. | `var(--graupl-font-4xl)` |\n// | `--graupl-h2-line-height` | H2 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h2-margin` | H2 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h2-font-family` | H2 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h2-font-weight` | H2 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h2-color` | H2 colour. | `var(--graupl-heading-color)` |\n// | `--graupl-h3-font-size` | H3 font size. | `var(--graupl-font-3xl)` |\n// | `--graupl-h3-line-height` | H3 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h3-margin` | H3 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h3-font-family` | H3 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h3-font-weight` | H3 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h3-color` | H3 colour. | `var(--graupl-heading-color)` |\n// | `--graupl-h4-font-size` | H4 font size. | `var(--graupl-font-2xl)` |\n// | `--graupl-h4-line-height` | H4 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h4-margin` | H4 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h4-font-family` | H4 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h4-font-weight` | H4 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h4-color` | H4 colour. | `var(--graupl-heading-color)` |\n// | `--graupl-h5-font-size` | H5 font size. | `var(--graupl-font-xl)` |\n// | `--graupl-h5-line-height` | H5 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h5-margin` | H5 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h5-font-family` | H5 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h5-font-weight` | H5 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h5-color` | H5 colour. | `var(--graupl-heading-color)` |\n// | `--graupl-h6-font-size` | H6 font size. | `var(--graupl-font-lg)` |\n// | `--graupl-h6-line-height` | H6 line height. | `var(--graupl-heading-line-height)` |\n// | `--graupl-h6-margin` | H6 margin. | `var(--graupl-heading-margin)` |\n// | `--graupl-h6-font-family` | H6 font family. | `var(--graupl-heading-font-family)` |\n// | `--graupl-h6-font-weight` | H6 font weight. | `var(--graupl-heading-font-weight)` |\n// | `--graupl-h6-color` | H6 colour. | `var(--graupl-heading-color)` |\n//\n// The following sass variables can be used to customize typography generation:\n// | Variable | Description | Default Value |\n// | --- | --- | --- |\n// | `$selector-base` | The selector base for the component. | `\"\"` |\n// | `$modifier-selector-base` | The selector base for component modifiers. | `\".\"` |\n// | `$paragraph-selector-base` | The base selector for the paragraph component. | `$selector-base` |\n// | `$paragraph-selector` | The selector for the paragraph component. | `\"p\"` |\n// | `$small-selector-base` | The base selector for the small component. | `$selector-base` |\n// | `$small-selector` | The selector for the small component. | `\"small\"` |\n// | `$h1-selector-base` | The base selector for the h1 component. | `$selector-base` |\n// | `$h1-selector` | The selector for the h1 component. | `\"h1\"` |\n// | `$h2-selector-base` | The base selector for the h2 component. | `$selector-base` |\n// | `$h2-selector` | The selector for the h2 component. | `\"h2\"` |\n// | `$h3-selector-base` | The base selector for the h3 component. | `$selector-base` |\n// | `$h3-selector` | The selector for the h3 component. | `\"h3\"` |\n// | `$h4-selector-base` | The base selector for the h4 component. | `$selector-base` |\n// | `$h4-selector` | The selector for the h4 component. | `\"h4\"` |\n// | `$h5-selector-base` | The base selector for the h5 component. | `$selector-base` |\n// | `$h5-selector` | The selector for the h5 component. | `\"h5\"` |\n// | `$h6-selector-base` | The base selector for the h6 component. | `$selector-base` |\n// | `$h6-selector` | The selector for the h6 component. | `\"h6\"` |\n// | `$root-selector-base` | The base selector for the root component. | `\":\"` |\n// | `$root-selector` | The selector for the root component. | `\"root\"` |\n// | `$bold-selector-base` | The base selector for the bold component. | `$selector-base` |\n// | `$bold-selector` | The selector for the bold component. | `\"b\"` |\n// | `$strong-selector-base` | The base selector for the strong component. | `$selector-base` |\n// | `$strong-selector` | The selector for the strong component. | `\"strong\"` |\n// | `$body-selector-base` | The base selector for the body component. | `$selector-base` |\n// | `$body-selector` | The selector for the body component. | `\"body\"` |\n// | `$generate-base-font-sizes` | Flag to generate the base font-size scale. | `true` |\n// | `$generate-base-font-weights` | Flag to generate the base font-weight scale. | `true` |\n// | `$font-size-base` | Base font size for the scale. | `1rem` |\n// | `$root-font-size` | Root font size value. | `clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem)` |\n// | `$line-height` | Base line height. | `1.2em` |\n// | `$font-size-multipliers` | Map of size keys to multipliers. | Minor third scale (see `_defaults.scss`) |\n// | `$font-weights` | Map of weight keys to values. | `light:300`, `normal:400`, `bold:700` |\n// | `$root-font-family` | Root font family stack. | System stack |\n//\n// @example\n// <div>\n// <h1>Heading 1</h1>\n// <p>Body copy with a <strong>bold</strong> word.</p>\n// <small>Supporting small text.</small>\n// </div>\n\n@use \"defaults\";\n@use \"variables\" as *;\n@use \"../../mixins/layer\" as *;\n@use \"sass:map\";\n\n@include layer(base) {\n // p\n #{defaults.$paragraph-selector-base}#{defaults.$paragraph-selector} {\n margin: $paragraph-margin;\n }\n\n // small\n #{defaults.$small-selector-base}#{defaults.$small-selector} {\n margin: $small-margin;\n }\n\n // h1\n #{defaults.$h1-selector-base}#{defaults.$h1-selector} {\n margin: $h1-margin;\n }\n\n // h2\n #{defaults.$h2-selector-base}#{defaults.$h2-selector} {\n margin: $h2-margin;\n }\n\n // h3\n #{defaults.$h3-selector-base}#{defaults.$h3-selector} {\n margin: $h3-margin;\n }\n\n // h4\n #{defaults.$h4-selector-base}#{defaults.$h4-selector} {\n margin: $h4-margin;\n }\n\n // h5\n #{defaults.$h5-selector-base}#{defaults.$h5-selector} {\n margin: $h5-margin;\n }\n\n // h6\n #{defaults.$h6-selector-base}#{defaults.$h6-selector} {\n margin: $h6-margin;\n }\n}\n\n@include layer(theme) {\n // :root\n #{defaults.$root-selector-base}#{defaults.$root-selector} {\n font-family: $root-font-family;\n font-size: $root-font-size;\n }\n\n // b, strong\n #{defaults.$bold-selector-base}#{defaults.$bold-selector},\n #{defaults.$strong-selector-base}#{defaults.$strong-selector} {\n font-weight: $font-weight-bold;\n }\n\n // body\n #{defaults.$body-selector-base}#{defaults.$body-selector} {\n color: $body-color;\n font-size: $body-font-size;\n font-weight: $body-font-weight;\n line-height: $body-line-height;\n }\n\n // p\n #{defaults.$paragraph-selector-base}#{defaults.$paragraph-selector} {\n color: $paragraph-color;\n font-size: $paragraph-font-size;\n font-weight: $paragraph-font-weight;\n line-height: $paragraph-line-height;\n }\n\n // small\n #{defaults.$small-selector-base}#{defaults.$small-selector} {\n color: $small-color;\n font-size: $small-font-size;\n font-weight: $small-font-weight;\n line-height: $small-line-height;\n }\n\n // h1\n #{defaults.$h1-selector-base}#{defaults.$h1-selector} {\n color: $h1-color;\n font-family: $h1-font-family;\n font-size: $h1-font-size;\n font-weight: $h1-font-weight;\n line-height: $h1-line-height;\n }\n\n // h2\n #{defaults.$h2-selector-base}#{defaults.$h2-selector} {\n color: $h2-color;\n font-family: $h2-font-family;\n font-size: $h2-font-size;\n font-weight: $h2-font-weight;\n line-height: $h2-line-height;\n }\n\n // h3\n #{defaults.$h3-selector-base}#{defaults.$h3-selector} {\n color: $h3-color;\n font-family: $h3-font-family;\n font-size: $h3-font-size;\n font-weight: $h3-font-weight;\n line-height: $h3-line-height;\n }\n\n // h4\n #{defaults.$h4-selector-base}#{defaults.$h4-selector} {\n color: $h4-color;\n font-family: $h4-font-family;\n font-size: $h4-font-size;\n font-weight: $h4-font-weight;\n line-height: $h4-line-height;\n }\n\n // h5\n #{defaults.$h5-selector-base}#{defaults.$h5-selector} {\n color: $h5-color;\n font-family: $h5-font-family;\n font-size: $h5-font-size;\n font-weight: $h5-font-weight;\n line-height: $h5-line-height;\n }\n\n // h6\n #{defaults.$h6-selector-base}#{defaults.$h6-selector} {\n color: $h6-color;\n font-family: $h6-font-family;\n font-size: $h6-font-size;\n font-weight: $h6-font-weight;\n line-height: $h6-line-height;\n }\n}\n","// @graupl/core typography theme variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n//\n// Custom property defaults:\n// | Custom property | Default |\n// | ------------------------------ | ----------------------------------------------------------------------------------------------------- |\n// | --graupl-font-size-base | 1rem |\n// | --graupl-line-height | 1.2em |\n// | --graupl-font-xs | calc(0.694 * var(--graupl-font-size-base)) |\n// | --graupl-font-sm | calc(0.833 * var(--graupl-font-size-base)) |\n// | --graupl-font-base | calc(1 * var(--graupl-font-size-base)) |\n// | --graupl-font-lg | calc(1.2 * var(--graupl-font-size-base)) |\n// | --graupl-font-xl | calc(1.44 * var(--graupl-font-size-base)) |\n// | --graupl-font-2xl | calc(1.728 * var(--graupl-font-size-base)) |\n// | --graupl-font-3xl | calc(2.074 * var(--graupl-font-size-base)) |\n// | --graupl-font-4xl | calc(2.488 * var(--graupl-font-size-base)) |\n// | --graupl-font-5xl | calc(2.986 * var(--graupl-font-size-base)) |\n// | --graupl-font-weight-light | 300 |\n// | --graupl-font-weight-normal | 400 |\n// | --graupl-font-weight-bold | 700 |\n// | --graupl-root-font-family | system-ui, -apple-system, blinkmacsystemfont, \"Segoe UI\", roboto, \"Helvetica Neue\", arial, sans-serif |\n// | --graupl-root-font-size | clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem) |\n// | --graupl-body-font-size | var(--graupl-font-base) |\n// | --graupl-body-line-height | var(--graupl-line-height) |\n// | --graupl-body-font-weight | var(--graupl-font-weight-normal) |\n// | --graupl-body-color | var(--graupl-color) |\n// | --graupl-paragraph-font-size | var(--graupl-body-font-size) |\n// | --graupl-paragraph-line-height | var(--graupl-body-line-height) |\n// | --graupl-paragraph-margin | 0 0 var(--graupl-spacer-2) 0 |\n// | --graupl-paragraph-font-weight | var(--graupl-body-font-weight) |\n// | --graupl-paragraph-color | var(--graupl-body-color) |\n// | --graupl-small-font-size | var(--graupl-font-sm) |\n// | --graupl-small-line-height | var(--graupl-line-height) |\n// | --graupl-small-margin | 0 0 var(--graupl-spacer-2) 0 |\n// | --graupl-small-font-weight | var(--graupl-body-font-weight) |\n// | --graupl-small-color | var(--graupl-body-color) |\n// | --graupl-heading-font-family | var(--graupl-root-font-family) |\n// | --graupl-heading-line-height | var(--graupl-line-height) |\n// | --graupl-heading-margin | var(--graupl-spacer-5) 0 var(--graupl-spacer-2) 0 |\n// | --graupl-heading-font-weight | var(--graupl-font-weight-bold) |\n// | --graupl-heading-color | var(--graupl-body-color) |\n// | --graupl-h1-font-size | var(--graupl-font-5xl) |\n// | --graupl-h1-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h1-margin | var(--graupl-heading-margin) |\n// | --graupl-h1-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h1-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h1-color | var(--graupl-heading-color) |\n// | --graupl-h2-font-size | var(--graupl-font-4xl) |\n// | --graupl-h2-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h2-margin | var(--graupl-heading-margin) |\n// | --graupl-h2-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h2-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h2-color | var(--graupl-heading-color) |\n// | --graupl-h3-font-size | var(--graupl-font-3xl) |\n// | --graupl-h3-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h3-margin | var(--graupl-heading-margin) |\n// | --graupl-h3-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h3-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h3-color | var(--graupl-heading-color) |\n// | --graupl-h4-font-size | var(--graupl-font-2xl) |\n// | --graupl-h4-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h4-margin | var(--graupl-heading-margin) |\n// | --graupl-h4-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h4-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h4-color | var(--graupl-heading-color) |\n// | --graupl-h5-font-size | var(--graupl-font-xl) |\n// | --graupl-h5-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h5-margin | var(--graupl-heading-margin) |\n// | --graupl-h5-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h5-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h5-color | var(--graupl-heading-color) |\n// | --graupl-h6-font-size | var(--graupl-font-lg) |\n// | --graupl-h6-line-height | var(--graupl-heading-line-height) |\n// | --graupl-h6-margin | var(--graupl-heading-margin) |\n// | --graupl-h6-font-family | var(--graupl-heading-font-family) |\n// | --graupl-h6-font-weight | var(--graupl-heading-font-weight) |\n// | --graupl-h6-color | var(--graupl-heading-color) |\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../variables\" as root-variables;\n@use \"../color/variables\" as color-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// Font properties.\n// --graupl-font-size-base\n$font-size-base: var(\n --#{root-defaults.$prefix}font-size-base,\n #{defaults.$font-size-base}\n);\n\n// --graupl-line-height\n$line-height: var(\n --#{root-defaults.$prefix}line-height,\n #{defaults.$line-height}\n);\n\n// Generate all of the font-size-x custom properties.\n$font-sizes: ();\n\n@each $key, $value in defaults.$font-size-multipliers {\n // --graupl-font-xs, --graupl-font-sm, --graupl-font-base, --graupl-font-lg, --graupl-font-xl, --graupl-font-2xl, --graupl-font-3xl, --graupl-font-4xl, --graupl-font-5xl\n $size: var(\n --#{root-defaults.$prefix}font-#{$key},\n calc(#{$value} * #{$font-size-base})\n );\n $font-sizes: map.set($font-sizes, $key, $size);\n}\n\n$font-weights: ();\n\n@each $key, $value in defaults.$font-weights {\n // --graupl-font-weight-light, --graupl-font-weight-normal, --graupl-font-weight-bold\n $weight: var(--#{root-defaults.$prefix}font-weight-#{$key}, $value);\n $font-weights: map.set($font-weights, $key, $weight);\n}\n\n// --graupl-font-weight-bold\n$font-weight-bold: var(\n --#{root-defaults.$prefix}font-weight-bold,\n #{map.get($font-weights, bold)}\n);\n\n// Root properties.\n// --graupl-root-font-family\n$root-font-family: var(\n --#{root-defaults.$prefix}root-font-family,\n #{defaults.$root-font-family}\n);\n\n// --graupl-root-font-size\n$root-font-size: var(\n --#{root-defaults.$prefix}root-font-size,\n #{defaults.$root-font-size}\n);\n\n// Typography properties.\n// --graupl-body-font-size\n$body-font-size: var(\n --#{root-defaults.$prefix}body-font-size,\n #{map.get($font-sizes, base)}\n);\n\n// --graupl-body-line-height\n$body-line-height: var(\n --#{root-defaults.$prefix}body-line-height,\n #{$line-height}\n);\n\n// --graupl-body-font-weight\n$body-font-weight: var(\n --#{root-defaults.$prefix}body-font-weight,\n #{map.get($font-weights, normal)}\n);\n\n// --graupl-body-color\n$body-color: var(\n --#{root-defaults.$prefix}body-color,\n #{color-variables.$color}\n);\n\n// --graupl-paragraph-font-size\n$paragraph-font-size: var(\n --#{root-defaults.$prefix}paragraph-font-size,\n #{$body-font-size}\n);\n\n// --graupl-paragraph-line-height\n$paragraph-line-height: var(\n --#{root-defaults.$prefix}paragraph-line-height,\n #{$body-line-height}\n);\n\n// --graupl-paragraph-margin\n$paragraph-margin: var(\n --#{root-defaults.$prefix}paragraph-margin,\n 0 0 #{map.get(root-variables.$spacers, 2)} 0\n);\n\n// --graupl-paragraph-font-weight\n$paragraph-font-weight: var(\n --#{root-defaults.$prefix}paragraph-font-weight,\n #{$body-font-weight}\n);\n\n// --graupl-paragraph-color\n$paragraph-color: var(\n --#{root-defaults.$prefix}paragraph-color,\n #{$body-color}\n);\n\n// --graupl-small-font-size\n$small-font-size: var(\n --#{root-defaults.$prefix}small-font-size,\n #{map.get($font-sizes, sm)}\n);\n\n// --graupl-small-line-height\n$small-line-height: var(\n --#{root-defaults.$prefix}small-line-height,\n #{$line-height}\n);\n\n// --graupl-small-margin\n$small-margin: var(\n --#{root-defaults.$prefix}small-margin,\n 0 0 #{map.get(root-variables.$spacers, 2)} 0\n);\n\n// --graupl-small-font-weight\n$small-font-weight: var(\n --#{root-defaults.$prefix}small-font-weight,\n #{$body-font-weight}\n);\n\n// --graupl-small-color\n$small-color: var(--#{root-defaults.$prefix}small-color, #{$body-color});\n\n// Headings properties.\n// --graupl-heading-font-family\n$heading-font-family: var(\n --#{root-defaults.$prefix}heading-font-family,\n $root-font-family\n);\n\n// --graupl-heading-line-height\n$heading-line-height: var(\n --#{root-defaults.$prefix}heading-line-height,\n #{$line-height}\n);\n\n// --graupl-heading-margin\n$heading-margin: var(\n --#{root-defaults.$prefix}heading-margin,\n #{map.get(root-variables.$spacers, 5)} 0\n #{map.get(root-variables.$spacers, 2)} 0\n);\n\n// --graupl-heading-font-weight\n$heading-font-weight: var(\n --#{root-defaults.$prefix}heading-font-weight,\n #{$font-weight-bold}\n);\n\n// --graupl-heading-color\n$heading-color: var(--#{root-defaults.$prefix}heading-color, #{$body-color});\n\n// H1 properties.\n// --graupl-h1-font-size\n$h1-font-size: var(\n --#{root-defaults.$prefix}h1-font-size,\n #{map.get($font-sizes, 5xl)}\n);\n\n// --graupl-h1-line-height\n$h1-line-height: var(\n --#{root-defaults.$prefix}h1-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h1-margin\n$h1-margin: var(--#{root-defaults.$prefix}h1-margin, #{$heading-margin});\n\n// --graupl-h1-font-family\n$h1-font-family: var(\n --#{root-defaults.$prefix}h1-font-family,\n $heading-font-family\n);\n\n// --graupl-h1-font-weight\n$h1-font-weight: var(\n --#{root-defaults.$prefix}h1-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h1-color\n$h1-color: var(--#{root-defaults.$prefix}h1-color, #{$heading-color});\n\n// H2 properties.\n// --graupl-h2-font-size\n$h2-font-size: var(\n --#{root-defaults.$prefix}h2-font-size,\n #{map.get($font-sizes, 4xl)}\n);\n\n// --graupl-h2-line-height\n$h2-line-height: var(\n --#{root-defaults.$prefix}h2-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h2-margin\n$h2-margin: var(--#{root-defaults.$prefix}h2-margin, #{$heading-margin});\n\n// --graupl-h2-font-family\n$h2-font-family: var(\n --#{root-defaults.$prefix}h2-font-family,\n $heading-font-family\n);\n\n// --graupl-h2-font-weight\n$h2-font-weight: var(\n --#{root-defaults.$prefix}h2-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h2-color\n$h2-color: var(--#{root-defaults.$prefix}h2-color, #{$heading-color});\n\n// H3 properties.\n// --graupl-h3-font-size\n$h3-font-size: var(\n --#{root-defaults.$prefix}h3-font-size,\n #{map.get($font-sizes, 3xl)}\n);\n\n// --graupl-h3-line-height\n$h3-line-height: var(\n --#{root-defaults.$prefix}h3-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h3-margin\n$h3-margin: var(--#{root-defaults.$prefix}h3-margin, #{$heading-margin});\n\n// --graupl-h3-font-family\n$h3-font-family: var(\n --#{root-defaults.$prefix}h3-font-family,\n $heading-font-family\n);\n\n// --graupl-h3-font-weight\n$h3-font-weight: var(\n --#{root-defaults.$prefix}h3-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h3-color\n$h3-color: var(--#{root-defaults.$prefix}h3-color, #{$heading-color});\n\n// H4 properties.\n// --graupl-h4-font-size\n$h4-font-size: var(\n --#{root-defaults.$prefix}h4-font-size,\n #{map.get($font-sizes, 2xl)}\n);\n\n// --graupl-h4-line-height\n$h4-line-height: var(\n --#{root-defaults.$prefix}h4-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h4-margin\n$h4-margin: var(--#{root-defaults.$prefix}h4-margin, #{$heading-margin});\n\n// --graupl-h4-font-family\n$h4-font-family: var(\n --#{root-defaults.$prefix}h4-font-family,\n $heading-font-family\n);\n\n// --graupl-h4-font-weight\n$h4-font-weight: var(\n --#{root-defaults.$prefix}h4-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h4-color\n$h4-color: var(--#{root-defaults.$prefix}h4-color, #{$heading-color});\n\n// H5 properties.\n// --graupl-h5-font-size\n$h5-font-size: var(\n --#{root-defaults.$prefix}h5-font-size,\n #{map.get($font-sizes, xl)}\n);\n\n// --graupl-h5-line-height\n$h5-line-height: var(\n --#{root-defaults.$prefix}h5-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h5-margin\n$h5-margin: var(--#{root-defaults.$prefix}h5-margin, #{$heading-margin});\n\n// --graupl-h5-font-family\n$h5-font-family: var(\n --#{root-defaults.$prefix}h5-font-family,\n $heading-font-family\n);\n\n// --graupl-h5-font-weight\n$h5-font-weight: var(\n --#{root-defaults.$prefix}h5-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h5-color\n$h5-color: var(--#{root-defaults.$prefix}h5-color, #{$heading-color});\n\n// H6 properties.\n// --graupl-h6-font-size\n$h6-font-size: var(\n --#{root-defaults.$prefix}h6-font-size,\n #{map.get($font-sizes, lg)}\n);\n\n// --graupl-h6-line-height\n$h6-line-height: var(\n --#{root-defaults.$prefix}h6-line-height,\n #{$heading-line-height}\n);\n\n// --graupl-h6-margin\n$h6-margin: var(--#{root-defaults.$prefix}h6-margin, #{$heading-margin});\n\n// --graupl-h6-font-family\n$h6-font-family: var(\n --#{root-defaults.$prefix}h6-font-family,\n $heading-font-family\n);\n\n// --graupl-h6-font-weight\n$h6-font-weight: var(\n --#{root-defaults.$prefix}h6-font-weight,\n $heading-font-weight\n);\n\n// --graupl-h6-color\n$h6-color: var(--#{root-defaults.$prefix}h6-color, #{$heading-color});\n"],"names":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
@layer graupl.utilities{.align-content-normal{align-content:normal!important}.align-content-start{align-content:flex-start!important}.align-content-end{align-content:flex-end!important}.align-content-center{align-content:center!important}.align-content-between{align-content:space-between!important}.align-content-around{align-content:space-around!important}.align-content-evenly{align-content:space-evenly!important}.align-content-baseline{align-content:baseline!important}.align-content-stretch{align-content:stretch!important}.align-items-start{align-items:start!important}.align-items-end{align-items:end!important}.align-items-center{align-items:center!important}.align-items-baseline{align-items:baseline!important}.align-items-stretch{align-items:stretch!important}.align-self-auto{align-self:auto!important}.align-self-start{align-self:start!important}.align-self-end{align-self:end!important}.align-self-center{align-self:center!important}.align-self-baseline{align-self:baseline!important}.align-self-stretch{align-self:stretch!important}}
|
|
2
|
-
/*# sourceMappingURL=alignment.css.map */
|
|
2
|
+
/*# sourceMappingURL=alignment.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sourceRoot":null,"mappings":"ACSI,wBCiJA,qDAAA,wDAAA,oDAAA,qDAAA,6DAAA,2DAAA,2DAAA,yDAAA,uDAAA,+CAAA,2CAAA,iDAAA,qDAAA,mDAAA,2CAAA,6CAAA,yCAAA,+CAAA,mDAAA","sources":["dist/css/utilities/alignment.css","var/www/html/packages/core/src/scss/mixins/_layer.scss","var/www/html/packages/core/src/scss/mixins/_utility.scss"],"sourcesContent":["@layer graupl.utilities {\n .align-content-normal {\n align-content: normal !important;\n }\n .align-content-start {\n align-content: flex-start !important;\n }\n .align-content-end {\n align-content: flex-end !important;\n }\n .align-content-center {\n align-content: center !important;\n }\n .align-content-between {\n align-content: space-between !important;\n }\n .align-content-around {\n align-content: space-around !important;\n }\n .align-content-evenly {\n align-content: space-evenly !important;\n }\n .align-content-baseline {\n align-content: baseline !important;\n }\n .align-content-stretch {\n align-content: stretch !important;\n }\n .align-items-start {\n align-items: start !important;\n }\n .align-items-end {\n align-items: end !important;\n }\n .align-items-center {\n align-items: center !important;\n }\n .align-items-baseline {\n align-items: baseline !important;\n }\n .align-items-stretch {\n align-items: stretch !important;\n }\n .align-self-auto {\n align-self: auto !important;\n }\n .align-self-start {\n align-self: start !important;\n }\n .align-self-end {\n align-self: end !important;\n }\n .align-self-center {\n align-self: center !important;\n }\n .align-self-baseline {\n align-self: baseline !important;\n }\n .align-self-stretch {\n align-self: stretch !important;\n }\n}","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n @if root-defaults.$use-layers {\n @layer #{root-defaults.$id}.#{$layer} {\n @content;\n }\n } @else {\n @content;\n }\n}\n","// @graupl/core utility mixins.\n//\n// Mixins to help generate utility classes.\n\n@use \"./screen\";\n@use \"./container\";\n@use \"./state\";\n@use \"./theme\";\n@use \"../functions/important\";\n@use \"../functions/utility\";\n@use \"../defaults\" as root-defaults;\n@use \"sass:string\";\n\n/// Insert a map of properties and values into a utility class.\n///\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {Boolean} $important\n/// A flag to determine if the important flag should be added.\n@mixin _insert($map, $important: null) {\n @each $prop, $value in $map {\n // Do not attempt to insert important values inside of custom properties.\n @if string.slice($prop, 1, 2) != \"--\" {\n #{$prop}: important.insert(#{$value}, $override: $important);\n } @else {\n #{$prop}: #{$value};\n }\n }\n\n // Allow for custom overrides and additional styles.\n @content;\n}\n\n/// Handles wrapping utilities with a conditional state.\n///\n/// @param {?string} $state\n/// The state to wrap.\n@mixin _handle-state($state: null) {\n @if $state {\n @include state.state($state) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional screen.\n///\n/// @param {?string} $screen\n/// The screen to wrap.\n@mixin _handle-screen($screen: null) {\n @if $screen {\n @include screen.up($screen) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional container.\n///\n/// @param {?string} $container\n/// The container to wrap.\n@mixin _handle-container($container: null) {\n @if $container {\n @include container.up($container) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional theme.\n///\n/// @param {?string} $theme\n/// The theme mode to wrap.\n@mixin _handle-theme($theme: null) {\n @if $theme {\n @include theme.theme($theme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Create a utility class with a list of properties and a single value.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {string|List} $property\n/// The property/properties to apply to the selector.\n/// @param {string} $value\n/// The value to apply to the property/properties.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create(\n $selector,\n $property,\n $value,\n $important: null,\n $screen: null,\n $theme: null,\n $state: null,\n $container: null\n) {\n $map: utility.convert-property-values-to-map($property, $value);\n\n @include create-mapped(\n $selector,\n $map,\n $important: $important,\n $screen: $screen,\n $theme: $theme,\n $state: $state,\n $container: $container\n ) {\n @content;\n }\n}\n\n/// Create a utility class with a map of properties and values.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create-mapped(\n $selector,\n $map,\n $important: null,\n $screen: null,\n $theme: null,\n $state: null,\n $container: null\n) {\n @include _handle-theme($theme) {\n #{$selector} {\n @if $screen or $container {\n @if $screen {\n @include _handle-screen($screen) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n\n @if $container {\n @include _handle-container($container) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n } @else {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n }\n}\n"],"names":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer graupl.utilities{.bg-attachment-scroll{background-attachment:scroll!important}.bg-attachment-fixed{background-attachment:fixed!important}.bg-attachment-local{background-attachment:local!important}.bg-clip-border-box{background-clip:border-box!important}.bg-clip-padding-box{background-clip:padding-box!important}.bg-clip-content-box{background-clip:content-box!important}.bg-clip-text{
|
|
2
|
-
/*# sourceMappingURL=background.css.map */
|
|
1
|
+
@layer graupl.utilities{.bg-attachment-scroll{background-attachment:scroll!important}.bg-attachment-fixed{background-attachment:fixed!important}.bg-attachment-local{background-attachment:local!important}.bg-clip-border-box{background-clip:border-box!important}.bg-clip-padding-box{background-clip:padding-box!important}.bg-clip-content-box{background-clip:content-box!important}.bg-clip-text{background-clip:text!important}.bg-clip-border-area{background-clip:border-area!important}.bg-image-none{background-image:none!important}.bg-origin-border-box{background-origin:border-box!important}.bg-origin-padding-box{background-origin:padding-box!important}.bg-origin-content-box{background-origin:content-box!important}.bg-position-top{background-position:top!important}.bg-position-right{background-position:100%!important}.bg-position-bottom{background-position:bottom!important}.bg-position-left{background-position:0!important}.bg-position-center{background-position:50%!important}.bg-repeat-repeat{background-repeat:repeat!important}.bg-repeat-repeat-x{background-repeat:repeat-x!important}.bg-repeat-repeat-y{background-repeat:repeat-y!important}.bg-repeat-space{background-repeat:space!important}.bg-repeat-round{background-repeat:round!important}.bg-repeat-no-repeat{background-repeat:no-repeat!important}.bg-size-auto{background-size:auto!important}.bg-size-cover{background-size:cover!important}.bg-size-contain{background-size:contain!important}}
|
|
2
|
+
/*# sourceMappingURL=background.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sourceRoot":null,"mappings":"ACSI,wBCiJA,6DAAA,2DAAA,2DAAA,yDAAA,2DAAA,2DAAA,6CAAA,2DAAA,+CAAA,6DAAA,+DAAA,+DAAA,mDAAA,sDAAA,yDAAA,kDAAA,sDAAA,qDAAA,yDAAA,yDAAA,mDAAA,mDAAA,2DAAA,6CAAA,+CAAA","sources":["dist/css/utilities/background.css","var/www/html/packages/core/src/scss/mixins/_layer.scss","var/www/html/packages/core/src/scss/mixins/_utility.scss"],"sourcesContent":["@layer graupl.utilities {\n .bg-attachment-scroll {\n background-attachment: scroll !important;\n }\n .bg-attachment-fixed {\n background-attachment: fixed !important;\n }\n .bg-attachment-local {\n background-attachment: local !important;\n }\n .bg-clip-border-box {\n background-clip: border-box !important;\n }\n .bg-clip-padding-box {\n background-clip: padding-box !important;\n }\n .bg-clip-content-box {\n background-clip: content-box !important;\n }\n .bg-clip-text {\n background-clip: text !important;\n }\n .bg-clip-border-area {\n background-clip: border-area !important;\n }\n .bg-image-none {\n background-image: none !important;\n }\n .bg-origin-border-box {\n background-origin: border-box !important;\n }\n .bg-origin-padding-box {\n background-origin: padding-box !important;\n }\n .bg-origin-content-box {\n background-origin: content-box !important;\n }\n .bg-position-top {\n background-position: top !important;\n }\n .bg-position-right {\n background-position: right !important;\n }\n .bg-position-bottom {\n background-position: bottom !important;\n }\n .bg-position-left {\n background-position: left !important;\n }\n .bg-position-center {\n background-position: center !important;\n }\n .bg-repeat-repeat {\n background-repeat: repeat !important;\n }\n .bg-repeat-repeat-x {\n background-repeat: repeat-x !important;\n }\n .bg-repeat-repeat-y {\n background-repeat: repeat-y !important;\n }\n .bg-repeat-space {\n background-repeat: space !important;\n }\n .bg-repeat-round {\n background-repeat: round !important;\n }\n .bg-repeat-no-repeat {\n background-repeat: no-repeat !important;\n }\n .bg-size-auto {\n background-size: auto !important;\n }\n .bg-size-cover {\n background-size: cover !important;\n }\n .bg-size-contain {\n background-size: contain !important;\n }\n}","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n @if root-defaults.$use-layers {\n @layer #{root-defaults.$id}.#{$layer} {\n @content;\n }\n } @else {\n @content;\n }\n}\n","// @graupl/core utility mixins.\n//\n// Mixins to help generate utility classes.\n\n@use \"./screen\";\n@use \"./container\";\n@use \"./state\";\n@use \"./theme\";\n@use \"../functions/important\";\n@use \"../functions/utility\";\n@use \"../defaults\" as root-defaults;\n@use \"sass:string\";\n\n/// Insert a map of properties and values into a utility class.\n///\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {Boolean} $important\n/// A flag to determine if the important flag should be added.\n@mixin _insert($map, $important: null) {\n @each $prop, $value in $map {\n // Do not attempt to insert important values inside of custom properties.\n @if string.slice($prop, 1, 2) != \"--\" {\n #{$prop}: important.insert(#{$value}, $override: $important);\n } @else {\n #{$prop}: #{$value};\n }\n }\n\n // Allow for custom overrides and additional styles.\n @content;\n}\n\n/// Handles wrapping utilities with a conditional state.\n///\n/// @param {?string} $state\n/// The state to wrap.\n@mixin _handle-state($state: null) {\n @if $state {\n @include state.state($state) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional screen.\n///\n/// @param {?string} $screen\n/// The screen to wrap.\n@mixin _handle-screen($screen: null) {\n @if $screen {\n @include screen.up($screen) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional container.\n///\n/// @param {?string} $container\n/// The container to wrap.\n@mixin _handle-container($container: null) {\n @if $container {\n @include container.up($container) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional theme.\n///\n/// @param {?string} $theme\n/// The theme mode to wrap.\n@mixin _handle-theme($theme: null) {\n @if $theme {\n @include theme.theme($theme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Create a utility class with a list of properties and a single value.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {string|List} $property\n/// The property/properties to apply to the selector.\n/// @param {string} $value\n/// The value to apply to the property/properties.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create(\n $selector,\n $property,\n $value,\n $important: null,\n $screen: null,\n $theme: null,\n $state: null,\n $container: null\n) {\n $map: utility.convert-property-values-to-map($property, $value);\n\n @include create-mapped(\n $selector,\n $map,\n $important: $important,\n $screen: $screen,\n $theme: $theme,\n $state: $state,\n $container: $container\n ) {\n @content;\n }\n}\n\n/// Create a utility class with a map of properties and values.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create-mapped(\n $selector,\n $map,\n $important: null,\n $screen: null,\n $theme: null,\n $state: null,\n $container: null\n) {\n @include _handle-theme($theme) {\n #{$selector} {\n @if $screen or $container {\n @if $screen {\n @include _handle-screen($screen) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n\n @if $container {\n @include _handle-container($container) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n } @else {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n }\n}\n"],"names":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@layer graupl.utilities{.bordered{border-
|
|
2
|
-
/*# sourceMappingURL=border.css.map */
|
|
1
|
+
@layer graupl.utilities{.bordered{border-width:var(--graupl-border-top-width,var(--graupl-border-width,.125rem))var(--graupl-border-right-width,var(--graupl-border-width,.125rem))var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem))var(--graupl-border-left-width,var(--graupl-border-width,.125rem))!important;border-radius:var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem))var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem))var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem))var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))!important;border-style:var(--graupl-border-top-style,var(--graupl-border-style,solid))var(--graupl-border-right-style,var(--graupl-border-style,solid))var(--graupl-border-bottom-style,var(--graupl-border-style,solid))var(--graupl-border-left-style,var(--graupl-border-style,solid))!important}table.bordered{border-width:var(--graupl-table-border-width,var(--graupl-table-border-top-width,var(--graupl-border-top-width,var(--graupl-border-width,.125rem)))var(--graupl-table-border-right-width,var(--graupl-border-right-width,var(--graupl-border-width,.125rem)))var(--graupl-table-border-bottom-width,var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem)))var(--graupl-table-border-left-width,var(--graupl-border-left-width,var(--graupl-border-width,.125rem))))!important;border-radius:var(--graupl-table-border-radius,var(--graupl-table-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem)))var(--graupl-table-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-table-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-table-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))))!important;border-style:var(--graupl-table-border-style,var(--graupl-table-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid)))var(--graupl-table-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid)))var(--graupl-table-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid)))var(--graupl-table-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid))))!important}.border-thick{border-width:thick!important}.border-thin{border-width:thin!important}.border-medium{border-width:medium!important}.border-none{border-width:none!important}.border-solid{border-style:solid!important}.border-dashed{border-style:dashed!important}.border-dotted{border-style:dotted!important}.border-double{border-style:double!important}.border-groove{border-style:groove!important}.border-ridge{border-style:ridge!important}.border-inset{border-style:inset!important}.border-outset{border-style:outset!important}.border-none{border-style:none!important}.border-transparent{border-color:#0000!important}.border-primary{border-color:var(--graupl-theme-active--primary,var(--graupl-theme--light--primary,var(--graupl-primary,#2063df)))!important}.border-primary-100{border-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))!important}.border-primary-200{border-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))!important}.border-primary-300{border-color:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)))!important}.border-primary-400{border-color:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)))!important}.border-primary-500{border-color:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)))!important}.border-primary-600{border-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)))!important}.border-primary-700{border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))!important}.border-primary-800{border-color:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)))!important}.border-primary-900{border-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))!important}.border-secondary{border-color:var(--graupl-theme-active--secondary,var(--graupl-theme--light--secondary,var(--graupl-secondary,#6c7093)))!important}.border-secondary-100{border-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)))!important}.border-secondary-200{border-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))!important}.border-secondary-300{border-color:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)))!important}.border-secondary-400{border-color:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))!important}.border-secondary-500{border-color:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)))!important}.border-secondary-600{border-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)))!important}.border-secondary-700{border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))!important}.border-secondary-800{border-color:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)))!important}.border-secondary-900{border-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)))!important}.border-tertiary{border-color:var(--graupl-theme-active--tertiary,var(--graupl-theme--light--tertiary,var(--graupl-tertiary,#c36)))!important}.border-tertiary-100{border-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)))!important}.border-tertiary-200{border-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))!important}.border-tertiary-300{border-color:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)))!important}.border-tertiary-400{border-color:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)))!important}.border-tertiary-500{border-color:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)))!important}.border-tertiary-600{border-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)))!important}.border-tertiary-700{border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))!important}.border-tertiary-800{border-color:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)))!important}.border-tertiary-900{border-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)))!important}}
|
|
2
|
+
/*# sourceMappingURL=border.css.map */
|