feat(theme): use native CSS for RTL instead of using `rtlcss` package

2 weeks ago · f3885aa7c3
parent 30f0e2735f
commit f3885aa7c3
2 changed files with 2 additions and 3 deletions
--- a/src/client/theme-default/components/VPSidebarItem.vue
+++ b/src/client/theme-default/components/VPSidebarItem.vue
@ -232,7 +232,7 @@ function onCaretClick() {
 }

 .VPSidebarItem.collapsed .caret-icon {
-  transform: rotate(0)/*rtl:rotate(180deg)*/;
+  scale: calc(1 * var(--vp-direction-multiplier)) 1; /* Flip in RTL */
 }

 .VPSidebarItem.level-1 .items,
--- a/src/client/theme-default/styles/components/vp-doc.css
+++ b/src/client/theme-default/styles/components/vp-doc.css
@ -317,7 +317,6 @@
  padding: 20px 0;
  background: transparent;
  overflow-x: auto;
-  /*rtl:ignore*/
  text-align: start;
 }

@ -554,7 +553,7 @@
  --icon: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M0 0h24v24H0V0z' fill='none' /%3E%3Cpath d='M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z' /%3E%3C/svg%3E");
  -webkit-mask-image: var(--icon);
  mask-image: var(--icon);
-  /*rtl:raw:transform: scaleX(-1);*/
+  scale: calc(1 * var(--vp-direction-multiplier)) 1; /* Flip in RTL */
 }

 .vp-external-link-icon::after {