@sass-collective/direction - npm Package Compare versions

Comparing version 3.1.0 to 4.0.0

CHANGELOG.md

@@ -0,1 +1,19 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [4.0.0](https://github.com/sass-collective/sass-collective/compare/@sass-collective/direction@3.1.0...@sass-collective/direction@4.0.0) (2021-12-10)
+
+
+### ⚠ BREAKING CHANGES
+
+* **direction:** simplify tokens list
+
+### Features
+
+* **direction:** simplify tokens list ([b0e8614](https://github.com/sass-collective/sass-collective/commit/b0e8614d6b3f85f9faac553175e46ccde0da7f6b))
+
+
+
 # Release notes
@@ -2,0 +20,0 @@

package.json

 {
     "name": "@sass-collective/direction",
-    "version": "3.1.0",
+    "version": "4.0.0",
     "description": "Manage content direction for languages right-to-left or left-to-right rules.",
@@ -11,3 +11,3 @@ "main": "index.scss",
     "dependencies": {
-        "sass": "^1.38.0"
+        "sass": "^1.44.0"
     },
@@ -38,3 +38,3 @@ "files": [
     },
-    "gitHead": "f521a55ddc4a3fb4bcc411cdd7aca5c8c6b33819"
+    "gitHead": "d4916b5cc22de2247f4869abb3d1a66f429b8d94"
 }

README.md

@@ -1,6 +0,9 @@
-![Sass Direction](.github/banner.png)
+<div align="center">
 
+![Sass Direction](.github/logo.svg)
+
+</div>
+
 [![Version](https://flat.badgen.net/npm/v/@sass-collective/direction)](https://www.npmjs.com/package/@sass-collective/direction)
 [![Downloads](https://flat.badgen.net/npm/dt/@sass-collective/direction)](https://www.npmjs.com/package/@sass-collective/direction)
-[![Dependencies Status](https://david-dm.org/sass-collective/sass-collective/status.svg?style=flat-square&path=packages/direction)](https://david-dm.org/sass-collective/sass-collective?path=packages/direction)
 [![License](https://flat.badgen.net/github/license/sass-collective/sass-collective)](https://flat.badgen.net/github/license/sass-collective/sass-collective)
@@ -12,3 +15,3 @@
 
-## Installation
+## Installing
 
@@ -23,8 +26,27 @@ ```shell
 @use "@sass-collective/direction";
+```
 
+### Tokens
+
+| Key   | Description                                 |
+|-------|---------------------------------------------|
+| `ltr` | Sets CSS rules for left-to-right direction. |
+| `rtl` | Sets CSS rules for right-to-left 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...
+
+```scss
+@use "@sass-collective/direction";
+
 .foo {
-    margin-left: 20px;
-    margin-right: 0;
-
-    // rtl
     @include direction.styles {
@@ -35,10 +57,8 @@ margin-left: 0;
 
-    // ltr
-    @include direction.styles(left) {
-        margin-left: 0;
-        margin-right: 20px;
+    @include direction.styles(ltr) {
+        margin-left: 20px;
+        margin-right: 0;
     }
 
-    // root selector
-    @include direction.styles($root-selector: .bar) {
+    @include direction.styles($root-selector:. bar) {
         margin-left: 0;
@@ -50,11 +70,5 @@ margin-right: 20px;
 
-### Result
+...will produce the following CSS...
 
 ```css
-.foo {
-    margin-left: 20px;
-    margin-right: 0;
-}
-
-/** rtl **/
 [dir="rtl"] .foo {
@@ -65,9 +79,7 @@ margin-left: 0;
 
-/** ltr **/
 [dir="ltr"] .foo {
-    margin-left: 0;
-    margin-right: 20px;
+    margin-left: 20px;
+    margin-right: 0;
 }
 
-/** root selector **/
 [dir="rtl"] .bar .foo {
@@ -78,11 +90,1 @@ margin-left: 0;
 ```
-
-> **NOTE:** you can use the legacy `@import` with dedicated prefix, ex. `sass-direction-styles()`.
-
-## API
-
-### Mixins
-
-| Mixin | Description |
-| --- | --- |
-| `styles($direction, $root-selector)` | Create direction rule. |

No alert changes

Improved metrics

Total package byte prevSize

8455

increased by19.22%

Number of lines in readme file

85

increased by2.41%

Dependency changes

• Updatedsass@^1.44.0