RTL & Multilingual Support
Shaari is designed from the ground up to work seamlessly in both Arabic (RTL) and English (LTR). Every screen, form, table, dialog, and generated document supports both layout directions, ensuring a natural experience regardless of which language you prefer.
Supported Languages
Shaari currently supports two languages:
- Arabic (العربية) --- Right-to-left (RTL) layout
- English --- Left-to-right (LTR) layout
Every string in the application is translated. This includes navigation labels, form field names, button text, error messages, placeholder text, tooltips, and system notifications. There are no hardcoded English or Arabic strings in the interface.
Switching Languages
You can switch between Arabic and English at any time:
- Click on the language toggle in the top navigation bar (displayed as a globe icon or language abbreviation).
- Select your preferred language.
- The interface immediately reloads in the selected language and layout direction.
Your language preference is saved to your user profile and persists across sessions and devices. It also survives tenant switching --- your language preference is personal, not tied to any specific tenant.
You do not need to log out or refresh to switch languages. The change is instant and applies to the entire application immediately.
How the UI Mirrors for RTL
When Arabic is selected, Shaari does not simply translate text. The entire layout direction reverses to follow natural Arabic reading patterns:
Navigation
- The sidebar moves from the left side of the screen to the right.
- Menu items align to the right and expand toward the left.
- Breadcrumbs read from right to left.
Content Layout
- Text alignment switches to right-to-left throughout the application.
- Form fields and their labels align to the right.
- Tables reverse column order so the first column is on the right.
- Cards and grids flow from right to left.
Icons and Indicators
- Directional icons (arrows, chevrons, progress indicators) flip horizontally.
- Back/forward navigation arrows reverse to match RTL flow.
- Progress bars fill from right to left.
Spacing and Margins
- Padding and margins that are asymmetric (more on the left, less on the right) reverse automatically.
- Border radius adjustments ensure rounded corners appear on the correct side.
RTL support in Shaari is not a CSS afterthought. Every component is built with bidirectional layout as a core feature. The UI framework handles direction-aware spacing, alignment, and icon mirroring at the component level.
Bilingual Documents
Shaari generates several types of documents --- sales invoices, quotations, contracts, and reports. These documents support bilingual output:
Sales Invoices
Generated invoices include both Arabic and English text where appropriate. The company name, customer name, and line item descriptions can display in both languages if bilingual data has been entered. The invoice layout adapts to the selected language direction.
Quotations
Quotation PDFs include bilingual headers, terms, and line items. This is particularly useful for businesses that deal with both Arabic-speaking and English-speaking clients, or for compliance with Saudi regulations that require Arabic on official documents.
Contracts
Sales contracts render in the language of the active user's preference, with the option to generate bilingual versions that include both Arabic and English text side by side.
Reports and Exports
Exported CSV and PDF reports use the active language for column headers and labels. Numeric formatting (decimal separators, currency symbols) adjusts to regional conventions.
For generated documents to display bilingual content, you need to enter data in both languages where the system provides Arabic and English fields. For example, when creating a product, fill in both the Arabic name and the English name.
Translation Completeness
Shaari's translation covers the full application:
| Area | Coverage |
|---|---|
| Navigation and menus | 100% translated |
| Form labels and placeholders | 100% translated |
| Button text and actions | 100% translated |
| Error messages and validations | 100% translated |
| Tooltips and help text | 100% translated |
| Email notifications | 100% translated |
| System dialogs and confirmations | 100% translated |
| Generated PDF documents | Bilingual support |
| Admin dashboard | 100% translated |
If you encounter any untranslated string, it is considered a bug. Shaari maintains a comprehensive translation file that is validated against the complete set of application strings to ensure nothing is missed.
Input in Both Languages
Shaari supports input in both Arabic and English simultaneously. You can type Arabic text in one field and English text in another without switching any system-level keyboard or language setting. The application respects the text direction of the content you type, even within mixed-language forms.
Many fields that represent names or descriptions offer both an Arabic field and an English field:
- Company Name and Company Name (Arabic)
- Product Name and Product Name (Arabic)
- Customer Name and Customer Name (Arabic)
Filling in both fields ensures bilingual document generation works correctly.
Best Practices
Enter Data in Both Languages
Whenever a field offers Arabic and English variants, fill in both. This ensures documents, reports, and search results work well in either language.
Consistent Language for Your Role
Choose the language that matches your primary work language and stick with it. Switching frequently can be disorienting, especially when collaborating with team members who use the same language.
Test Documents in Both Directions
Before sending an invoice or quotation to a client, preview it in both Arabic and English modes to ensure the layout and content look correct in both directions.