.blacklight-icons { display: inline-flex; height: $font-size-base; width: $font-size-base; } .blacklight-icons svg { height: 1rem; width: 1rem; top: .125rem; position: relative; } @each $color, $value in $theme-colors { .btn-#{$color} { .blacklight-icons svg { @include fill-yiq(theme-color($color)); } } .btn-outline-#{$color} { .blacklight-icons svg { fill: $value; } &.hover, &:hover, &:active, &.active { .blacklight-icons svg { @include fill-yiq(theme-color($color)); } } } }