README

Magento模块，帮助您为模块和主题的PHP和LESS源代码添加RTL支持

@import '_modrtl.less';

.sidebar-popup {
    .left(0);
    .modrtl(transform, translateX(-100%), translateX(100%));

    &.shown {
        transform: translateX(0);
    }

    .close {
        .right(0);
    }
}

内容

安装
使用方法
许可协议
鸣谢

安装

获取源代码

composer require swissup/module-rtl
bin/magento setup:upgrade

添加依赖项

如果您想在模块源代码中使用RTL混入，必须在模块或主题中添加一个需求

{
    "require": {
        "swissup/module-rtl": "^1.3.0"
    }
}

为mixins创建注入点

如果您想在源代码中使用RTL混入，这一步是必需的。

在您的模块或主题内部创建名为_modrtl.less的文件，并包含以下内容
```
// @modrtl
```
打开您的主less文件，导入创建的_modrtl.less文件，并保存它
```
@import '_modrtl.less';
```

使用方法

CSS类

当检测到当前语言为RTL时，模块会自动将rtl类名添加到body元素。这允许您在css/less文件中编写纯RTL特定样式

.my-element {
    right: 20px;
}
.rtl .my-element {
    right: auto;
    left: 20px;
}

虽然这种方法对小型文件来说很方便，但当处理大量需要调整的CSS时，它会变得头疼。此外，这种方法会使您的样式文件更大。

我们建议使用mixins以获得最佳体验。

Less混入

使用mixins需要注入点。

可以将一系列有用的mixins注入到您的less样式中！这种方法允许保持生成的CSS文件原始大小，并且不会因为RTL语言添加单独的样式而使源代码膨胀

@import '_modrtl.less';

.my-element {
    .right(20px); // Will generate "right: 20px;" for LTR, and "left: 20px;" for RTL.
}

不喜欢mixins？在& when语句中使用@modrtl-dir变量

@import '_modrtl.less';

.my-element {
    right: 20px;
}
& when (@modrtl-dir = rtl) {
    .my-element {
        right: auto;
        left: 20px;
    }
}

混入列表

PHP助手

需要服务器端RTL检测？将\Swissup\Rtl\Helper\Data注入到您的类中，并使用isRtl方法

// Check current locale
$helper->isRtl();

// Check custom locale
$helper->isRtl('en_US');

许可协议

在MIT许可协议下分发

鸣谢

混入来自anasnakawa/bi-app-sass。谢谢！

swissup / module-rtl

维护者

详细信息