summaryrefslogtreecommitdiffstats
path: root/src/scopes/_lists.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/scopes/_lists.scss')
-rw-r--r--src/scopes/_lists.scss66
1 files changed, 66 insertions, 0 deletions
diff --git a/src/scopes/_lists.scss b/src/scopes/_lists.scss
new file mode 100644
index 0000000..bad9731
--- /dev/null
+++ b/src/scopes/_lists.scss
@@ -0,0 +1,66 @@
1@use 'iro-sass/src/index' as iro;
2@use '../functions' as fn;
3
4@include iro.props-namespace('lists') {
5 @include iro.props-store((
6 --dims: (
7 --indent: calc(fn.global-dim(--list --indent) + 1em),
8 --margin-bs: fn.global-dim(--paragraph --margin-bs),
9
10 --compact: (
11 --indent: fn.global-dim(--list --compact-indent),
12 ),
13 ),
14 --colors: (
15 --border: fn.global-color(--border-mute),
16 )
17 ));
18
19 @include iro.bem-scope(iro.props-namespace()) {
20 ul,
21 ol {
22 margin-block-start: fn.dim(--margin-bs);
23 padding-inline-start: fn.dim(--indent);
24
25 ul,
26 ol {
27 margin-block-start: 0;
28 }
29 }
30
31 ul {
32 list-style: disc;
33 }
34
35 ol {
36 list-style: decimal;
37 }
38
39 dl {
40 margin-block: fn.dim(--margin-bs) 0;
41 margin-inline: 0;
42 padding: 0;
43 }
44
45 dt {
46 color: fn.global-color(--heading);
47 font-weight: bold;
48 }
49
50 dd {
51 margin-block: 0;
52 margin-inline: fn.dim(--indent) 0;
53 }
54
55 @include iro.bem-modifier('compact') {
56 ul,
57 ol {
58 padding-inline-start: calc(fn.dim(--compact --indent) - 3px);
59 }
60
61 dd {
62 margin-inline-start: calc(fn.dim(--compact --indent) - 3px);
63 }
64 }
65 }
66}