43 lines
1023 B
SCSS
43 lines
1023 B
SCSS
|
|
$border-radius-sm: 8dp;
|
|
$border-radius-md: 12dp;
|
|
// modals/pages
|
|
$border-radius-lg: 16dp;
|
|
|
|
$border-radius-modal: $border-radius-lg;
|
|
|
|
$border-width-thickness-num: 1.1;
|
|
// $border-width-thickness-num: 1.5;
|
|
$border-width-thickness: space($border-width-thickness-num);
|
|
|
|
@mixin border($col: $color-border) {
|
|
border-width: $border-width-thickness;
|
|
border-color: $col;
|
|
}
|
|
|
|
@mixin border-top($col: $color-border) {
|
|
border-top-width: $border-width-thickness;
|
|
border-top-color: $col;
|
|
}
|
|
|
|
@mixin border-bottom($col: $color-border) {
|
|
border-bottom-width: $border-width-thickness;
|
|
border-bottom-color: $col;
|
|
}
|
|
|
|
@mixin inset-block($inset-amt) {
|
|
position: absolute;
|
|
top: $inset-amt;
|
|
right: $inset-amt;
|
|
bottom: $inset-amt;
|
|
left: $inset-amt;
|
|
}
|
|
|
|
// add this to a child of the container that needs a border.
|
|
// parent must have `position: relative`
|
|
@mixin inner-border-block($col: $color-border) {
|
|
@include inset-block($border-width-thickness);
|
|
@include border($col);
|
|
display: block;
|
|
}
|