]> git.ipfire.org Git - people/shoehn/ipfire.org.git/blame - static/scss/_fonts.scss
change the icon, the button style and text on the donation page
[people/shoehn/ipfire.org.git] / static / scss / _fonts.scss
CommitLineData
d325ca78
SH
1body {
2 -webkit-font-smoothing: antialiased;
3 font-size: 16px;
4}
5
6h1 {
7 line-height: 3rem;
8}
9
10h2 {
11 line-height: 2.75rem;
12}
13
14h3 {
15 font-size: 20px;
16 line-height: 28px;
17 @include media-breakpoint-up(md) {
18 font-size: 24px;
19 line-height: 32px;
20 font-weight: 300;
21 margin-bottom: 0;
22 }
23 &.headline {
24 text-align: center;
25 font-size: 32px;
26 line-height: 44px;
27 color: $blue-grey-900;
28 @include media-breakpoint-up(sm) {
29 font-size: 36px;
30 line-height: 48px;
31 }
32 }
33}
34
35h4 {
36 font-weight: 500;
37 font-size: 16px;
38 line-height: 24px;
39 @include media-breakpoint-up(sm) {
40 font-size: 20px;
41 line-height: 28px;
42 }
43 &.secondHeadline {
44 font-size: 24px;
45 line-height: 32px;
46 text-align: left;
47 margin-top: 24px;
48 }
49}
50
51h5,
52.h5 {
53 font-size: 16px;
54 line-height: 24px;
55 @include media-breakpoint-up(md) {
56 font-size: 24px;
57 line-height: 32px;
58 }
59 &.subheadline {
60 text-align: center;
61 font-size: 16px;
62 line-height: 24px;
63 color: $blue-grey-600;
64 }
65}
66
67p {
68 font-size: 16px;
69 line-height: 24px;
70 &.lead {
71 font-size: inherit;
72 line-height: inherit;
73 @include media-breakpoint-up(md) {
74 font-size: 24px;
75 line-height: 32px;
76 }
77 }
78 &.copy {
79 margin-top: 16px;
80 @include media-breakpoint-up(sm) {
81 margin-top: 24px;
82 }
83 }
84}
85
86.display-1 {
87 font-size: 120px;
88 line-height: 144px;
89}
90
91.display-2 {
92 font-size: 32px;
93 line-height: 44px;
94 margin-bottom: 40px;
95 @include media-breakpoint-up(md) {
96 font-size: 40px;
97 line-height: 56px;
98 margin-bottom: 3rem;
99 }
100}
101
102.display-3 {
103 font-size: 24px;
104 line-height: 32px;
105 @include media-breakpoint-up(md) {
106 font-size: 32px;
107 line-height: 44px;
108 }
109}
110
111.display-4 {
112 font-size: 14px;
113 line-height: 20px;
114 font-weight: 400;
115 @include media-breakpoint-up(sm) {
116 font-size: 24px;
117 line-height: 32px;;
118 }
119}
120
121.display-5 {
122 font-size: 20px;
123 line-height: 28px;
124}
125
126small,
127.small {
128 font-size: 14px;
129 line-height: 20px;
130 @include media-breakpoint-up(md) {
131 font-size: 16px;
132 line-height: 24px;
133 }
134}
135
136.truncate {
137 width: 100%;
138 white-space: nowrap;
139 overflow: hidden;
140 text-overflow: ellipsis;
141}
142
143
144// fireInfo
145.fireinfo_cat {
146 font-size: 14px;
147 line-height: 20px;
148}
149
150h5.fireinfo {
151 font-size: 16px;
152 line-height: 28px;
153 font-weight: 500;
154 @include media-breakpoint-up(md) {
155 font-size: 20px;
156 }
157}
158
159.fireinfo_per {
160 font-size: 20px;
161 line-height: 28px;
162}