Firefox OS in Arabic

Numbers generally still run left to right (A). Military (24 hour) format is favored.

Date format order for Arabic is (from RTL) week day (“Monday”), numeric date of month (“23”), and year (“2015”) (B). Unlock and camera gestures remain the same in 2.2 (C).

Hint text will read right to left and is right-aligned. If the cursor is inserted, it will appear at the right (D).

The search icon is now left-aligned. App icons grid are right aligned, with any Arabic labels reading right to left (E). This is for the default homescreen display: user homescreen customizations and app grouping and organization should be maintained.

Labels that are English proper nouns (brand names) will remain left to right (LTR) in English (F).

Headers will read right to left and are right-aligned (E). Action menu items have right-aligned text reading right to left. Icons are also right-aligned (F).

Button text remains center-aligned, but reads right to left (G).

Titles are right-aligned and read right to left (A). Description text is right-aligned and reads right to left. Question marks should be mirrored (B), which should be handled automatically in the Arabic string translation.

Positioning of buttons is now swapped. Primary actions are now on the left, and “cancel” or “back” options are on the right. Text within the buttons remains center-aligned, but will read right to left (C).

Drawers remain left aligned (as per the back button in 2.2) (A). List items in drawers are right-aligned and read right to left (B) (see List Items). Content in drawer buttons are center-aligned (C).

Subheaders within drawers are right-aligned and read right to left (D). Visual tags in drawer list items are right-aligned. Words in LTR languages read left to right, but are still right-aligned. All other words read right to left (E) (see List Items).

Checkmark icons are now left-aligned but are not mirrored (F) (see Switches). Buttons that are direction-neutral keep their locations (G). Spinner icon direction (arrow, animation) does not change in 2.2.

The order of the queue in an LTR grid goes from left to right, top to bottom (A). The order of the queue in an RTL grid goes from right to left, top to bottom (B).

Subheaders separating grid sections are right-aligned and read right to left, except for numerals (C) (see Headers). Direction-neutral icons are neither mirrored nor relocated (D) (see Toolbars.)

Header titles are center-aligned and read right to left. No rich text should be used, so do not italicize (A). Subheaders are right-aligned and read right to left (B).

List items remain top down in order, but icons and text within are right-aligned. Note that icons are NOT mirrored, but text reads right to left (C) (see List Items). Toggles are now left-aligned, with ON to the right and OFF to the left. Note that the checkmark is NOT mirrored (D) (see Switches.)

“Back” buttons, “Cancel” buttons and “Drawer” icons do not change position in RTL configurations for the 2.2 release, remaining left aligned (E). Header titles in LTR languages remain center-aligned and read left to right (F). Arabic header text should truncate on the left. Icon buttons in headers do not change position (G).

Subheader labels are right-aligned and read right to left, but numerals read left to right (H). In-content labels, such as time-stamps, are right-aligned and read to left. In the case of time stamps, numerals for time read left to right and should be consistent with locale (I).

Header text is center-aligned, reads right to left, and is not italicized. “Cancel” buttons remain left-aligned in 2.2. “Done” buttons remain right-aligned in 2.2 (A).

Hint text in an input field is right-aligned and read right to left. Avoid italics (B). Labels are center-aligned and read right to left (C). Value selector buttons have right-aligned text that reads right to left. The triangle icon is left-aligned and mirrored. Also note that the position of the “X” is now at left (D).

Numerals typed into input fields are right-aligned but read left to right (E). Like value selectors, mirror text in buttons that are not center-aligned; text is right-aligned and reads right to left.

Input titles are right-aligned and read right to left. The “+” icon is again left-aligned (G). Text typed into an input area should be right-aligned and read right to left. Cursor placement and movement may vary.

“Send” or “accept” buttons are now at the left; if they contain text, text should be center-aligned and read right to left (H).

List items will always have right-aligned text, but direction of that text depends on language. RTL languages will read right to left; LTR languages read left to right. Visual tags are right-aligned (A).

Time stamps are left aligned and read right to left unless there are numerals. Numerals will read left to right. Time and date format may vary with locale (B). Appended icons are left-aligned (C). Icons in the toolbar do not change position or direction (D) (see Toolbar).

Controls (such as checkboxes, radio buttons, and toggles) in a list item are left-aligned (E). A modified icon (F), referred to as a chevron, replaces the previous “>” icon throughout the OS. The same chevron icon is used in in both LTR and RTL layouts.

If a list item has an icon, the icon is left-aligned in RTL layouts (G).

IMAGE PLACEHOLDER

Metadata is right-aligned and will read right to left or left to right depending on language. Since text is right-aligned, icon buttons will be left-aligned (A). Progress bars are mirrored so that the playhead progresses to the left, and played content is to right of the playhead.

Time played is displayed at the right; time left is displayed at the left (B) (see Sliders). Note that player controls do NOT change due to hardware legacy (C) and prior familiarity.

Spinner icons are left-aligned and and will not be mirrored in 2.2. Post 2.2, spinner icons will be mirrored and the corresponding animation direction will change (A).

Progress bars now animate right to left (B). If a progress bar has a “cancel” button, it should be left-aligned (C).

Scrollbars are now left-aligned, but still move vertically (A).

Index scrolling is still right-aligned (B) for ergonomic reasons: most people are right handed and can continue to index scroll with their right thumbs. Truncation should, as elsewhere, occur with the “end characters” in a word: RTL languages should truncate at left and LTR languages truncate at right (C).

Multilingual group and sort rules are technically complex to implement but are forthcoming.

Search fields contain a “magnifying glass” icon that is right-aligned. Text typed into the search field is right-aligned and reads right to left unless it is in an LTR language. “Clear” and “Cancel” buttons are left-aligned (A). Filtered results have right-aligned text (B).

Text typed in LTR languages reads left to right but is right-aligned (C).

Back buttons remain in the same position in both RTL and LTR (A). Toggles are now left-aligned; slide to the left to toggle ON and slide right to toggle OFF. Note that the checkmark is NOT mirrored (B).

Sliders are mirrored with maximums at the left and minimums at the right (C). Text in value selector buttons now reads right to left and is right-aligned. A modified icon (D), referred to as a chevron, replaces the previous “>” icon throughout the OS. The same (new) chevron icon is used in in both LTR and RTL layouts.

Checkboxes are left-aligned, but the checkmark itself is not mirrored (E).

The select mode header has center-aligned text and will read right to left exclusive of numerals. The “Cancel” button remains left-aligned, while the “Done” button remains right-aligned (A). Content is pushed off to the left. Checkmarks appear at the right.

Note that the checkmark icon is not mirrored (B). Toolbars are not mirrored; direction-neutral icons are also not mirrored (C).

Status Bar icons align left. Time display (A) is military (24 hour) format (as for the Lock screen). Battery, wifi and signal strength icons do not change (B). Dual SIM (1 and 2) slots and corresponding numbers do not change (B).