noNameWEB/livewire-material
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Select on [dir='rtl'] now that no build rewrites :dir()

Browse Source 
Plan step 39 (part 4). With Tailwind gone the Workbench's Vite build
still turns every `:dir(rtl)` into a long `:lang()` list (its own CSS
minifier, not Tailwind's doing — confirmed by rebuilding and grepping
the output). Every RTL mirror rule across the eleven stylesheets that
had one now selects `:is([dir='rtl'], [dir='rtl'] *)` instead, matching
`:dir(rtl)`'s own specificity (one pseudo-class) and its inherited
"this element or a descendant of one carrying the attribute" reach; the
built CSS now keeps the selector as written (no `:lang(` or `:dir(` left).

RTL browser tests drop the `lang="ar"` workaround the old rewrite
needed (ContainmentTest's side-sheet probe, LayoutTest's shared
layoutPage() helper) and set only dir="rtl"; CarouselTest's probe
already did. Feature tests asserting the selector's literal text
(Progress, Overlay, Menu, ListDetail, Icon, Carousel) updated to match.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 06:54:16 +02:00
co-authored by Claude Sonnet 5
parent f21943746e
commit 58ef33dc95
19 changed files with 36 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/components/navigation-rail.css
+8 -8
View File
@@ -341,7 +341,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -357,7 +357,7 @@
translate: -100% 0;
}
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 0 0;
@starting-style {
@@ -386,7 +386,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -399,7 +399,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -413,7 +413,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -430,7 +430,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -447,7 +447,7 @@
translate var(--md-sys-motion-effects-default-duration) var(--md-sys-motion-easing-emphasized-accelerate),
display var(--md-sys-motion-effects-default-duration) allow-discrete;
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 100% 0;
}
}
@@ -465,7 +465,7 @@
translate: -100% 0;
}
&:dir(rtl) {
&:is([dir='rtl'], [dir='rtl'] *) {
translate: 0 0;
@starting-style {