liquid_feedback_frontend
view style/mdl/typography/_typography.scss @ 1676:8fde003bdeb0
Added support for alternative DN string
| author | bsw |
|---|---|
| date | Mon Jun 07 20:58:31 2021 +0200 (2021-06-07) |
| parents | 32cc544d5a5b |
| children |
line source
1 /**
2 * Copyright 2015 Google Inc. All Rights Reserved.
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 * http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 */
17 @import "../variables";
18 @import "../mixins";
20 @if $target-elements-directly == true {
21 html, body {
22 font-family: $performance_font;
23 font-size: 14px;
24 font-weight: 400;
25 line-height: 20px;
26 }
28 h1, h2, h3, h4, h5, h6, p {
29 margin: 0;
30 padding: 0;
31 }
33 /**
34 * Styles for HTML elements
35 */
37 h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
38 @include typo-display-3($colorContrast: true);
40 font-size: 0.6em;
41 }
43 h1 {
44 @include typo-display-3;
46 margin-top: 24px;
47 margin-bottom: 24px;
48 }
50 h2 {
51 @include typo-display-2;
53 margin-top: 24px;
54 margin-bottom: 24px;
55 }
57 h3 {
58 @include typo-display-1;
60 margin-top: 24px;
61 margin-bottom: 24px;
62 }
64 h4 {
65 @include typo-headline;
67 margin-top: 24px;
68 margin-bottom: 16px;
69 }
71 h5 {
72 @include typo-title;
74 margin-top: 24px;
75 margin-bottom: 16px;
76 }
78 h6 {
79 @include typo-subhead;
81 margin-top: 24px;
82 margin-bottom: 16px;
83 }
85 p {
86 @include typo-body-1;
88 margin-bottom: 16px;
89 }
91 a {
92 color: $text-link-color;
93 font-weight: 500;
94 }
96 blockquote {
97 @include typo-blockquote;
98 }
100 mark {
101 background-color: #f4ff81;
102 }
104 dt {
105 font-weight: 700;
106 }
108 address {
109 @include typo-caption;
111 font-style: normal;
112 }
114 ul, ol {
115 @include typo-body-1;
116 }
117 }
119 /**
120 * Class Name Styles
121 */
123 .mdl-typography--display-4 {
124 @include typo-display-4;
125 }
127 .mdl-typography--display-4-color-contrast {
128 @include typo-display-4($colorContrast: true);
129 }
131 .mdl-typography--display-3 {
132 @include typo-display-3;
133 }
135 .mdl-typography--display-3-color-contrast {
136 @include typo-display-3($colorContrast: true);
137 }
139 .mdl-typography--display-2 {
140 @include typo-display-2;
141 }
143 .mdl-typography--display-2-color-contrast {
144 @include typo-display-2($colorContrast: true);
145 }
147 .mdl-typography--display-1 {
148 @include typo-display-1;
149 }
151 .mdl-typography--display-1-color-contrast {
152 @include typo-display-1($colorContrast: true);
153 }
155 .mdl-typography--headline {
156 @include typo-headline;
157 }
159 .mdl-typography--headline-color-contrast {
160 @include typo-headline($colorContrast: true);
161 }
163 .mdl-typography--title {
164 @include typo-title;
165 }
167 .mdl-typography--title-color-contrast {
168 @include typo-title($colorContrast: true);
169 }
171 .mdl-typography--subhead {
172 @include typo-subhead;
173 }
175 .mdl-typography--subhead-color-contrast {
176 @include typo-subhead($colorContrast: true);
177 }
179 .mdl-typography--body-2 {
180 @include typo-body-2;
181 }
183 .mdl-typography--body-2-color-contrast {
184 @include typo-body-2($colorContrast: true);
185 }
187 .mdl-typography--body-1 {
188 @include typo-body-1;
189 }
191 .mdl-typography--body-1-color-contrast {
192 @include typo-body-1($colorContrast: true);
193 }
195 .mdl-typography--body-2-force-preferred-font {
196 @include typo-body-2($usePreferred: true);
197 }
199 .mdl-typography--body-2-force-preferred-font-color-contrast {
200 @include typo-body-2($colorContrast: true, $usePreferred: true);
201 }
203 .mdl-typography--body-1-force-preferred-font {
204 @include typo-body-1($usePreferred: true);
205 }
207 .mdl-typography--body-1-force-preferred-font-color-contrast {
208 @include typo-body-1($colorContrast: true, $usePreferred: true);
209 }
211 .mdl-typography--caption {
212 @include typo-caption;
213 }
215 .mdl-typography--caption-force-preferred-font {
216 @include typo-caption($usePreferred: true);
217 }
219 .mdl-typography--caption-color-contrast {
220 @include typo-caption($colorContrast: true);
221 }
223 .mdl-typography--caption-force-preferred-font-color-contrast {
224 @include typo-caption($colorContrast: true, $usePreferred: true);
225 }
227 .mdl-typography--menu {
228 @include typo-menu;
229 }
231 .mdl-typography--menu-color-contrast {
232 @include typo-menu($colorContrast: true);
233 }
235 .mdl-typography--button {
236 @include typo-button;
237 }
239 .mdl-typography--button-color-contrast {
240 @include typo-button($colorContrast: true);
241 }
243 .mdl-typography--text-left {
244 text-align: left;
245 }
247 .mdl-typography--text-right {
248 text-align: right;
249 }
251 .mdl-typography--text-center {
252 text-align: center;
253 }
255 .mdl-typography--text-justify {
256 text-align: justify;
257 }
259 .mdl-typography--text-nowrap {
260 white-space: nowrap;
261 }
263 .mdl-typography--text-lowercase {
264 text-transform: lowercase;
265 }
267 .mdl-typography--text-uppercase {
268 text-transform: uppercase;
269 }
271 .mdl-typography--text-capitalize {
272 text-transform: capitalize;
273 }
275 .mdl-typography--font-thin {
276 font-weight: 200 !important;
277 }
279 .mdl-typography--font-light {
280 font-weight: 300 !important;
281 }
283 .mdl-typography--font-regular {
284 font-weight: 400 !important;
285 }
287 .mdl-typography--font-medium {
288 font-weight: 500 !important;
289 }
291 .mdl-typography--font-bold {
292 font-weight: 700 !important;
293 }
295 .mdl-typography--font-black {
296 font-weight: 900 !important;
297 }
299 .material-icons {
300 @include typo-icon;
301 }