summaryrefslogtreecommitdiffstats
path: root/src/scopes/_headings.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/scopes/_headings.scss')
-rw-r--r--src/scopes/_headings.scss116
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}