Fix: harden RTL — tables and tabs were rendering left-to-right · 2924f716d4 - nadlan-mcp

Fix: harden RTL — tables and tabs were rendering left-to-right

Five-layer defense so that no single library/browser quirk can flip the
layout back to LTR:

1. <body dir="rtl"> in addition to <html dir="rtl"> — some libs read
   document.body.dir, not document.documentElement.dir.
2. Explicit `direction: rtl` on html, body in the @layer base CSS.
3. <DirectionProvider dir="rtl"> from @radix-ui/react-direction wrapping
   the React tree, so every Radix primitive (Tabs, Dialog, Select,
   Popover, Toast) gets RTL context — Radix's useDirection defaults to
   "ltr" without it.
4. shadcn Tabs wrapper now defaults its dir prop to "rtl" — redundant
   with the provider above, but defends against a future provider
   removal silently breaking Tabs.
5. dir="rtl" set explicitly on each <table> element.

Fixes the symptom seen on the live site: deals/appraisals tables had
תאריך (the first <th> in the JSX) rendering on the LEFT instead of the
RIGHT, and Tabs flowed עסקאות→שמאי left-to-right instead of the
expected right-to-left.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

This commit is contained in:

Chaim Marcus

2026-04-25 13:51:19 +00:00

parent 97bbb852ec

commit 2924f716d4

8 changed files with 22 additions and 7 deletions

									
										web/package.json
									
		+1
		
												View File
												
				@@ -11,6 +11,7 @@

				    "lint": "eslint . --ext ts,tsx --max-warnings=0"

				  },

				  "dependencies": {

				    "@radix-ui/react-direction": "^1.1.1",

				    "@radix-ui/react-icons": "^1.3.2",

				    "@radix-ui/react-label": "^2.1.0",

				    "@radix-ui/react-slot": "^1.1.1",