SVG hover
/// cambiar el color al pasar por encima o hacer foco en un SVG
$svg-attributes: (stroke, fill);
@each $attr in $svg-attributes {
/// @example html
/// <div class="fill-white hover-fill-red">
/// <svg/>
/// </div>
.hover-#{$attr}#{$infix}-#{$color} {
&:hover,
&:focus-within {
svg {
* {
#{$attr}: var(--#{$color}) !important;
}
}
}
}
.visited-#{$attr}#{$infix}-#{$color} {
&:visited {
svg {
* {
#{$attr}: var(--#{$color}) !important;
}
}
}
}
}
parece que esta utility no esta en sutty base, sirve para que al hacer hover sobre un svg puedas cambiar el color del fill o stroke