64 lines
2.7 KiB
SCSS
64 lines
2.7 KiB
SCSS
/*Sticky Utility / Secondary Classes*/
|
|
/*Rounded Borders*/
|
|
.rounded-0{border-radius:$rounded-0!important;}
|
|
.rounded-xs{border-radius:$rounded-xs!important;}
|
|
.rounded-s{border-radius:$rounded-s!important;}
|
|
.rounded-sm{border-radius:$rounded-sm!important;}
|
|
.rounded-m{border-radius:$rounded-m!important;}
|
|
.rounded-l{border-radius:$rounded-l!important;}
|
|
.rounded-xl{border-radius:$rounded-xl!important;}
|
|
|
|
/*Shadows*/
|
|
.shadow-none{box-shadow: $shadow-0!important;}
|
|
.shadow-0{box-shadow: $shadow-0!important;}
|
|
.shadow-xs{box-shadow: $shadow-xs!important;}
|
|
.shadow-s{box-shadow: $shadow-s!important;}
|
|
.shadow-m{box-shadow:$shadow-m!important;}
|
|
.shadow-l{box-shadow:$shadow-l!important;}
|
|
.shadow-xl{box-shadow:$shadow-xl!important;}
|
|
|
|
/*Line Height Control*/
|
|
.line-height-xs{line-height:$line-height-xs!important;}
|
|
.line-height-s{line-height:$line-height-s!important;}
|
|
.line-height-m{line-height:$line-height-m!important;}
|
|
.line-height-l{line-height:$line-height-l!important;}
|
|
.line-height-xl{line-height:$line-height-xl!important;}
|
|
|
|
/*Text Shadow*/
|
|
.text-shadow-s{text-shadow:0px 1px 0px rgba(0,0,0,0.4);}
|
|
.text-shadow-l{text-shadow:0px 1px 2px rgba(0,0,0,0.4);}
|
|
|
|
/*Boxed Text*/
|
|
.boxed-text-xl, .boxed-text-l, .boxed-text-m, .boxed-text-s{display:block; text-align:center; margin-left:auto; margin-right:auto;}
|
|
.boxed-text-xl{width:$box-text-xl; max-width:340px;}
|
|
.boxed-text-l{width:$box-text-l; max-width:300px;}
|
|
.boxed-text-m{width:$box-text-m; max-width:300px;}
|
|
.boxed-text-s{width:$box-text-s; max-width:260px;}
|
|
|
|
/*Font Weights*/
|
|
$fontWeight: 200, 300, 400, 500, 600, 700, 800, 900;
|
|
@each $fontWeight in $fontWeight{.font-#{$fontWeight}{font-weight:$fontWeight;}}
|
|
|
|
/*Opacity Values - Used for Contrasting Text, example opacity-30 will make the opacity 0.3*/
|
|
$opacity: 10, 20, 30, 40, 50, 60, 70, 80, 85, 90;
|
|
@each $opacity in $opacity{.opacity-#{$opacity}{opacity:$opacity/100;}}
|
|
|
|
/*Font Array - Better Typography Control, example font-30 class will make the font size 30px*/
|
|
$fontSizes: 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40;
|
|
@each $fontSizes in $fontSizes{.font-#{$fontSizes}{font-size:$fontSizes+px!important;}}
|
|
|
|
|
|
/*Scaling Animation*/
|
|
@keyframes scale-animation {0% {transform:scale(1, 1)} 50% {transform:scale(1.05, 1.05)} 0% {transform:scale(1, 1)}}
|
|
.scale-box{animation:scale-animation 1.5s; animation-iteration-count: infinite;}
|
|
|
|
@keyframes scale-icon {0% {transform:scale(1, 1)} 50% {transform:scale(1.3, 1.3)} 0% {transform:scale(1, 1)}}
|
|
.scale-icon{animation:scale-icon 1.5s; animation-iteration-count: infinite;}
|
|
|
|
/*Control Classes*/
|
|
::-webkit-scrollbar{display: none;}
|
|
img.mx-auto{display:block;}
|
|
.disabled{display:none!important}
|
|
.no-click{pointer-events: none!important;}
|
|
.no-outline{outline:none!important;}
|