RTL is not a CSS flip

Adding dir="rtl" to the html element takes five minutes and gets you about seventy percent of the way. The remaining thirty percent is where interfaces that were Persian-ified part company with interfaces that are Persian.

Which icons should mirror

The rule is simple: an icon depicting direction of travel mirrors; an icon depicting an object does not. A "next" arrow flips. A clock, a magnifier or a media play glyph does not. We encoded this as a utility class rather than relying on each developer remembering it.

Code and numerals

Code is always left-to-right, even inside a Persian paragraph. If you do not set direction on the code block, brackets and punctuation render in the wrong position — which turns copying a command into a genuine trap.

pre, code, kbd {
  direction: ltr;
  unicode-bidi: embed;
  text-align: left;
}

Logical properties

Drop margin-left and padding-right. margin-inline-start and padding-inline-end do the same job and are correct in both directions. It is the single change that removes the largest class of RTL bugs in one pass.