summaryrefslogtreecommitdiffstats
path: root/src/objects/_card.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_card.scss')
-rw-r--r--src/objects/_card.scss34
1 files changed, 30 insertions, 4 deletions
diff --git a/src/objects/_card.scss b/src/objects/_card.scss
index 1dd394f..c4d8c85 100644
--- a/src/objects/_card.scss
+++ b/src/objects/_card.scss
@@ -67,6 +67,27 @@
67 } 67 }
68 } 68 }
69 69
70 @include bem.modifier('highlight') {
71 border-color: props.get(vars.$highlight--border-color);
72 outline-width: calc(props.get(vars.$highlight--border-width) - props.get(vars.$border-width));
73 outline-style: solid;
74 outline-color: props.get(vars.$highlight--border-color);
75 box-shadow:
76 props.get(vars.$highlight--shadow-x)
77 props.get(vars.$highlight--shadow-y)
78 props.get(vars.$highlight--shadow-blur)
79 props.get(vars.$highlight--shadow-grow)
80 props.get(vars.$highlight--shadow-color);
81
82 @include bem.multi('&:link, &:visited, &:enabled', 'modifier' 'interactive', 'modifier' 'collapsible') {
83 &:hover,
84 &:active,
85 &:focus-visible {
86 border-color: props.get(vars.$highlight--border-color);
87 }
88 }
89 }
90
70 @include bem.elem('avatar') { 91 @include bem.elem('avatar') {
71 margin-block-start: props.get(vars.$pad-b); 92 margin-block-start: props.get(vars.$pad-b);
72 margin-inline-start: props.get(vars.$pad-i); 93 margin-inline-start: props.get(vars.$pad-i);
@@ -113,7 +134,7 @@
113 } 134 }
114 135
115 @include bem.elem('body') { 136 @include bem.elem('body') {
116 flex: 1 0 auto; 137 flex: 0 0 auto;
117 padding-block: props.get(vars.$pad-b); 138 padding-block: props.get(vars.$pad-b);
118 padding-inline: props.get(vars.$pad-i); 139 padding-inline: props.get(vars.$pad-i);
119 140
@@ -128,6 +149,12 @@
128 display: none; 149 display: none;
129 } 150 }
130 } 151 }
152
153 @include bem.modifier('main') {
154 flex-shrink: 1;
155 block-size: 100%;
156 min-block-size: 0;
157 }
131 } 158 }
132 159
133 @include bem.elem('content') { 160 @include bem.elem('content') {
@@ -270,10 +297,9 @@
270 } 297 }
271 298
272 @include bem.elem('body') { 299 @include bem.elem('body') {
273 flex: 0 0 auto;
274
275 @include bem.modifier('main') { 300 @include bem.modifier('main') {
276 flex-shrink: 1; 301 block-size: auto;
302 min-block-size: none;
277 inline-size: 100%; 303 inline-size: 100%;
278 min-inline-size: 0; 304 min-inline-size: 0;
279 } 305 }