1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
.hero {
background-position: 50% 50%;
@include flexbox();
@include flex-direction(column);
@include justify-content(center);
h1 { font-size: map-get($base, font-size-h1-xl); }
h2 { font-size: map-get($base, font-size-h2-xl); }
h3 { font-size: map-get($base, font-size-h3-xl); }
h4 { font-size: map-get($base, font-size-h4-xl); }
h5 { font-size: map-get($base, font-size-h5-xl); }
h6 { font-size: map-get($base, font-size-h6-xl); }
p { font-size: map-get($base, font-size-xl); }
@include media-breakpoint-down(lg) {
h1 { font-size: map-get($base, font-size-h1-lg); }
h2 { font-size: map-get($base, font-size-h2-lg); }
h3 { font-size: map-get($base, font-size-h3-lg); }
h4 { font-size: map-get($base, font-size-h4-lg); }
h5 { font-size: map-get($base, font-size-h5-lg); }
h6 { font-size: map-get($base, font-size-h6-lg); }
p { font-size: map-get($base, font-size-lg); }
}
@include media-breakpoint-down(md) {
h1 { font-size: map-get($base, font-size-h1-sm); }
h2 { font-size: map-get($base, font-size-h2-sm); }
h3 { font-size: map-get($base, font-size-h3-sm); }
h4 { font-size: map-get($base, font-size-h4-sm); }
h5 { font-size: map-get($base, font-size-h5-sm); }
h6 { font-size: map-get($base, font-size-h6-sm); }
p { font-size: map-get($base, font-size); }
}
background-size: cover;
}
.hero--center {
text-align: center;
.menu {
@extend .menu--center;
}
}
.hero--light {
@extend .text--light;
}
.hero--dark {
@extend .text--dark;
}
.hero__content {
margin: map-get($spacers, 5);
@include media-breakpoint-down(lg) {
margin: map-get($spacers, 5) map-get($spacers, 4);
}
@include media-breakpoint-down(md) {
margin: map-get($spacers, 4) map-get($spacers, 3);
}
}
.heros {
& > .hero {
margin: map-get($spacers, 5);
@include media-breakpoint-down(lg) {
margin: map-get($spacers, 3);
}
@include media-breakpoint-down(md) {
margin: map-get($spacers, 2) 0;
}
}
}
|
