Поддержка RTL

UIkit 3 поддерживает языки RTL и позволяет переключать ориентацию всех элементов дизайна с LTR на RTL и обратно.

Версия RTL переключает ориентацию элементов дизайна UIkit, включая такие свойства, как float, text-align, position coordinates, direction of background shadows и другие. Все классы, имеющие явное имя *-left или *-right оставаются такими же в версии RTL. Примеры работы UIkit RTL.

Как использовать RTL в UIkit 3

В UIkit 3 имеется файл uikit.rtl.min.css, который располагается в папке dist/. Добавьте атрибут dir="rtl" к тегу <html> на вашем сайте. JavaScript поддерживает RTL по умолчанию, следовательно, ничего менять не нужно.

<!DOCTYPE html>
<html dir="rtl">
    <head>
        <title></title>
        <link rel="stylesheet" href="css/uikit.rtl.min.css" />
        <script src="js/uikit.min.js"></script>
    </head>
    <body>
    </body>
</html>

Взгляните на доступные компоненты и просто создайте разметку как обычно. При работе с версией RTL разметку менять не придется.

Компиляция из исходников

Если вы установили UIkit 3 из исходного кода Github, вы также можете скомпилировать RTL-версию UIkit самостоятельно.

Команда такая: 

yarn
yarn compile-rtl

Как всегда, файлы теперь располагаются в папке dist/. Файлы будет заканчиваться на *.rtl.css.