Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Mini Cart block: fix slide in animation (https://github.com/woocommerce/woocommerce-blocks/pull/9195)

This commit is contained in:
Albert Juhé Lluveras 2023-04-25 13:39:21 +02:00 committed by GitHub
parent d0294f1abf
commit ce97f918ea
1 changed files with 16 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
plugins/woocommerce-blocks/assets/js/base/components/drawer/style.scss
View File

@ -20,7 +20,17 @@ $drawer-animation-duration: 0.3s;
} }
to { to {
transform: translateX(var(--neg-drawer-width)); transform: translateX(max(-100%, var(--neg-drawer-width)));
}
}
@keyframes rtlslidein {
from {
transform: translateX(0);
}
to {
transform: translateX(min(100%, var(--drawer-width)));
} }
} }
@ -68,7 +78,7 @@ $drawer-animation-duration: 0.3s;
} }
.rtl .wc-block-components-drawer { .rtl .wc-block-components-drawer {
transform: translateX(max(100%, var(--drawer-width))); transform: translateX(min(100%, var(--drawer-width)));
} }
.wc-block-components-drawer__screen-overlay--with-slide-out .wc-block-components-drawer { .wc-block-components-drawer__screen-overlay--with-slide-out .wc-block-components-drawer {
@ -80,6 +90,10 @@ $drawer-animation-duration: 0.3s;
animation-name: slidein; animation-name: slidein;
} }
.rtl .wc-block-components-drawer__screen-overlay--with-slide-in .wc-block-components-drawer {
animation-name: rtlslidein;
}
.wc-block-components-drawer__screen-overlay--is-hidden .wc-block-components-drawer { .wc-block-components-drawer__screen-overlay--is-hidden .wc-block-components-drawer {
transform: translateX(0); transform: translateX(0);
} }