Sha256: 629bba02783e369921d5f7e9232941a6d37d0ad002fe3acb76b308c4ed3b13db
Contents?: true
Size: 1.65 KB
Versions: 23
Compression:
Stored size: 1.65 KB
Contents
// Mixin to prefix several properties at once
// EXAMPLE
// @include prefix((
// appearance: none,
// touch-callout: none,
// user-select: none
// ), webkit moz ms khtml);
@mixin prefix($declarations, $prefixes: ()) {
@each $property, $value in $declarations {
@each $prefix in $prefixes {
#{'-' + $prefix + '-' + $property}: $value;
}
// Output standard non-prefixed declaration
#{$property}: $value;
}
}
@mixin switch($res: 'sm') {
$index: 1rem;
$mainVal: 1rem;
$baseVal: 1rem;
@if $res == 'md' {
$index: 2rem;
$mainVal: 1.5rem;
$baseVal: 1rem;
min-height: $index;
} @else if $res == 'lg' {
$index: 3rem;
$mainVal: 2rem;
$baseVal: 1rem;
} @else if $res == 'xl' {
$index: 4rem;
$mainVal: 2.5rem;
$baseVal: 1rem;
}
.custom-control-label {
padding-left: #{$baseVal};
padding-bottom: #{$mainVal};
}
.custom-control-label::before {
height: $mainVal;
width: calc(#{$index} + 0.75rem);
border-radius: $mainVal * 2;
}
.custom-control-label::after {
width: calc(#{$mainVal} - 4px);
height: calc(#{$mainVal} - 4px);
border-radius: calc(#{$index} - (#{$mainVal} / 2));
}
.custom-control-input:checked ~ .custom-control-label::after {
transform: translateX(calc(#{$mainVal} - 0.25rem));
}
}
.custom-switch.custom-switch-sm {
@include switch();
}
.custom-switch.custom-switch-md {
@include switch('md');
}
.custom-switch.custom-switch-lg {
@include switch('lg');
}
.custom-switch.custom-switch-xl {
@include switch('xl');
}
Version data entries
23 entries across 23 versions & 1 rubygems