What is rtl-aware-development?

A set of development rules for making web and desktop interfaces work correctly in both left-to-right and right-to-left writing directions. RTL is used by languages such as Arabic and Hebrew.

Use it when implementing or reviewing bidirectional layouts, CSS, menus, popovers, text fields, Electron title bars, and interfaces containing mixed scripts or unknown-direction text.

It prevents layouts, menus, scrolling, icons, mixed-language text, and window controls from behaving incorrectly when the interface direction changes.

rtl-aware-development — Skill by kylepelham

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods

npx agentmods add skills/kylepelham/drift/rtl-aware-development

Any agent

npx skills add kylepelham/Drift --skill rtl-aware-development

Clone the repo

git clone --depth 1 https://github.com/kylepelham/Drift

Made for: Claude Code, Codex.

Per session 48 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.

When invoked 977 The whole file, excluding the scripts and references it only reads on demand.

Security scan A 0 findings. Scan, not verified.

Origin 100% copy Near-identical to another mod in the catalogue.

Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

Model	Per session	Once invoked
Fable 5	$0.00048	$0.00977
Opus 5	$0.00024	$0.00489
Sonnet 5	$0.00010	$0.00195
Haiku 4.5	$0.00005	$0.00098

Measured yesterday against content hash 456d9a1c7fdb, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

rtl-aware-development scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured yesterday.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

Origin

This is a copy

100% identical to rtl-aware-development — 0 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.

engine/upstream/.opencode/skills/rtl-aware-development/SKILL.md · 64 lines

How it starts

The opening of the file, as written. The whole thing — 64 lines — stays where its author put it; the contents beside it link to each section on GitHub.

RTL-Aware Development

Treat direction as independent from language. Test English in both directions as well as real RTL and mixed-script content.

Guidelines

Set lang and dir on the document, and propagate direction through component providers used by portaled menus and popovers. Do not change the selected locale merely to force RTL.
Keep DOM and focus order semantic. Flexbox and Grid already follow dir; do not add row-reverse, CSS order, or reversed markup just to mirror a layout.
Prefer logical CSS for semantic layout. Reserve physical coordinates for pointer positions, canvas geometry, native window controls, and other genuinely physical placement.

/* Avoid */
padding-left: 12px;
right: 0;
border-right: 1px solid;
text-align: left;

/* Prefer */
padding-inline-start: 12px;
inset-inline-end: 0;
border-inline-end: 1px solid;
text-align: start;

Isolate mixed-direction text. Use dir="auto" or <bdi> for unknown text; keep code, URLs, IDs, and filesystem paths LTR without forcing the surrounding component LTR.

<span class="file-row"><bdi dir="auto">README.md</bdi></span> <bdi dir="ltr"><code>C:\src\app.ts</code></bdi>

Mirror directional meaning, not every image. Back/forward, previous/next, disclosure, indentation, and directional progress may need mirroring. Do not mirror brands, clocks, media controls, charts, or text. Reverse physical gradients, translateX, SVG transforms, and animation deltas explicitly.
Map interactions through direction. clientX remains physical; resizing a logical edge needs an RTL-aware delta. Logical previous/next keyboard controls may swap ArrowLeft/ArrowRight. Follow the relevant WAI-ARIA widget pattern.
Do not assume LTR scrolling. RTL scrollLeft can start at 0 and become negative. Prefer scrollIntoView({ inline: "nearest" }) or a tested direction-normalizing helper.
For Electron title bars, prefer native caption controls and use titleBarOverlay plus env(titlebar-area-*) for the safe content rectangle. Keep Windows/macOS native-control avoidance and trafficLightPosition physical; keep app navigation inside that rectangle logical. Mark interactive titlebar children app-region: no-drag.
Verify behavior, not screenshots alone. Check computed styles, pseudo-element geometry, hit zones, focus order, keyboard behavior, submenu direction, zoom/scaling, and both LTR and RTL scroll endpoints.

Read the full file on GitHub · 64 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

yesterday First seen · 64 lines · 48 tokens per session scan A 456d9a1c7fdb

Subscribe to this mod's changes

rtl-aware-development is a skill published in the GitHub repository kylepelham/Drift (20 stars, last pushed yesterday), licensed MIT. It adds 48 tokens to every session and 977 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. It is 100% identical to rtl-aware-development, differing in 0 lines, and is treated as a copy.

Frontend Languages Writing and docs ai coding-agent desktop mcp opencode rust

qa-testing

Verify your work by actually operating the app or website you changed, instead of assuming it works. Strongly recommended whenever you build, modify, or debug a web app, website, or desktop GUI app. Drive real browsers with the agent-browser CLI and native desktop apps with the cua-driver CLI. These are installed on…

openinterpreter/openinterpreter · 77 tokens

best-of-n

Generate a small set of independent candidate solutions in worktrees, judge them against one explicit rubric, and apply the winner only after PASS verification.

Hmbown/CodeWhale · 32 tokens

contributor-onboarding

Help a new contributor get productive on this checkout - inspect sync state against main, build, run the repository's exact verification gate, and produce a local what's-new digest. Never fetches, pulls, or modifies a dirty tree on its own. Explicit-only.

Hmbown/CodeWhale · 57 tokens

fleet-manager

Use when managing, triaging, restarting, escalating, or summarizing Codewhale Agent Fleet runs and workers.

Hmbown/CodeWhale · 26 tokens

handoff

Write a compact, decision-ready handoff so the next session (or the user) can continue without reconstructing the current one. Use when the session is ending, context is running low, the user asks for a handoff / "pass the baton" / "hand off", or a long-running operation needs a durable state checkpoint.

Hmbown/CodeWhale · 70 tokens

codew-release-qa-sweep

Use before claiming CodeWhale release work is done: run the full gate sweep and list the manual QA targets.

Hmbown/CodeWhale · 31 tokens