|
1 | | -@use "sass:math"; |
2 | 1 | @import "headline.variables"; |
3 | 2 |
|
4 | 3 | .elm-headline { |
|
24 | 23 | } |
25 | 24 | } |
26 | 25 | } |
27 | | - |
28 | | -h1, |
29 | | -h2, |
30 | | -h3 { |
31 | | - &.elm-headline { |
32 | | - font-family: $db-font-family-headline; |
33 | | - font-weight: 900; |
34 | | - } |
35 | | -} |
36 | | - |
37 | | -h1 { |
38 | | - &.elm-headline { |
39 | | - font-size: to-rem( |
40 | | - $pxValue: $rea-main-h1-font-size |
41 | | - ); // * TODO: possibly rework variable naming |
42 | | - line-height: math.div(40, $rea-main-h1-font-size); |
43 | | - @media screen and (max-width: 767px) { |
44 | | - font-size: to-rem( |
45 | | - $pxValue: $rea-main-h1-font-size-small |
46 | | - ); // * TODO: possibly rework variable naming |
47 | | - line-height: 1.14; |
48 | | - } |
49 | | - } |
50 | | -} |
51 | | - |
52 | | -h2 { |
53 | | - &.elm-headline { |
54 | | - font-size: to-rem( |
55 | | - $pxValue: $rea-main-h2-font-size |
56 | | - ); // * TODO: possibly rework variable naming |
57 | | - line-height: math.div(28, $rea-main-h2-font-size); |
58 | | - @media screen and (max-width: 767px) { |
59 | | - font-size: to-rem( |
60 | | - $pxValue: $rea-main-h2-font-size-small |
61 | | - ); // * TODO: possibly rework variable naming |
62 | | - line-height: 1.2; |
63 | | - } |
64 | | - } |
65 | | -} |
66 | | - |
67 | | -h3 { |
68 | | - &.elm-headline { |
69 | | - font-size: to-rem( |
70 | | - $pxValue: $rea-main-h3-font-size |
71 | | - ); // * TODO: possibly rework variable naming |
72 | | - line-height: math.div(24, $rea-main-h3-font-size); |
73 | | - @media screen and (max-width: 767px) { |
74 | | - font-size: to-rem( |
75 | | - $pxValue: $rea-main-h3-font-size-small |
76 | | - ); // * TODO: possibly rework variable naming |
77 | | - line-height: 1.33; |
78 | | - } |
79 | | - } |
80 | | -} |
81 | | - |
82 | | -h4 { |
83 | | - &.elm-headline { |
84 | | - font-size: to-rem( |
85 | | - $pxValue: $rea-main-h4-font-size |
86 | | - ); // * TODO: possibly rework variable naming |
87 | | - font-weight: 400; |
88 | | - line-height: math.div(24, $rea-main-h4-font-size); |
89 | | - @media screen and (max-width: 767px) { |
90 | | - font-size: to-rem( |
91 | | - $pxValue: $rea-main-h4-font-size-small |
92 | | - ); // * TODO: possibly rework variable naming |
93 | | - line-height: 1.25; |
94 | | - } |
95 | | - } |
96 | | -} |
0 commit comments