Gene
  • Introduction
  • Folder Structure
  • Installation
  • Layouts
  • Translate App
  • Adding/Deleting Menu & Component
  • Adding Widgets in Component
  • Seed Project
  • Style Customization
  • RTL
  • Components
    • Chat
    • Calendar
    • Inbox
    • Editor
    • Material Icons
    • ng2 Chart
    • UI Component
    • Drag and Drop
    • Sortable js
    • Tables
      • Fullscreen
      • Selection
      • Pinning
      • Sorting
      • Paging
      • Editing
      • Filter
    • Forms
    • Maps
  • Deployment
  • Credits
  • Template Update
  • FAQ's (Frequently Asked Questions)
  • Changelog
  • Customer Support
    • Hire Us
Powered by GitBook
On this page

Was this helpful?

RTL

Gene provides you the ability to make the template display the RTL languages properly. You just need to read the below document carefully and implement the steps given.

RTL will help to display the RTL languages properly. To enable RTL in the template follow the steps given below:

Step 1: Simply open src->app->main->main-material.html file and add dir ="rtl" on the top of the div. Whole site will be reflected as RTL.

Add dir="rtl" to that div and remove [dir]="layout" from the div. As shown in code.

main.component.html
<div dir="rtl" id = "main-app" class="app {{isSidebarFilterClass}} {{isHeaderFilterClass}}" [ngClass]="{'app-dark': dark, 'boxed': boxed, 'collapsed-sidebar': collapseSidebar, 'compact-sidebar': compactSidebar, 'customizer-in': customizerIn}" [class.side-panel-opened]="coreService.sidenavOpen" [class.side-panel-closed]="!coreService.sidenavOpen">
   
   .....
   .....  
   
</div>
PreviousStyle CustomizationNextComponents

Last updated 6 years ago

Was this helpful?