JSPM – @sass-collective/direction@4.0.1

Package Exports

@sass-collective/direction
@sass-collective/direction/index.scss

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@sass-collective/direction) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Introduction

Manage content direction for languages right-to-left or left-to-right rules.

Installing

npm install @sass-collective/direction

Usage

@use "@sass-collective/direction";

Tokens

Key	Description
`rtl`	Sets CSS rules for `right-to-left` direction.
`ltr`	Sets CSS rules for `left-to-right` direction.

API

Sass mixins

Mixin	Description
`styles($direction, $root-selector)`	Sets direction rule with optional `$root-selector` option. Default `$direction` is `rtl`.

Add direction rule with `direction.styles()`

The following Sass...

@use "@sass-collective/direction";

.foo {
    @include direction.styles {
        margin-left: 0;
        margin-right: 20px;
    }

    @include direction.styles(ltr) {
        margin-left: 20px;
        margin-right: 0;
    }

    @include direction.styles($root-selector:. bar) {
        margin-left: 0;
        margin-right: 20px;
    }
}

...will produce the following CSS...

[dir="rtl"] .foo {
    margin-left: 0;
    margin-right: 20px;
}

[dir="ltr"] .foo {
    margin-left: 20px;
    margin-right: 0;
}

[dir="rtl"] .bar .foo {
    margin-left: 0;
    margin-right: 20px;
}

@sass-collective/direction