summaryrefslogtreecommitdiffstats
path: root/src/objects/_side-nav.vars.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
committerVolpeon <git@volpeon.ink>2026-07-22 12:27:09 +0200
commitcc5329a5f4d3ea91cac93bc7f9b8f943b7ced226 (patch)
treed16dea8f0a5edca2b610ecabeac5e93a4d98be2f /src/objects/_side-nav.vars.scss
parentUpdate _index.scss (diff)
downloadiro-design-master.tar.gz
iro-design-master.tar.bz2
iro-design-master.zip
Diffstat (limited to 'src/objects/_side-nav.vars.scss')
-rw-r--r--src/objects/_side-nav.vars.scss84
1 files changed, 64 insertions, 20 deletions
diff --git a/src/objects/_side-nav.vars.scss b/src/objects/_side-nav.vars.scss
index d6a7de1..8abb0df 100644
--- a/src/objects/_side-nav.vars.scss
+++ b/src/objects/_side-nav.vars.scss
@@ -1,28 +1,72 @@
1@use 'sass:map'; 1@use "sass:map";
2@use 'pkg:iro-sass/src/props'; 2@use "pkg:iro-sass/props";
3@use '../core.vars' as core; 3@use "../core.vars" as core;
4 4
5$spacing: props.def(--o-side-nav--spacing, props.get(core.$size--50)) !default; 5$spacing: props.def(--o-side-nav--spacing, props.get(core.$size--50)) !default;
6$header--font-size: props.def(--o-side-nav--header--font-size, props.get(core.$font-size--50)) !default; 6$header--font-size: props.def(
7$separator: props.def(--o-side-nav--separator, props.get(core.$size--200)) !default; 7 --o-side-nav--header--font-size,
8 props.get(core.$font-size--50)
9) !default;
10$separator: props.def(--o-side-nav--separator, props.get(core.$size--200)) !default;
8 11
9$item--pad-i: props.def(--o-side-nav--item--pad-i, props.get(core.$size--150)) !default; 12$item--pad-i: props.def(--o-side-nav--item--pad-i, props.get(core.$size--150)) !default;
10$item--pad-b: props.def(--o-side-nav--item--pad-b, props.get(core.$size--75)) !default; 13$item--pad-b: props.def(--o-side-nav--item--pad-b, props.get(core.$size--75)) !default;
11$item--rounding: props.def(--o-side-nav--item--rounding, props.get(core.$rounding--sm)) !default; 14$item--rounding: props.def(--o-side-nav--item--rounding, props.get(core.$rounding--sm)) !default;
12 15
13$item--key-focus--border-width: props.def(--o-side-nav--item--key-focus--border-width, props.get(core.$key-focus--border-width)) !default; 16$item--key-focus--border-width: props.def(
14$item--key-focus--border-offset: props.def(--o-side-nav--item--key-focus--border-offset, props.get(core.$key-focus--border-offset)) !default; 17 --o-side-nav--item--key-focus--border-width,
15$item--key-focus--outline-width: props.def(--o-side-nav--item--key-focus--outline-width, props.get(core.$key-focus--outline-width)) !default; 18 props.get(core.$key-focus--border-width)
19) !default;
20$item--key-focus--border-offset: props.def(
21 --o-side-nav--item--key-focus--border-offset,
22 props.get(core.$key-focus--border-offset)
23) !default;
24$item--key-focus--outline-width: props.def(
25 --o-side-nav--item--key-focus--outline-width,
26 props.get(core.$key-focus--outline-width)
27) !default;
16 28
17$header--label-color: props.def(--o-side-nav--header--label-color, props.get(core.$theme, --text-mute-more), 'color') !default; 29$header--label-color: props.def(
30 --o-side-nav--header--label-color,
31 props.get(core.$theme, --text-mute-more),
32 "color"
33) !default;
18 34
19$item--hover--bg-color: props.def(--o-side-nav--item--hover--bg-color, props.get(core.$theme, --border-mute), 'color') !default; 35$item--hover--bg-color: props.def(
20$item--hover--label-color: props.def(--o-side-nav--item--hover--label-color, props.get(core.$theme, --heading), 'color') !default; 36 --o-side-nav--item--hover--bg-color,
37 props.get(core.$theme, --border-mute),
38 "color"
39) !default;
40$item--hover--label-color: props.def(
41 --o-side-nav--item--hover--label-color,
42 props.get(core.$theme, --heading),
43 "color"
44) !default;
21 45
22$item--active--bg-color: props.def(--o-side-nav--item--active--bg-color, props.get(core.$theme, --border), 'color') !default; 46$item--active--bg-color: props.def(
23$item--active--label-color: props.def(--o-side-nav--item--active--label-color, props.get(core.$theme, --heading), 'color') !default; 47 --o-side-nav--item--active--bg-color,
48 props.get(core.$theme, --border),
49 "color"
50) !default;
51$item--active--label-color: props.def(
52 --o-side-nav--item--active--label-color,
53 props.get(core.$theme, --heading),
54 "color"
55) !default;
24 56
25$item--disabled--label-color: props.def(--o-side-nav--item--disabled--label-color, props.get(core.$theme, --text-disabled), 'color') !default; 57$item--disabled--label-color: props.def(
58 --o-side-nav--item--disabled--label-color,
59 props.get(core.$theme, --text-disabled),
60 "color"
61) !default;
26 62
27$item--key-focus--border-color: props.def(--o-side-nav--item--key-focus--border-color, props.get(core.$theme, --focus, --border), 'color') !default; 63$item--key-focus--border-color: props.def(
28$item--key-focus--outline-color: props.def(--o-side-nav--item--key-focus--outline-color, props.get(core.$theme, --focus, --outline), 'color') !default; 64 --o-side-nav--item--key-focus--border-color,
65 props.get(core.$theme, --focus, --border),
66 "color"
67) !default;
68$item--key-focus--outline-color: props.def(
69 --o-side-nav--item--key-focus--outline-color,
70 props.get(core.$theme, --focus, --outline),
71 "color"
72) !default;