Taiga UI 5.0 is out!

RTL

Taiga UI supports setting dir="rtl" to implement right-to-left (RTL) layouts. This is particularly useful for languages that are read from right to left, such as Arabic or Hebrew.

Variables

There are a few CSS variables that would be helpful for you when implementing bidirectional interfaces
Use --tui-inline variable
When you need to flip calc()
Use --tui-inline-start/end variable
When you need direction in gradients etc
    
      
    

      
      
    

  
    
      <div tuiCell>
    <tui-icon icon="@tui.chevron-right" />
    <div tuiTitle>
        <div>
            Use
            <code>--tui-inline</code>
            variable
        </div>
        <div tuiSubtitle>
            When you need to flip
            <code>calc()</code>
        </div>
    </div>
</div>

<div tuiCell>
    <div tuiTitle>
        <div>
            Use
            <code>--tui-inline-start/end</code>
            variable
        </div>
        <div tuiSubtitle>When you need direction in gradients etc</div>
    </div>
</div>

    

      
      
    

  
    
      tui-icon {
    transform: scaleX(var(--tui-inline));
}

[tuiCell]:last-child {
    background: linear-gradient(to var(--tui-inline-end), transparent, var(--tui-background-neutral-1));
    box-shadow: calc(0.25rem * var(--tui-inline)) 0 0 var(--tui-background-neutral-2);
}
GitHub StackBlitz