summaryrefslogtreecommitdiffstats
path: root/src/scopes/_code.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/scopes/_code.scss')
-rw-r--r--src/scopes/_code.scss59
1 files changed, 59 insertions, 0 deletions
diff --git a/src/scopes/_code.scss b/src/scopes/_code.scss
new file mode 100644
index 0000000..a6905a3
--- /dev/null
+++ b/src/scopes/_code.scss
@@ -0,0 +1,59 @@
1@use 'iro-sass/src/index' as iro;
2@use '../functions' as fn;
3
4@include iro.props-namespace('code') {
5 @include iro.props-store((
6 --dims: (
7 --inline: (
8 --pad-i: fn.global-dim(--size --50),
9 --pad-b: fn.global-dim(--size --10),
10 --rounding: fn.global-dim(--rounding),
11 ),
12 --block: (
13 --pad-i: fn.global-dim(--size --150),
14 --pad-b: fn.global-dim(--size --85),
15 --margin-bs: fn.global-dim(--paragraph --margin-bs),
16 --rounding: fn.global-dim(--rounding),
17 )
18 ),
19 --colors: (
20 --inline: (
21 --fg: fn.global-color(--red --1100),
22 --bg: fn.global-color(--red --200),
23 ),
24 --block: (
25 --fg: fn.global-color(--text),
26 --bg: fn.global-color(--bg-l2),
27 )
28 )
29 ));
30
31 @include iro.bem-scope(iro.props-namespace()) {
32 code {
33 padding-block: fn.dim(--inline --pad-b);
34 padding-inline: fn.dim(--inline --pad-i);
35 border-radius: fn.dim(--inline --rounding);
36 background-color: fn.color(--inline --bg);
37 color: fn.color(--inline --fg);
38 }
39
40 pre {
41 margin-block: fn.dim(--block --margin-bs) 0;
42 margin-inline: 0;
43 padding-block: fn.dim(--block --pad-b);
44 padding-inline: fn.dim(--block --pad-i);
45 border-radius: fn.dim(--block --rounding);
46 background-color: fn.color(--block --bg);
47 color: fn.color(--block --fg);
48
49 code {
50 display: inline-block;
51 margin-inline-end: fn.dim(--block --pad-i);
52 padding: 0;
53 border-radius: 0;
54 background-color: transparent;
55 color: currentColor;
56 }
57 }
58 }
59}