Allow RTL-able images to display in Storybook
This commit is contained in:
parent
ca2b3bacce
commit
8d56ba4b40
1 changed files with 7 additions and 17 deletions
|
@ -269,26 +269,10 @@ $rtl-icon-map: (
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin color-svg($svg, $color, $stretch: true, $mask-origin: null) {
|
@mixin color-svg($svg, $color, $stretch: true, $mask-origin: null) {
|
||||||
$rtl-svg: get-rtl-svg($svg);
|
|
||||||
@if $rtl-svg {
|
|
||||||
:dir(ltr) & {
|
|
||||||
-webkit-mask: url($svg) no-repeat center;
|
-webkit-mask: url($svg) no-repeat center;
|
||||||
@if $stretch {
|
@if $stretch {
|
||||||
-webkit-mask-size: 100%;
|
-webkit-mask-size: 100%;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
:dir(rtl) & {
|
|
||||||
-webkit-mask: url($rtl-svg) no-repeat center;
|
|
||||||
@if $stretch {
|
|
||||||
-webkit-mask-size: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} @else {
|
|
||||||
-webkit-mask: url($svg) no-repeat center;
|
|
||||||
}
|
|
||||||
@if $stretch {
|
|
||||||
-webkit-mask-size: 100%;
|
|
||||||
}
|
|
||||||
@if $mask-origin {
|
@if $mask-origin {
|
||||||
-webkit-mask-origin: $mask-origin;
|
-webkit-mask-origin: $mask-origin;
|
||||||
}
|
}
|
||||||
|
@ -296,6 +280,12 @@ $rtl-icon-map: (
|
||||||
@media (forced-colors: active) {
|
@media (forced-colors: active) {
|
||||||
background-color: WindowText;
|
background-color: WindowText;
|
||||||
}
|
}
|
||||||
|
$rtl-svg: get-rtl-svg($svg);
|
||||||
|
@if $rtl-svg {
|
||||||
|
:dir(rtl) & {
|
||||||
|
-webkit-mask: url($rtl-svg) no-repeat center;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Keyboard
|
// Keyboard
|
||||||
|
|
Loading…
Reference in a new issue