summaryrefslogtreecommitdiffstats
path: root/assets/css/components/_hero.scss
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/components/_hero.scss')
-rw-r--r--assets/css/components/_hero.scss53
1 files changed, 0 insertions, 53 deletions
diff --git a/assets/css/components/_hero.scss b/assets/css/components/_hero.scss
deleted file mode 100644
index 3d8890e..0000000
--- a/assets/css/components/_hero.scss
+++ /dev/null
@@ -1,53 +0,0 @@
1@include namespace('hero') {
2 @include store((
3 --colors: (
4 --emph-fg: prop(--colors --accent, $global: true),
5 --back-fg: prop(--colors --bg-hi, $global: true)
6 )
7 ));
8
9 @include component(namespace()) {
10 display: flex;
11 position: relative;
12 align-items: center;
13 justify-content: center;
14 text-align: center;
15
16 @include element('title') {
17 margin-top: 0;
18 font-family: $font-fam--large;
19 text-transform: none;
20
21 @include modifier('front') {
22 max-width: 7em;
23 font-size: 2.5rem;
24 font-weight: 200;
25 }
26
27 @include modifier('back') {
28 position: absolute;
29 z-index: -10;
30 transform: translateY(-.08em);
31 color: prop(--colors --back-fg);
32 }
33 }
34
35 @include element('emph') {
36 color: prop(--colors --emph-fg);
37 font-weight: 500;
38 }
39
40 @include iro-responsive-env(('xs', 'sm', 'md')) {
41 @include element('title') {
42 @include modifier('front') {
43 padding: iro-responsive-set((7rem, 7rem, 10rem)) 0;
44 font-size: iro-responsive-set((2.2rem, 3rem, 3.5rem));
45 }
46
47 @include modifier('back') {
48 font-size: iro-responsive-set((12rem, 14rem, 16rem));
49 }
50 }
51 }
52 }
53}