Guide_3DS/_sass/minimal-mistakes/_mixins.scss
lifehackerhansol 5641d7e51a first rebase
ALSO: Remove fading on dropdown menu click. This is also a bug on the actual upstream, when the cursor leaves the screen the menu disappears but the fading doesn't.
This causes things like the menu saying it's open when it's not and closed when open. I'm not dealing with an upstream bug.
2022-01-11 10:23:27 -08:00

92 lines
No EOL
2 KiB
SCSS

/* ==========================================================================
MIXINS
========================================================================== */
%tab-focus {
/* Default*/
outline: thin dotted $focus-color;
/* Webkit*/
outline: 5px auto $focus-color;
outline-offset: -2px;
}
/*
em function
========================================================================== */
@function em($target, $context: $doc-font-size) {
@return ($target / $context) * 1em;
}
/*
Bourbon clearfix
========================================================================== */
/*
* Provides an easy way to include a clearfix for containing floats.
* link http://cssmojo.com/latest_new_clearfix_so_far/
*
* example scss - Usage
*
* .element {
* @include clearfix;
* }
*
* example css - CSS Output
*
* .element::after {
* clear: both;
* content: "";
* display: table;
* }
*/
@mixin clearfix {
clear: both;
&::after {
clear: both;
content: "";
display: table;
}
}
/*
Compass YIQ Color Contrast
https://github.com/easy-designs/yiq-color-contrast
========================================================================== */
@function yiq-is-light(
$color,
$threshold: $yiq-contrasted-threshold
) {
$red: red($color);
$green: green($color);
$blue: blue($color);
$yiq: (($red*299)+($green*587)+($blue*114))/1000;
@if $yiq-debug { @debug $yiq, $threshold; }
@return if($yiq >= $threshold, true, false);
}
@function yiq-contrast-color(
$color,
$dark: $yiq-contrasted-dark-default,
$light: $yiq-contrasted-light-default,
$threshold: $yiq-contrasted-threshold
) {
@return if(yiq-is-light($color, $threshold), $yiq-contrasted-dark-default, $yiq-contrasted-light-default);
}
@mixin yiq-contrasted(
$background-color,
$dark: $yiq-contrasted-dark-default,
$light: $yiq-contrasted-light-default,
$threshold: $yiq-contrasted-threshold
) {
background-color: $background-color;
color: yiq-contrast-color($background-color, $dark, $light, $threshold);
}