Update main.scss file

This commit is contained in:
Peter Maquiran
2021-03-05 13:14:21 +01:00
parent 375c63cfa8
commit b5990cf56f
2 changed files with 107 additions and 8 deletions
+104 -5
View File
@@ -134,6 +134,57 @@
.align-md-content-space-between{ align-content: space-between !important;}
.align-md-content-space-around{ align-content: space-around !important;}
.align-md-content-stretch{ align-content: stretch !important;}
@for $i from 0 through 50 {
.font-md-#{$i} {
font-size: #{$i}px ;
}
}
@for $i from 0 through 10 {
$size: $i * 5;
$properties:
"margin" "m",
"padding" "p";
@each $property, $short in $properties {
// all directions
.#{$short}-md-a-#{$size} {
#{$property}-left: #{$size}px !important;
#{$property}-right: #{$size}px !important;
#{$property}-top: #{$size}px !important;
#{$property}-bottom: #{$size}px !important;
}
// top
.#{$short}-md-t-#{$size} {
#{$property}-top: #{$size}px !important
}
// bottom
.#{$short}-md-b-#{$size} {
#{$property}-bottom: #{$size}px !important
}
// left
.#{$short}-md-l-#{$size} {
#{$property}-left: #{$size}px!important
}
// right
.#{$short}-md-r-#{$size} {
#{$property}-right: #{$size}px!important
}
// left and right
.#{$short}-md-x-#{$size} {
#{$property}-left: #{$size}px!important;
#{$property}-right: #{$size}px!important;
}
// top and bottom
.#{$short}-md-y-#{$size} {
#{$property}-top: #{$size}px !important;
#{$property}-bottom: #{$size}px !important;
}
}
}
}
@media only screen and (min-width: 1366px) {
@@ -205,6 +256,57 @@
.align-lg-content-space-between{ align-content: space-between !important;}
.align-lg-content-space-around{ align-content: space-around !important;}
.align-lg-content-stretch{ align-content: stretch !important;}
@for $i from 0 through 50 {
.font-lg-#{$i} {
font-size: #{$i}px ;
}
}
@for $i from 0 through 10 {
$size: $i * 5;
$properties:
"margin" "m",
"padding" "p";
@each $property, $short in $properties {
// all directions
.#{$short}-lg-a-#{$size} {
#{$property}-left: #{$size}px !important;
#{$property}-right: #{$size}px !important;
#{$property}-top: #{$size}px !important;
#{$property}-bottom: #{$size}px !important;
}
// top
.#{$short}-lg-t-#{$size} {
#{$property}-top: #{$size}px !important
}
// bottom
.#{$short}-lg-b-#{$size} {
#{$property}-bottom: #{$size}px !important
}
// left
.#{$short}-lg-l-#{$size} {
#{$property}-left: #{$size}px!important
}
// right
.#{$short}-lg-r-#{$size} {
#{$property}-right: #{$size}px!important
}
// left and right
.#{$short}-lg-x-#{$size} {
#{$property}-left: #{$size}px!important;
#{$property}-right: #{$size}px!important;
}
// top and bottom
.#{$short}-lg-y-#{$size} {
#{$property}-top: #{$size}px !important;
#{$property}-bottom: #{$size}px !important;
}
}
}
}
.m-l-auto {margin-left: auto;}
@@ -274,11 +376,8 @@
}
@for $i from 0 through 50 {
@for $i from 0 through 50 {
.font-#{$i} {
font-size: #{$i}px ;
}
}
.text-center{text-align: center;}
}