Files
aircv/sass/utils/_helpers.scss
2022-04-24 03:02:39 -05:00

256 lines
8.2 KiB
SCSS
Executable File

/*------------------------------------------------------------------
[Row]
------------------------------------------------------------------*/
.row-space-2 {
margin-right: -2px;
margin-left: -2px;
> [class*="col-"] {
padding-left: 2px;
padding-right: 2px;
}
}
/*--------------------------------------------------
[Container Full Width]
----------------------------------------------------*/
.container-full-width {
margin-right: auto;
margin-left: auto;
@include clearfix;
}
/*--------------------------------------------------
[Container Small]
----------------------------------------------------*/
.container-sm {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
@include clearfix;
}
/* Media Queries below 768px */
@media (min-width: $screen-sm-min) {
.container-sm {
width: 750px;
}
}
/* Media Queries below 1200px */
@media (min-width: $screen-lg-min) {
.container-sm {
width: 970px;
}
}
/*------------------------------------------------------------------
[Content]
------------------------------------------------------------------*/
.content {
padding-top: 40px;
padding-bottom: 40px;
}
.content-sm {
padding-top: 60px;
padding-bottom: 60px;
}
.content-md {
padding-top: 80px;
padding-bottom: 80px;
}
.content-lg {
padding-top: 100px;
padding-bottom: 100px;
}
/*------------------------------------------------------------------
[Full Width]
------------------------------------------------------------------*/
.full-width {
@include size(100%, auto);
}
/*--------------------------------------------------
[Font Weight]
----------------------------------------------------*/
.fweight-300 { @include font($weight: 300 !important); }
.fweight-400 { @include font($weight: 400 !important); }
.fweight-500 { @include font($weight: 500 !important); }
.fweight-600 { @include font($weight: 600 !important); }
.fweight-700 { @include font($weight: 700 !important); }
/*------------------------------------------------------------------
[Left margin]
------------------------------------------------------------------*/
.margin-l-0 { margin-left: 0 !important; }
.margin-l-5 { margin-left: 5px !important; }
.margin-l-10 { margin-left: 10px !important; }
.margin-l-20 { margin-left: 20px !important; }
/*------------------------------------------------------------------
[Right margin]
------------------------------------------------------------------*/
.margin-r-0 { margin-right: 0 !important; }
.margin-r-5 { margin-right: 5px !important; }
.margin-r-10 { margin-right: 10px !important; }
.margin-r-20 { margin-right: 20px !important; }
/*------------------------------------------------------------------
[Top margin]
------------------------------------------------------------------*/
.margin-t-0 { margin-top: 0 !important; }
.margin-t-5 { margin-top: 5px !important; }
.margin-t-10 { margin-top: 10px !important; }
.margin-t-20 { margin-top: 20px !important; }
.margin-t-30 { margin-top: 30px !important; }
.margin-t-40 { margin-top: 40px !important; }
.margin-t-50 { margin-top: 50px !important; }
.margin-t-60 { margin-top: 60px !important; }
/*------------------------------------------------------------------
[Bottom margin]
------------------------------------------------------------------*/
.margin-b-0 { margin-bottom: 0 !important; }
.margin-b-4 { margin-bottom: 4px !important; }
.margin-b-5 { margin-bottom: 5px !important; }
.margin-b-10 { margin-bottom: 10px !important; }
.margin-b-20 { margin-bottom: 20px !important; }
.margin-b-30 { margin-bottom: 30px !important; }
.margin-b-40 { margin-bottom: 40px !important; }
.margin-b-50 { margin-bottom: 50px !important; }
.margin-b-60 { margin-bottom: 60px !important; }
.margin-b-70 { margin-bottom: 70px !important; }
.margin-b-80 { margin-bottom: 80px !important; }
.margin-b-90 { margin-bottom: 90px !important; }
.margin-b-100 { margin-bottom: 100px !important; }
/*------------------------------------------------------------------
[Top margin below 992px]
------------------------------------------------------------------*/
@media (max-width: $screen-md-min) {
.md-margin-b-0 { margin-bottom: 0 !important; }
.md-margin-b-4 { margin-bottom: 4px !important; }
.md-margin-b-5 { margin-bottom: 5px !important; }
.md-margin-b-10 { margin-bottom: 10px !important; }
.md-margin-b-20 { margin-bottom: 20px !important; }
.md-margin-b-30 { margin-bottom: 30px !important; }
.md-margin-b-40 { margin-bottom: 40px !important; }
.md-margin-b-50 { margin-bottom: 50px !important; }
.md-margin-b-60 { margin-bottom: 60px !important; }
.md-margin-b-70 { margin-bottom: 70px !important; }
.md-margin-b-80 { margin-bottom: 80px !important; }
.md-margin-b-90 { margin-bottom: 90px !important; }
.md-margin-b-100 { margin-bottom: 100px !important; }
}
/*------------------------------------------------------------------
[Top margin below 768px]
------------------------------------------------------------------*/
@media (max-width: $screen-sm-min) {
.sm-margin-b-0 { margin-bottom: 0 !important; }
.sm-margin-b-4 { margin-bottom: 4px !important; }
.sm-margin-b-5 { margin-bottom: 5px !important; }
.sm-margin-b-10 { margin-bottom: 10px !important; }
.sm-margin-b-20 { margin-bottom: 20px !important; }
.sm-margin-b-30 { margin-bottom: 30px !important; }
.sm-margin-b-40 { margin-bottom: 40px !important; }
.sm-margin-b-50 { margin-bottom: 50px !important; }
.sm-margin-b-60 { margin-bottom: 60px !important; }
.sm-margin-b-70 { margin-bottom: 70px !important; }
.sm-margin-b-80 { margin-bottom: 80px !important; }
.sm-margin-b-90 { margin-bottom: 90px !important; }
.sm-margin-b-100 { margin-bottom: 100px !important; }
}
/*------------------------------------------------------------------
[Top margin below 480px]
------------------------------------------------------------------*/
@media (max-width: $screen-xs-min) {
.xs-margin-b-0 { margin-bottom: 0 !important; }
.xs-margin-b-4 { margin-bottom: 4px !important; }
.xs-margin-b-5 { margin-bottom: 5px !important; }
.xs-margin-b-10 { margin-bottom: 10px !important; }
.xs-margin-b-20 { margin-bottom: 20px !important; }
.xs-margin-b-30 { margin-bottom: 30px !important; }
.xs-margin-b-40 { margin-bottom: 40px !important; }
.xs-margin-b-50 { margin-bottom: 50px !important; }
.xs-margin-b-60 { margin-bottom: 60px !important; }
.xs-margin-b-70 { margin-bottom: 70px !important; }
.xs-margin-b-80 { margin-bottom: 80px !important; }
.xs-margin-b-90 { margin-bottom: 90px !important; }
.xs-margin-b-100 { margin-bottom: 100px !important; }
}
/*--------------------------------------------------
[Height]
----------------------------------------------------*/
.height-100 { height: 100px !important; }
.height-200 { height: 200px !important; }
.height-300 { height: 300px !important; }
.height-400 { height: 400px !important; }
.height-500 { height: 500px !important; }
/*------------------------------------------------------------------
[Top margin below 992px]
------------------------------------------------------------------*/
@media (max-width: $screen-md-min) {
.md-text-center { text-align: center; }
.md-text-left { text-align: left; }
.md-text-right { text-align: right; }
}
/*------------------------------------------------------------------
[Top margin below 768px]
------------------------------------------------------------------*/
@media (max-width: $screen-sm-min) {
.sm-text-center { text-align: center; }
.sm-text-left { text-align: left; }
.sm-text-right { text-align: right; }
}
/*------------------------------------------------------------------
[Top margin below 480px]
------------------------------------------------------------------*/
@media (max-width: $screen-xs-min) {
.xs-text-center { text-align: center; }
.xs-text-left { text-align: left; }
.xs-text-right { text-align: right; }
}