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/index.html
									
		+1
		-1
	
												View File
												
				@@ -12,7 +12,7 @@

				      rel="stylesheet"

				    />

				  </head>

				  <body>

				  <body dir="rtl">

				    <div id="root"></div>

				    <script type="module" src="/src/main.tsx"></script>

				  </body>