// // SVG Bg Icons // @mixin svg-bg-icon($type, $color: none, $update: false) { $bg-image: ''; // Icon type; @if ($type == close) { $bg-image: url("data:image/svg+xml,"); } @if ($type == check) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-top) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-bottom) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-start) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-double-start) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-end) { $bg-image: url("data:image/svg+xml,"); } @if ($type == arrow-double-end) { $bg-image: url("data:image/svg+xml,"); } @if ($type == sort) { $bg-image: url("data:image/svg+xml,"); } @if ($type == sort-asc) { $bg-image: url("data:image/svg+xml,"); } @if ($type == sort-desc) { $bg-image: url("data:image/svg+xml,"); } @if ($type == expand) { $bg-image: url("data:image/svg+xml,"); } @if ($type == collapse) { $bg-image: url("data:image/svg+xml,"); } // Icon style @if $update == false { mask-repeat: no-repeat; mask-position: center; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; } @if $color != none { background-color: $color; } -webkit-mask-image: escape-svg($bg-image); mask-image: escape-svg($bg-image); }