1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 | $base-body-background: $global-background !default;
|
15 | $base-body-font-family: $global-font-family !default;
|
16 | $base-body-font-weight: normal !default;
|
17 | $base-body-font-size: $global-font-size !default;
|
18 | $base-body-line-height: $global-line-height !default;
|
19 | $base-body-color: $global-color !default;
|
20 |
|
21 | $base-link-color: $global-link-color !default;
|
22 | $base-link-text-decoration: none !default;
|
23 | $base-link-hover-color: $global-link-hover-color !default;
|
24 | $base-link-hover-text-decoration: underline !default;
|
25 |
|
26 | $base-strong-font-weight: bolder !default;
|
27 | $base-code-font-size: $global-small-font-size !default;
|
28 | $base-code-font-family: Consolas, monaco, monospace !default;
|
29 | $base-code-color: $global-danger-background !default;
|
30 | $base-em-color: $global-danger-background !default;
|
31 | $base-ins-background: #ffd !default;
|
32 | $base-ins-color: $global-color !default;
|
33 | $base-mark-background: #ffd !default;
|
34 | $base-mark-color: $global-color !default;
|
35 | $base-quote-font-style: italic !default;
|
36 | $base-small-font-size: 80% !default;
|
37 |
|
38 | $base-margin-vertical: $global-margin !default;
|
39 |
|
40 | $base-heading-font-family: $global-font-family !default;
|
41 | $base-heading-font-weight: normal !default;
|
42 | $base-heading-color: $global-emphasis-color !default;
|
43 | $base-heading-text-transform: none !default;
|
44 | $base-heading-margin-top: $global-medium-margin !default;
|
45 | $base-h1-font-size-m: $global-xxlarge-font-size !default;
|
46 | $base-h1-font-size: $base-h1-font-size-m * 0.85 !default;
|
47 | $base-h1-line-height: 1.2 !default;
|
48 | $base-h2-font-size-m: $global-xlarge-font-size !default;
|
49 | $base-h2-font-size: $base-h2-font-size-m * 0.85 !default;
|
50 | $base-h2-line-height: 1.3 !default;
|
51 | $base-h3-font-size: $global-large-font-size !default;
|
52 | $base-h3-line-height: 1.4 !default;
|
53 | $base-h4-font-size: $global-medium-font-size !default;
|
54 | $base-h4-line-height: 1.4 !default;
|
55 | $base-h5-font-size: $global-font-size !default;
|
56 | $base-h5-line-height: 1.4 !default;
|
57 | $base-h6-font-size: $global-small-font-size !default;
|
58 | $base-h6-line-height: 1.4 !default;
|
59 |
|
60 | $base-list-padding-left: 30px !default;
|
61 |
|
62 | $base-hr-margin-vertical: $global-margin !default;
|
63 | $base-hr-border-width: $global-border-width !default;
|
64 | $base-hr-border: $global-border !default;
|
65 |
|
66 | $base-blockquote-font-size: $global-medium-font-size !default;
|
67 | $base-blockquote-line-height: 1.5 !default;
|
68 | $base-blockquote-font-style: italic !default;
|
69 | $base-blockquote-margin-vertical: $global-margin !default;
|
70 | $base-blockquote-footer-margin-top: $global-small-margin !default;
|
71 | $base-blockquote-footer-font-size: $global-small-font-size !default;
|
72 | $base-blockquote-footer-line-height: 1.5 !default;
|
73 |
|
74 | $base-pre-font-size: $global-small-font-size !default;
|
75 | $base-pre-line-height: 1.5 !default;
|
76 | $base-pre-font-family: $base-code-font-family !default;
|
77 | $base-pre-color: $global-color !default;
|
78 |
|
79 | $base-selection-background: #39f !default;
|
80 | $base-selection-color: $global-inverse-color !default;
|
81 |
|
82 |
|
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 |
|
89 |
|
90 |
|
91 |
|
92 |
|
93 |
|
94 | html {
|
95 |
|
96 | font-family: $base-body-font-family;
|
97 | font-size: $base-body-font-size;
|
98 | font-weight: $base-body-font-weight;
|
99 | line-height: $base-body-line-height;
|
100 |
|
101 | -webkit-text-size-adjust: 100%;
|
102 |
|
103 | background: $base-body-background;
|
104 | color: $base-body-color;
|
105 | @if(mixin-exists(hook-base-body)) {@include hook-base-body();}
|
106 | }
|
107 |
|
108 |
|
109 |
|
110 |
|
111 |
|
112 | body { margin: 0; }
|
113 |
|
114 |
|
115 |
|
116 |
|
117 |
|
118 |
|
119 |
|
120 |
|
121 |
|
122 | a:active,
|
123 | a:hover { outline: none; }
|
124 |
|
125 |
|
126 |
|
127 |
|
128 |
|
129 | a,
|
130 | .uk-link {
|
131 | color: $base-link-color;
|
132 | text-decoration: $base-link-text-decoration;
|
133 | cursor: pointer;
|
134 | @if(mixin-exists(hook-base-link)) {@include hook-base-link();}
|
135 | }
|
136 |
|
137 | a:hover,
|
138 | .uk-link:hover,
|
139 | .uk-link-toggle:hover .uk-link,
|
140 | .uk-link-toggle:focus .uk-link {
|
141 | color: $base-link-hover-color;
|
142 | text-decoration: $base-link-hover-text-decoration;
|
143 | @if(mixin-exists(hook-base-link-hover)) {@include hook-base-link-hover();}
|
144 | }
|
145 |
|
146 |
|
147 |
|
148 |
|
149 |
|
150 |
|
151 |
|
152 |
|
153 |
|
154 |
|
155 | abbr[title] {
|
156 |
|
157 | text-decoration: underline dotted;
|
158 |
|
159 | -webkit-text-decoration-style: dotted;
|
160 | }
|
161 |
|
162 |
|
163 |
|
164 |
|
165 |
|
166 | b,
|
167 | strong { font-weight: $base-strong-font-weight; }
|
168 |
|
169 |
|
170 |
|
171 |
|
172 |
|
173 |
|
174 |
|
175 | :not(pre) > code,
|
176 | :not(pre) > kbd,
|
177 | :not(pre) > samp {
|
178 |
|
179 | font-family: $base-code-font-family;
|
180 |
|
181 | font-size: $base-code-font-size;
|
182 |
|
183 | color: $base-code-color;
|
184 | white-space: nowrap;
|
185 | @if(mixin-exists(hook-base-code)) {@include hook-base-code();}
|
186 | }
|
187 |
|
188 |
|
189 |
|
190 |
|
191 |
|
192 | em { color: $base-em-color; }
|
193 |
|
194 |
|
195 |
|
196 |
|
197 |
|
198 | ins {
|
199 | background: $base-ins-background;
|
200 | color: $base-ins-color;
|
201 | text-decoration: none;
|
202 | }
|
203 |
|
204 |
|
205 |
|
206 |
|
207 |
|
208 | mark {
|
209 | background: $base-mark-background;
|
210 | color: $base-mark-color;
|
211 | }
|
212 |
|
213 |
|
214 |
|
215 |
|
216 |
|
217 | q { font-style: $base-quote-font-style; }
|
218 |
|
219 |
|
220 |
|
221 |
|
222 |
|
223 | small { font-size: $base-small-font-size; }
|
224 |
|
225 |
|
226 |
|
227 |
|
228 |
|
229 | sub,
|
230 | sup {
|
231 | font-size: 75%;
|
232 | line-height: 0;
|
233 | position: relative;
|
234 | vertical-align: baseline;
|
235 | }
|
236 |
|
237 | sup { top: -0.5em; }
|
238 | sub { bottom: -0.25em; }
|
239 |
|
240 |
|
241 |
|
242 |
|
243 |
|
244 |
|
245 |
|
246 |
|
247 |
|
248 | audio,
|
249 | canvas,
|
250 | iframe,
|
251 | img,
|
252 | svg,
|
253 | video { vertical-align: middle; }
|
254 |
|
255 |
|
256 |
|
257 |
|
258 |
|
259 |
|
260 |
|
261 |
|
262 | canvas,
|
263 | img,
|
264 | video {
|
265 |
|
266 | max-width: 100%;
|
267 |
|
268 | height: auto;
|
269 |
|
270 | box-sizing: border-box;
|
271 | }
|
272 |
|
273 |
|
274 | @supports (display: block) {
|
275 |
|
276 | svg {
|
277 | max-width: 100%;
|
278 | height: auto;
|
279 | box-sizing: border-box;
|
280 | }
|
281 |
|
282 | }
|
283 |
|
284 |
|
285 |
|
286 |
|
287 |
|
288 | svg:not(:root) { overflow: hidden; }
|
289 |
|
290 |
|
291 |
|
292 |
|
293 |
|
294 |
|
295 |
|
296 | img:not([src]) {
|
297 |
|
298 | min-width: 1px;
|
299 |
|
300 | visibility: hidden;
|
301 | }
|
302 |
|
303 |
|
304 |
|
305 |
|
306 |
|
307 |
|
308 | iframe { border: 0; }
|
309 |
|
310 |
|
311 |
|
312 |
|
313 |
|
314 |
|
315 |
|
316 |
|
317 |
|
318 | p,
|
319 | ul,
|
320 | ol,
|
321 | dl,
|
322 | pre,
|
323 | address,
|
324 | fieldset,
|
325 | figure { margin: 0 0 $base-margin-vertical 0; }
|
326 |
|
327 |
|
328 | * + p,
|
329 | * + ul,
|
330 | * + ol,
|
331 | * + dl,
|
332 | * + pre,
|
333 | * + address,
|
334 | * + fieldset,
|
335 | * + figure { margin-top: $base-margin-vertical; }
|
336 |
|
337 |
|
338 |
|
339 |
|
340 |
|
341 | h1, .uk-h1,
|
342 | h2, .uk-h2,
|
343 | h3, .uk-h3,
|
344 | h4, .uk-h4,
|
345 | h5, .uk-h5,
|
346 | h6, .uk-h6,
|
347 | .uk-heading-small,
|
348 | .uk-heading-medium,
|
349 | .uk-heading-large,
|
350 | .uk-heading-xlarge,
|
351 | .uk-heading-2xlarge {
|
352 | margin: 0 0 $base-margin-vertical 0;
|
353 | font-family: $base-heading-font-family;
|
354 | font-weight: $base-heading-font-weight;
|
355 | color: $base-heading-color;
|
356 | text-transform: $base-heading-text-transform;
|
357 | @if(mixin-exists(hook-base-heading)) {@include hook-base-heading();}
|
358 | }
|
359 |
|
360 |
|
361 | * + h1, * + .uk-h1,
|
362 | * + h2, * + .uk-h2,
|
363 | * + h3, * + .uk-h3,
|
364 | * + h4, * + .uk-h4,
|
365 | * + h5, * + .uk-h5,
|
366 | * + h6, * + .uk-h6,
|
367 | * + .uk-heading-small,
|
368 | * + .uk-heading-medium,
|
369 | * + .uk-heading-large,
|
370 | * + .uk-heading-xlarge,
|
371 | * + .uk-heading-2xlarge { margin-top: $base-heading-margin-top; }
|
372 |
|
373 |
|
374 |
|
375 |
|
376 |
|
377 | h1, .uk-h1 {
|
378 | font-size: $base-h1-font-size;
|
379 | line-height: $base-h1-line-height;
|
380 | @if(mixin-exists(hook-base-h1)) {@include hook-base-h1();}
|
381 | }
|
382 |
|
383 | h2, .uk-h2 {
|
384 | font-size: $base-h2-font-size;
|
385 | line-height: $base-h2-line-height;
|
386 | @if(mixin-exists(hook-base-h2)) {@include hook-base-h2();}
|
387 | }
|
388 |
|
389 | h3, .uk-h3 {
|
390 | font-size: $base-h3-font-size;
|
391 | line-height: $base-h3-line-height;
|
392 | @if(mixin-exists(hook-base-h3)) {@include hook-base-h3();}
|
393 | }
|
394 |
|
395 | h4, .uk-h4 {
|
396 | font-size: $base-h4-font-size;
|
397 | line-height: $base-h4-line-height;
|
398 | @if(mixin-exists(hook-base-h4)) {@include hook-base-h4();}
|
399 | }
|
400 |
|
401 | h5, .uk-h5 {
|
402 | font-size: $base-h5-font-size;
|
403 | line-height: $base-h5-line-height;
|
404 | @if(mixin-exists(hook-base-h5)) {@include hook-base-h5();}
|
405 | }
|
406 |
|
407 | h6, .uk-h6 {
|
408 | font-size: $base-h6-font-size;
|
409 | line-height: $base-h6-line-height;
|
410 | @if(mixin-exists(hook-base-h6)) {@include hook-base-h6();}
|
411 | }
|
412 |
|
413 |
|
414 | @media (min-width: $breakpoint-medium) {
|
415 |
|
416 | h1, .uk-h1 { font-size: $base-h1-font-size-m; }
|
417 | h2, .uk-h2 { font-size: $base-h2-font-size-m; }
|
418 |
|
419 | }
|
420 |
|
421 |
|
422 |
|
423 |
|
424 |
|
425 | ul,
|
426 | ol { padding-left: $base-list-padding-left; }
|
427 |
|
428 |
|
429 |
|
430 |
|
431 |
|
432 | ul > li > ul,
|
433 | ul > li > ol,
|
434 | ol > li > ol,
|
435 | ol > li > ul { margin: 0; }
|
436 |
|
437 |
|
438 |
|
439 |
|
440 |
|
441 | dt { font-weight: bold; }
|
442 | dd { margin-left: 0; }
|
443 |
|
444 |
|
445 |
|
446 |
|
447 |
|
448 |
|
449 |
|
450 |
|
451 |
|
452 |
|
453 |
|
454 | hr, .uk-hr {
|
455 |
|
456 | overflow: visible;
|
457 |
|
458 | text-align: inherit;
|
459 |
|
460 | margin: 0 0 $base-hr-margin-vertical 0;
|
461 | border: 0;
|
462 | border-top: $base-hr-border-width solid $base-hr-border;
|
463 | @if(mixin-exists(hook-base-hr)) {@include hook-base-hr();}
|
464 | }
|
465 |
|
466 |
|
467 | * + hr,
|
468 | * + .uk-hr { margin-top: $base-hr-margin-vertical }
|
469 |
|
470 |
|
471 | /* Address
|
472 | ========================================================================== */
|
473 |
|
474 | address { font-style: normal; }
|
475 |
|
476 |
|
477 |
|
478 |
|
479 |
|
480 | blockquote {
|
481 | margin: 0 0 $base-blockquote-margin-vertical 0;
|
482 | font-size: $base-blockquote-font-size;
|
483 | line-height: $base-blockquote-line-height;
|
484 | font-style: $base-blockquote-font-style;
|
485 | @if(mixin-exists(hook-base-blockquote)) {@include hook-base-blockquote();}
|
486 | }
|
487 |
|
488 |
|
489 | * + blockquote { margin-top: $base-blockquote-margin-vertical; }
|
490 |
|
491 |
|
492 |
|
493 |
|
494 |
|
495 | blockquote p:last-of-type { margin-bottom: 0; }
|
496 |
|
497 | blockquote footer {
|
498 | margin-top: $base-blockquote-footer-margin-top;
|
499 | font-size: $base-blockquote-footer-font-size;
|
500 | line-height: $base-blockquote-footer-line-height;
|
501 | @if(mixin-exists(hook-base-blockquote-footer)) {@include hook-base-blockquote-footer();}
|
502 | }
|
503 |
|
504 |
|
505 |
|
506 |
|
507 |
|
508 |
|
509 |
|
510 |
|
511 |
|
512 | pre {
|
513 | font: $base-pre-font-size unquote("/") $base-pre-line-height $base-pre-font-family;
|
514 | color: $base-pre-color;
|
515 | -moz-tab-size: 4;
|
516 | tab-size: 4;
|
517 |
|
518 | overflow: auto;
|
519 | @if(mixin-exists(hook-base-pre)) {@include hook-base-pre();}
|
520 | }
|
521 |
|
522 | pre code { font-family: $base-pre-font-family; }
|
523 |
|
524 |
|
525 |
|
526 |
|
527 |
|
528 | ::selection {
|
529 | background: $base-selection-background;
|
530 | color: $base-selection-color;
|
531 | text-shadow: none;
|
532 | }
|
533 |
|
534 |
|
535 |
|
536 |
|
537 |
|
538 |
|
539 |
|
540 |
|
541 |
|
542 |
|
543 | details,
|
544 | main {
|
545 | display: block;
|
546 | }
|
547 |
|
548 |
|
549 |
|
550 |
|
551 |
|
552 | summary { display: list-item; }
|
553 |
|
554 |
|
555 |
|
556 |
|
557 |
|
558 | template { display: none; }
|
559 |
|
560 |
|
561 |
|
562 |
|
563 |
|
564 |
|
565 |
|
566 |
|
567 |
|
568 | .uk-breakpoint-s::before { content: '#{$breakpoint-small}'; }
|
569 | .uk-breakpoint-m::before { content: '#{$breakpoint-medium}'; }
|
570 | .uk-breakpoint-l::before { content: '#{$breakpoint-large}'; }
|
571 | .uk-breakpoint-xl::before { content: '#{$breakpoint-xlarge}'; }
|
572 |
|
573 | :root {
|
574 | --uk-breakpoint-s: #{$breakpoint-small};
|
575 | --uk-breakpoint-m: #{$breakpoint-medium};
|
576 | --uk-breakpoint-l: #{$breakpoint-large};
|
577 | --uk-breakpoint-xl: #{$breakpoint-xlarge};
|
578 | }
|
579 |
|
580 |
|
581 |
|
582 |
|
583 | @if(mixin-exists(hook-base-misc)) {@include hook-base-misc();}
|
584 |
|
585 |
|
586 |
|
587 |
|
588 |
|
589 |
|
590 |
|
591 |
|
592 |
|
593 |
|
594 |
|
595 |
|
596 |
|
597 |
|
598 |
|
599 |
|
600 |
|
601 |
|
602 |
|
603 |
|
604 |
|
605 |
|
606 | $inverse-base-color: $inverse-global-color !default;
|
607 | $inverse-base-link-color: $inverse-global-emphasis-color !default;
|
608 | $inverse-base-link-hover-color: $inverse-global-emphasis-color !default;
|
609 | $inverse-base-code-color: $inverse-global-color !default;
|
610 | $inverse-base-em-color: $inverse-global-emphasis-color !default;
|
611 | $inverse-base-heading-color: $inverse-global-emphasis-color !default;
|
612 | $inverse-base-hr-border: $inverse-global-border !default;
|
613 |
|
614 |
|
615 |
|
616 |
|
617 |
|
618 |
|
619 |
|
620 |
|
621 |
|
622 |
|
623 |
|
624 |
|
625 |
|
626 |
|
627 |
|
628 |
|