LogoLogo
  • Release Notes
  • Downloads
  • Frequently Asked Questions
  • Developers
    • Introduction
    • Color Variables
    • Font Family
    • Vanilla JS
    • React
    • Vue
    • Angular
    • RTL Support
    • Light Mode/Dark Mode
  • Foundations
    • Typography
    • Colors
    • Icons & Visuals
    • Images
    • Layout & Breakpoints
    • Utils
    • Usability Guidelines
  • Components
    • Accordions
      • Accordion
      • Accordion Groups
    • Alert
    • Attach File
    • Avatar
    • Banner Cards
    • Breadcrumbs
    • Buttons
      • Button
      • Icon Button
      • Link Button
      • Social Media Buttons
      • Split Button
    • Checkbox
      • Checkbox Input
      • Checkbox Groups
    • Chips
    • Credit Card
    • Credit Card Input Field
    • Header
    • Interactive Banner
    • Number Field
    • Menu
    • Pagination
    • Phone Number Field
    • Progress Indicators
      • Expectation Levels
      • Progress Bar
      • Progress Circle
      • Progress Semi-Circle
    • Quick Select Field
    • Radio Buttons
      • Radio Input
      • Radio Buttons Groups
    • Search Input Field
    • Segmentation
      • Segmented Controls
      • Segmented Tabs
    • Select Input Field
    • Slider
    • Steps
      • Stepper
      • Step Indicator
    • Sticky Bar
    • Tabs
    • Text Area Field
    • Text Field
    • Toggle Switch
    • Tooltip
Powered by GitBook
On this page
Export as PDF
  1. Developers

RTL Support

Our component library supports Right-to-Left (RTL) layouts, but RTL handling should be implemented on your side as a developer. To enable RTL, you need to set the dir="rtl" attribute on the <body> or relevant container element programmatically in your project.

<html lang="ar" dir="rtl">
<body>
  <dda-button></dda-button>
</body>
</html>
 <div dir="rtl">
      <DdaButton />
    </div>
<template>
  <div dir="rtl">
    <DdaButton />
  </div>
</template>
<div dir="rtl">
  <dda-button></dda-button>
</div>
PreviousAngularNextLight Mode/Dark Mode

Last updated 2 months ago