1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00

#23 fixed submit button appearance for lab

This commit is contained in:
Fedor Katurov 2021-03-26 12:35:31 +07:00
parent 998a2e305a
commit ede5dfe17f
15 changed files with 82 additions and 44 deletions

View file

@ -0,0 +1,86 @@
@import "src/styles/variables";
.wrap {
max-width: 2000px;
padding: 0 40px 40px 40px;
display: flex;
flex-direction: column;
}
$cols: $content_width / $cell;
.grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: 50vh $cell;
grid-auto-rows: $cell;
grid-auto-flow: row dense;
grid-column-gap: $gap;
grid-row-gap: $gap;
@include tablet {
padding: 0 $gap;
}
@media (max-width: $cell * 6) {
grid-template-columns: repeat(5, 1fr);
grid-template-rows: 50vh 20vw;
grid-auto-rows: 20vw;
}
@media (max-width: $cell * 5) {
grid-template-columns: repeat(4, 1fr);
grid-template-rows: 40vh 25vw;
grid-auto-rows: 25vw;
}
@media (max-width: $cell * 4) {
grid-template-columns: repeat(3, 1fr);
grid-template-rows: 40vh 33vw;
grid-auto-rows: 33vw;
}
@media (max-width: $cell * 3) {
grid-template-columns: repeat(2, 1fr);
grid-template-rows: 40vh 50vw;
grid-auto-rows: 50vw;
grid-column-gap: $gap / 2;
grid-row-gap: $gap / 2;
padding: 0 $gap / 2;
}
@media (max-width: $cell * 2) {
grid-template-columns: repeat(2, 1fr);
grid-template-rows: 40vh 50vw;
grid-auto-rows: 50vw;
}
}
.pad_last {
grid-column-end: $cols + 1;
}
.hero {
grid-row-start: 1;
grid-row-end: span 1;
grid-column-start: 1;
grid-column-end: -1;
background: darken($content_bg, 2%);
border-radius: $radius;
display: flex;
align-items: center;
justify-content: center;
font: $font_24_semibold;
}
.stamp {
grid-row-end: span 2;
grid-column: -2 / -1;
display: flex;
align-items: stretch;
justify-content: stretch;
overflow: hidden;
position: relative;
}