58 lines
853 B
SCSS
58 lines
853 B
SCSS
@import 'variables.module';
|
|
|
|
.card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
border-radius: 1.5rem;
|
|
padding: 1rem;
|
|
gap: 0.25rem;
|
|
|
|
h1 {
|
|
margin: 0px;
|
|
}
|
|
h2 {
|
|
margin: 0px;
|
|
}
|
|
* {
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
.cardContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1rem;
|
|
}
|
|
|
|
div.card {
|
|
border: 1px solid $colorBorderLight1;
|
|
background: linear-gradient(
|
|
180deg,
|
|
$colorSurfaceLight1 0%,
|
|
$colorBorderLight1 200%
|
|
);
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
div.card {
|
|
border: 1px solid $colorBorderDark1;
|
|
background: linear-gradient(
|
|
180deg,
|
|
$colorSurfaceDark2 0%,
|
|
$colorBorderDark1 200%
|
|
);
|
|
}
|
|
}
|
|
|
|
.subLayout {
|
|
display: grid;
|
|
gap: 1rem;
|
|
}
|
|
|
|
@media (min-width: 1000px) {
|
|
div.subLayout {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
}
|