UI with Piperade Grid
This commit is contained in:
parent
ab35df6462
commit
19af7858fc
File diff suppressed because it is too large
Load Diff
|
@ -0,0 +1,57 @@
|
||||||
|
$col: 13;
|
||||||
|
|
||||||
|
.start {
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.end {
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.v-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
/*
|
||||||
|
// ENABLE FOR DEV OR FOR DEMONSTRATION
|
||||||
|
|
||||||
|
.col{
|
||||||
|
border: 3px solid red;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
border: 3px solid green;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (min-width: 600px) {
|
||||||
|
@for $i from 1 to $col {
|
||||||
|
|
||||||
|
.s#{$i} {
|
||||||
|
width: calc(#{$i} * 8.334%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 600px) and (max-width: 992px) {
|
||||||
|
@for $i from 1 to $col {
|
||||||
|
|
||||||
|
.m#{$i} {
|
||||||
|
width: calc(#{$i} * 8.334%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (min-width: 992px) {
|
||||||
|
@for $i from 1 to $col {
|
||||||
|
|
||||||
|
.l#{$i} {
|
||||||
|
width: calc(#{$i} * 8.334%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -14,7 +14,6 @@
|
||||||
@import "components/global";
|
@import "components/global";
|
||||||
@import "components/badges";
|
@import "components/badges";
|
||||||
@import "components/icons-material-design";
|
@import "components/icons-material-design";
|
||||||
@import "components/grid";
|
|
||||||
@import "components/navbar";
|
@import "components/navbar";
|
||||||
@import "components/typography";
|
@import "components/typography";
|
||||||
@import "components/transitions";
|
@import "components/transitions";
|
||||||
|
@ -33,9 +32,3 @@
|
||||||
@import "components/table_of_contents";
|
@import "components/table_of_contents";
|
||||||
@import "components/sidenav";
|
@import "components/sidenav";
|
||||||
@import "components/preloader";
|
@import "components/preloader";
|
||||||
@import "components/slider";
|
|
||||||
@import "components/carousel";
|
|
||||||
@import "components/tapTarget";
|
|
||||||
@import "components/pulse";
|
|
||||||
@import "components/datepicker";
|
|
||||||
@import "components/timepicker";
|
|
||||||
|
|
Loading…
Reference in New Issue