|
|
|
|
@ -21,6 +21,8 @@
|
|
|
|
|
$outer-width: 100%;
|
|
|
|
|
$outer-height: 100%;
|
|
|
|
|
$border-width: 1px;
|
|
|
|
|
$border-radius-inner: 16px;
|
|
|
|
|
$border-radius-outer: 32px;
|
|
|
|
|
$grid-area: b;
|
|
|
|
|
$padding: var(--padding);
|
|
|
|
|
$edge-to-border: calc(($padding - $border-width) / 2);
|
|
|
|
|
@ -30,6 +32,8 @@
|
|
|
|
|
position: relative;
|
|
|
|
|
grid-area: $grid-area;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
box-shadow: -4px 4px 16px -4px black;
|
|
|
|
|
border-radius: $border-radius-outer;
|
|
|
|
|
background-color: $bg-color;
|
|
|
|
|
padding: $padding;
|
|
|
|
|
width: $outer-width;
|
|
|
|
|
@ -50,6 +54,8 @@
|
|
|
|
|
bottom: $edge-to-border;
|
|
|
|
|
left: $edge-to-border;
|
|
|
|
|
border: $border-width solid vars.$text-color-main;
|
|
|
|
|
border-bottom-right-radius: $border-radius-inner;
|
|
|
|
|
border-bottom-left-radius: $border-radius-inner;
|
|
|
|
|
content: '';
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
