42 lines
902 B
SCSS
42 lines
902 B
SCSS
|
@mixin box-shadow {
|
||
|
|
box-shadow: 0 1px 1px rgba(0,0,0,0.11),
|
||
|
|
0 2px 2px rgba(0,0,0,0.11),
|
||
|
|
0 4px 4px rgba(0,0,0,0.11),
|
||
|
|
0 6px 8px rgba(0,0,0,0.11),
|
||
|
|
0 8px 16px rgba(0,0,0,0.11);
|
||
|
|
}
|
||
|
|
|
||
|
|
@mixin box-shadow-heavy {
|
||
|
|
box-shadow: 0 2px 1px rgba(0,0,0,0.09),
|
||
|
|
0 4px 2px rgba(0,0,0,0.09),
|
||
|
|
0 8px 4px rgba(0,0,0,0.09),
|
||
|
|
0 16px 8px rgba(0,0,0,0.09),
|
||
|
|
0 32px 16px rgba(0,0,0,0.09);
|
||
|
|
}
|
||
|
|
|
||
|
|
@mixin focus-outline {
|
||
|
|
outline: solid;
|
||
|
|
outline-color: var(--primary-accent);
|
||
|
|
outline-offset: 4px;
|
||
|
|
}
|
||
|
|
|
||
|
|
@function css-function( $function, $values... ) {
|
||
|
|
@return
|
||
|
|
$function
|
||
|
|
+ unquote( '(' )
|
||
|
|
+ $values
|
||
|
|
+ unquote( ')' )
|
||
|
|
;
|
||
|
|
}
|
||
|
|
|
||
|
|
@function css-min( $values... ) {
|
||
|
|
@return css-function( min, $values );
|
||
|
|
}
|
||
|
|
|
||
|
|
@function css-max( $values... ) {
|
||
|
|
@return css-function( max, $values );
|
||
|
|
}
|
||
|
|
|
||
|
|
@function css-clamp( $values... ) {
|
||
|
|
@return css-function( clamp, $values );
|
||
|
|
}
|