120 lines
1.5 KiB
SCSS
Vendored
120 lines
1.5 KiB
SCSS
Vendored
// Positions
|
|
|
|
$base: 1rem;
|
|
|
|
.relative {
|
|
position: relative;
|
|
}
|
|
|
|
.absolute {
|
|
position: absolute;
|
|
}
|
|
|
|
.block {
|
|
display: block;
|
|
}
|
|
|
|
.inline {
|
|
display: inline;
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
|
|
.flex-col {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.flex-center {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.flex-end {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.flex-between {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.w-100{
|
|
width: 100%;
|
|
}
|
|
|
|
.m-auto {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.p-auto {
|
|
padding-left: auto;
|
|
padding-right: auto;
|
|
}
|
|
|
|
@for $i from 0 through 5 {
|
|
.m-#{$i} {
|
|
margin: $i * $base;
|
|
}
|
|
|
|
.mx-#{$i} {
|
|
margin-left: $i * $base;
|
|
margin-right: $i * $base;
|
|
}
|
|
|
|
.my-#{$i} {
|
|
margin-top: $i * $base;
|
|
margin-bottom: $i * $base;
|
|
}
|
|
|
|
.mt-#{$i} {
|
|
margin-top: $i * $base;
|
|
}
|
|
|
|
.ml-#{$i} {
|
|
margin-left: $i * $base;
|
|
}
|
|
|
|
.mr-#{$i} {
|
|
margin-right: $i * $base;
|
|
}
|
|
|
|
.mb-#{$i} {
|
|
margin-bottom: $i * $base;
|
|
}
|
|
|
|
.p-#{$i} {
|
|
padding: $i * $base;
|
|
}
|
|
|
|
.px-#{$i} {
|
|
padding-left: $i * $base;
|
|
padding-right: $i * $base;
|
|
}
|
|
|
|
.py-#{$i} {
|
|
padding-top: $i * $base;
|
|
padding-bottom: $i * $base;
|
|
}
|
|
|
|
.pt-#{$i} {
|
|
padding-top: $i * $base;
|
|
}
|
|
|
|
.pl-#{$i} {
|
|
padding-left: $i * $base;
|
|
}
|
|
|
|
.pb-#{$i} {
|
|
padding-bottom: $i * $base;
|
|
}
|
|
}
|
|
|
|
.z-10 {
|
|
z-index: 10;
|
|
}
|