summaryrefslogtreecommitdiffstats
path: root/assets/css/components
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/components')
-rw-r--r--assets/css/components/_card.scss45
-rw-r--r--assets/css/components/_footer.scss1
2 files changed, 8 insertions, 38 deletions
diff --git a/assets/css/components/_card.scss b/assets/css/components/_card.scss
index 6fdd874..d1b549d 100644
--- a/assets/css/components/_card.scss
+++ b/assets/css/components/_card.scss
@@ -30,6 +30,8 @@
30 display: flex; 30 display: flex;
31 position: relative; 31 position: relative;
32 align-items: center; 32 align-items: center;
33 padding-right: calc(.5 * #{prop(--dims --pad-x)});
34 padding-left: calc(.5 * #{prop(--dims --pad-x)});
33 transform: translateY(0); 35 transform: translateY(0);
34 transition: transform .2s, background-color .2s, color .2s; 36 transition: transform .2s, background-color .2s, color .2s;
35 background-color: prop(--colors --bg); 37 background-color: prop(--colors --bg);
@@ -83,45 +85,14 @@
83 } 85 }
84 } 86 }
85 87
86 @include element('content') { 88 @include element('block') {
87 box-sizing: border-box;
88 width: 100%;
89 padding: prop(--dims --pad-y) prop(--dims --pad-x);
90
91 @include next-twin-element {
92 width: auto;
93 }
94
95 @include modifier('flip') {
96 visibility: hidden;
97 position: absolute;
98 top: 0;
99 left: 0;
100 height: 100%;
101 transition: visibility 0s linear .2s, opacity .2s;
102 opacity: 0;
103 background-color: prop(--colors --hover --bg);
104 }
105
106 @include sibling-element('icon') {
107 padding-right: prop(--dims --pad-x);
108 padding-left: 0;
109 }
110 }
111
112 @include element('icon') {
113 display: block;
114 flex: 0 0 auto; 89 flex: 0 0 auto;
115 padding: prop(--dims --pad-y) 0 prop(--dims --pad-y) prop(--dims --pad-x); 90 padding: prop(--dims --pad-y) calc(.5 * #{prop(--dims --pad-x)});
116 }
117 91
118 @include element('image') { 92 @include modifier('main') {
119 display: block; 93 flex-shrink: 1;
120 flex: 0 0 auto; 94 width: 100%;
121 width: 4em; 95 }
122 height: 100%;
123 object-fit: cover;
124 object-position: center center;
125 } 96 }
126 } 97 }
127} 98}
diff --git a/assets/css/components/_footer.scss b/assets/css/components/_footer.scss
index cc0e827..6371411 100644
--- a/assets/css/components/_footer.scss
+++ b/assets/css/components/_footer.scss
@@ -9,7 +9,6 @@
9 9
10 @include component(namespace()) { 10 @include component(namespace()) {
11 position: relative; 11 position: relative;
12 flex: 0 0 auto;
13 min-height: prop(--dims --outer, $global: true); 12 min-height: prop(--dims --outer, $global: true);
14 margin-top: auto; 13 margin-top: auto;
15 overflow: hidden; 14 overflow: hidden;