Open Bug 1626186 Opened 5 years ago Updated 2 years ago

Add RTL support for RDM

Categories

(DevTools :: Responsive Design Mode, enhancement)

enhancement

Tracking

(Not tracked)

People

(Reporter: itiel_yn8, Unassigned)

Details

(Keywords: rtl)

I'm not sure if that's a good idea to add RTL support for RDM, but in case it does, the following changes are required:

  1. Add dir="rtl" to the RDM's <html> if the UI is RTL
  2. Convert almost all of the CSS properties to logical ones in devtools/client/responsive/index.css and devtools/client/responsive/responsive-browser.css
  3. Set direction: ltr on viewport-dimension (dimensions should always be displayed as LTR), and align in to the start position in the custom device dialog
  4. Set the inputs in the custom device dialog to unicode-bidi: plaintext with a text-align: match-parent. Ditto for .device-label > span
  5. Mirror viewport-resize-handle for RTL and change its cursor property to nesw-resize. Make sure it appears on the left side of the tab
  6. When the viewport is set to be aligned to the left (actually right), make sure it actually does aligned to the right (is removing [1] enough?)
  7. Make sure resizers work after the above changes, with the side resizer being on the left
  8. Add in the comments for the responsive.settingOnboarding.content and responsive.settingOnboarding.content strings that "left" should be translated as "right" for RTL locales, and notify the RTL localizers of this change

[1] https://searchfox.org/mozilla-central/rev/fa2df28a49883612bd7af4dacd80cdfedcccd2f6/devtools/client/responsive/responsive-browser.css#62

Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.