muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

flow appearance

Browse source
This commit is contained in:
Fedor Katurov 2019-10-19 21:39:23 +07:00
parent 6917c465f3
commit 5d7b76f003
2 changed files with 25 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/flow/FlowGrid/styles.scss
View file

@ -8,11 +8,27 @@ $cols: $content_width / $cell;
.grid_test { .grid_test {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax($cell, 1fr)); grid-template-columns: repeat(auto-fit, minmax($cell, 1fr));
grid-template-rows: $cell; grid-template-rows: 40vh $cell;
grid-auto-rows: $cell; grid-auto-rows: $cell;
grid-auto-flow: row dense; grid-auto-flow: row dense;
grid-column-gap: $grid_line; grid-column-gap: $grid_line;
grid-row-gap: $grid_line; grid-row-gap: $grid_line;
@media (max-width: $cell * 5) {
grid-template-columns: repeat(4, 1fr);
}
@media (max-width: $cell * 4) {
grid-template-columns: repeat(3, 1fr);
}
@media (max-width: $cell * 3) {
grid-template-columns: repeat(2, 1fr);
}
@media (max-width: $cell * 2) {
grid-template-columns: repeat(1, 1fr);
}
} }
.pad_last { .pad_last {

9
src/styles/variables.scss
View file

@ -106,7 +106,9 @@ $input_shadow_filled: $input_shadow;
} }
@mixin phone { @mixin phone {
@content; @media (max-width: 320px) {
@content;
}
} }
@mixin tablet { @mixin tablet {
@ -114,6 +116,11 @@ $input_shadow_filled: $input_shadow;
@content; @content;
} }
} }
@mixin desktop {
@media (max-width: $content_width) {
@content;
}
}
@mixin vertical_at_tablet { @mixin vertical_at_tablet {
@media (max-width: 599px) { @media (max-width: 599px) {