Add CI lint for physical directional CSS classes

Prevents reintroduction of physical directional Tailwind classes
(pl/pr, ml/mr, left/right, text-left/text-right, border-l/border-r,
float-left/float-right). Lines with rtl: variants are excluded.

Also fixes two missed physical classes: border-r on table cells
and left-0 on lock icon positioning.

Ref: #2195

Author: scottmakestech

.github/workflows/test.yaml

@@ -40,3 +40,22 @@ jobs:
       - name: Validate RSS feed
         run: xmllint --noout public/feed.xml
       # - run: npm run test:html5validate
+      - name: Lint for physical directional CSS classes
+        run: |
+          VIOLATIONS=$(grep -rn \
+            -e '\bpl-\|\bpr-' \
+            -e '\bml-\|\bmr-' \
+            -e '\b-ml-\|\b-mr-' \
+            -e '\bleft-\|\bright-' \
+            -e '\btext-left\b\|\btext-right\b' \
+            -e '\bborder-l\b\|\bborder-r\b' \
+            -e '\bfloat-left\b\|\bfloat-right\b' \
+            themes/le-2025/layouts/ themes/le-2025/assets/css/ \
+            --include='*.html' --include='*.css' \
+            | grep -v 'rtl:' \
+            | grep -v 'direction: ltr' || true)
+          if [ -n "$VIOLATIONS" ]; then
+            echo "::error::Physical directional CSS classes found. Use logical equivalents (ps/pe, ms/me, start/end, text-start/text-end, border-s/border-e). See PR #2195."
+            echo "$VIOLATIONS"
+            exit 1
+          fi

themes/le-2025/assets/css/le-2025-theme-input.css

@@ -140,7 +140,7 @@
   }
 
   & td:not(:last-child) {
-    @apply border-r border-[#e8e8e8];
+    @apply border-e border-[#e8e8e8];
   }
 
   & tr:last-child td {
@@ -321,7 +321,7 @@
 
   & li::before {
     content: '';
-    @apply absolute left-0 top-1/2 transform -translate-y-1/2 w-[40px] h-[43px] bg-no-repeat bg-contain;
+    @apply absolute start-0 top-1/2 transform -translate-y-1/2 w-[40px] h-[43px] bg-no-repeat bg-contain;
     background-image: url('/images/le-logo-lockonly-black-cropped.svg');
   }
 }