diff options
author | Volpeon <git@volpeon.ink> | 2024-10-17 16:45:00 +0200 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2024-10-17 16:45:00 +0200 |
commit | 50f6acc739f24bfa2ca080d08e90d82f8fa83543 (patch) | |
tree | 404dbe97d34b7e4fc3293c8e6a8c92d9941ac51e /src/scopes/_headings.scss | |
parent | Colors (diff) | |
download | iro-design-50f6acc739f24bfa2ca080d08e90d82f8fa83543.tar.gz iro-design-50f6acc739f24bfa2ca080d08e90d82f8fa83543.tar.bz2 iro-design-50f6acc739f24bfa2ca080d08e90d82f8fa83543.zip |
Revamped variable management
Diffstat (limited to 'src/scopes/_headings.scss')
-rw-r--r-- | src/scopes/_headings.scss | 116 |
1 files changed, 0 insertions, 116 deletions
diff --git a/src/scopes/_headings.scss b/src/scopes/_headings.scss deleted file mode 100644 index 9593792..0000000 --- a/src/scopes/_headings.scss +++ /dev/null | |||
@@ -1,116 +0,0 @@ | |||
1 | @use 'iro-sass/src/index' as iro; | ||
2 | @use '../functions' as fn; | ||
3 | @use '../mixins' as mx; | ||
4 | @use 'include-media/dist/include-media' as media; | ||
5 | |||
6 | @include iro.props-namespace('headings') { | ||
7 | @include iro.bem-scope(iro.props-namespace()) { | ||
8 | h1, | ||
9 | h2, | ||
10 | h3, | ||
11 | h4, | ||
12 | h5, | ||
13 | h6 { | ||
14 | @include mx.set-font(--headline); | ||
15 | |||
16 | display: block; | ||
17 | transform: translateX(-.06em); | ||
18 | letter-spacing: normal; | ||
19 | text-transform: none; | ||
20 | } | ||
21 | |||
22 | |||
23 | h1 { | ||
24 | @include mx.heading-strong(--xxl); | ||
25 | } | ||
26 | |||
27 | h2 { | ||
28 | @include mx.heading-strong(--xl); | ||
29 | } | ||
30 | |||
31 | h3 { | ||
32 | @include mx.heading-medium(--lg); | ||
33 | } | ||
34 | |||
35 | h4 { | ||
36 | @include mx.heading-medium(--md); | ||
37 | } | ||
38 | |||
39 | h5 { | ||
40 | @include mx.heading-faint(--sm); | ||
41 | } | ||
42 | |||
43 | h6 { | ||
44 | @include mx.heading-faint(--xs); | ||
45 | } | ||
46 | |||
47 | @include iro.bem-elem('highlight') { | ||
48 | background-image: linear-gradient( | ||
49 | to top, | ||
50 | transparent .15em, | ||
51 | fn.foreign-color(--heading, --bg) .15em, | ||
52 | fn.foreign-color(--heading, --bg) .6em, | ||
53 | transparent .6em | ||
54 | ); | ||
55 | } | ||
56 | |||
57 | @include iro.bem-modifier('display') { | ||
58 | h1, | ||
59 | h2, | ||
60 | h3, | ||
61 | h4, | ||
62 | h5, | ||
63 | h6 { | ||
64 | @include mx.set-font(--headline); | ||
65 | } | ||
66 | |||
67 | h1 { | ||
68 | @include mx.heading-strong(--display --xxl); | ||
69 | |||
70 | @include media.media('<=md') { | ||
71 | @include mx.heading-strong(--display-sm --xxl); | ||
72 | } | ||
73 | } | ||
74 | |||
75 | h2 { | ||
76 | @include mx.heading-strong(--display --xl); | ||
77 | |||
78 | @include media.media('<=md') { | ||
79 | @include mx.heading-strong(--display-sm --xl); | ||
80 | } | ||
81 | } | ||
82 | |||
83 | h3 { | ||
84 | @include mx.heading-strong(--display --lg); | ||
85 | |||
86 | @include media.media('<=md') { | ||
87 | @include mx.heading-strong(--display-sm --lg); | ||
88 | } | ||
89 | } | ||
90 | |||
91 | h4 { | ||
92 | @include mx.heading-strong(--display --md); | ||
93 | |||
94 | @include media.media('<=md') { | ||
95 | @include mx.heading-strong(--display-sm --md); | ||
96 | } | ||
97 | } | ||
98 | |||
99 | h5 { | ||
100 | @include mx.heading-medium(--display --sm); | ||
101 | |||
102 | @include media.media('<=md') { | ||
103 | @include mx.heading-medium(--display-sm --sm); | ||
104 | } | ||
105 | } | ||
106 | |||
107 | h6 { | ||
108 | @include mx.heading-faint(--display --xs); | ||
109 | |||
110 | @include media.media('<=md') { | ||
111 | @include mx.heading-faint(--display-sm --xs); | ||
112 | } | ||
113 | } | ||
114 | } | ||
115 | } | ||
116 | } | ||