source: admin/style/scss/init/_mixins-functions.scss @ 3365:11eb6b993152

// mixin svg fallback
@mixin svg(
     $file-name,
     $css-img-path: $css-img-path)
{
     background-image: inline-image($file-name+'.png');
     background-image: inline-image($file-name+'.svg'), none;
}

@mixin bg-with-svg(
     $file-name,
     $css-img-path: $css-img-path,
     $repeat: no-repeat,
     $position: 50% 50%,
     $bg-color: transparent)
{
     background: inline-image($file-name+'.png') $repeat, $position, $bg-color;
     background-image: inline-image($file-name+'.svg'), none;
}

// Mix from Nico3333 (https://github.com/nico3333fr/ROCSSTI/blob/master/src/css/rocssti-fr.css#L637)
// and ffood (http://www.ffoodd.fr/cache-cache-css/)
@mixin visually-hidden {
     border: 0;
     clip: rect(0 0 0 0);
     clip-path: inset(50%);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
     white-space: nowrap;
}
@mixin visually-hidden-focus {
     clip: auto;
     clip-path: none;
     height: auto;
     overflow: visible;
     position: static;
     width: auto;
     white-space: normal;
}

// Remove any unit from a value
@function strip-unit(
     $value)
{
     @return $value / ($value * 0 + 1);
}

// Compute absolute value (in em or rem) depending on font-size of the html element (given in %)
@function relative-to-screen(
     $value,             // em or rem value
     $html-font-size)    // in %
{
     @return $value / (strip-unit($html-font-size) / 100);
}