1
|
//
|
2
|
// Component: Mixin
|
3
|
// Description: Defines mixins which are used across all components
|
4
|
//
|
5
|
// ========================================================================
|
6
|
|
7
|
|
8
|
// SVG
|
9
|
// ========================================================================
|
10
|
|
11
|
/// Replace `$search` with `$replace` in `$string`
|
12
|
/// @author Hugo Giraudel
|
13
|
/// @param {String} $string - Initial string
|
14
|
/// @param {String} $search - Substring to replace
|
15
|
/// @param {String} $replace ('') - New value
|
16
|
/// @return {String} - Updated string
|
17
|
@function str-replace($string, $search, $replace: '') {
|
18
|
$index: str-index($string, $search);
|
19
|
|
20
|
@if $index {
|
21
|
@return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
22
|
}
|
23
|
|
24
|
@return $string;
|
25
|
}
|
26
|
|
27
|
@mixin svg-fill($src, $color-default, $color-new){
|
28
|
|
29
|
$replace-src: str-replace($src, $color-default, $color-new) !default;
|
30
|
$replace-src: str-replace($replace-src, "#", "%23");
|
31
|
background-image: url(quote($replace-src));
|
32
|
}
|