feat(extra-features): Add more helpful functions
This commit is contained in:
@ -8,10 +8,34 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Font weight utility classes generator
|
||||||
|
// Generates utility classes like .fw-100, .fw-200, etc.
|
||||||
|
@for $i from 100 through 900 {
|
||||||
|
@if $i % 100 == 0 {
|
||||||
|
.fw-#{$i} {
|
||||||
|
font-weight: #{$i} !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// gap size utility classes generator
|
// gap size utility classes generator
|
||||||
// Generates utility classes like .gap-4
|
// Generates utility classes like .gap-4, .gap-col-4, .gap-row-4
|
||||||
@for $i from 1 through 35 {
|
@for $i from 1 through 35 {
|
||||||
.gap-#{$i} {
|
.gap-#{$i} {
|
||||||
gap: rem-calc($i * 1px) !important;
|
gap: rem-calc($i * 1px) !important;
|
||||||
}
|
}
|
||||||
|
.gap-col-#{$i} {
|
||||||
|
column-gap: rem-calc($i * 1px) !important;
|
||||||
|
}
|
||||||
|
.gap-row-#{$i} {
|
||||||
|
row-gap: rem-calc($i * 1px) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// hex to rgba function
|
||||||
|
@function hex-to-rgba($hex, $alpha) {
|
||||||
|
$r: red($hex);
|
||||||
|
$g: green($hex);
|
||||||
|
$b: blue($hex);
|
||||||
|
@return rgba($r, $g, $b, $alpha);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user