-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
The updated grouping keeps most properties in the same order as before, just a bit more organised. However, there are a few changes to the order, particularly - `text-overflow-*` (now grouped with overflow) - `text-decoration-*` (now grouped after basic text properties) - `list-style-*` (now grouped after text properties) - `outline-*` (now grouped before backgrounds and borders) - `transition-*` (now grouped after transform) The updated `groups.js` includes some placeholder comments for upcoming groups which gives these changes some additional context. Not adding any new properties in this version in order to make the changes to the order easier to track/notice. See #381
- Loading branch information
1 parent
884902b
commit 28d7eba
Showing
6 changed files
with
464 additions
and
120 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
--- | ||
'stylelint-config-recess-order': major | ||
--- | ||
|
||
Update property grouping | ||
|
||
Property order is generally the same, with a few groups being re-ordered or split up. [View the PR](https://github.com/stormwarning/stylelint-config-recess-order/pull/382) for details of all the changes, or [read the decision document](https://github.com/stormwarning/stylelint-config-recess-order/blob/main/docs/decisions/003-order-guidelines.md) for the rationale behind the change. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
--- | ||
'stylelint-config-recess-order': patch | ||
--- | ||
|
||
Sort out-of-order logical properties (Fixes #384) | ||
|
||
`overflow-inline` now comes before `overflow-block`. | ||
Scroll padding & margin block properties now come before the inline properties. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
--- | ||
'stylelint-config-recess-order': patch | ||
--- | ||
|
||
Remove duplicate `word-spacing` property (Fixes #361) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
--- | ||
'stylelint-config-recess-order': patch | ||
--- | ||
|
||
Remove invalid properties (Fixes #388) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,59 @@ | ||
# Title | ||
|
||
**Date:** 2025-01-17 | ||
|
||
**Issue:** [#381](https://github.com/stormwarning/stylelint-config-recess-order/issues/381) | ||
|
||
## Context | ||
|
||
New CSS properties are arriving thick and fast, and it's getting difficult to | ||
determine which group a given property should belong in. Some of the existing | ||
groups like "Typography" and "Interactions" are also getting a bit unwieldy. | ||
|
||
This document will describe the ordering strategy to be used. | ||
|
||
## Decision | ||
|
||
The initial order was based on the Recess setup; new properties should be added | ||
close to any existing properties which are related. | ||
|
||
Properties should be grouped by their associated [specification module]. If a | ||
property is part of multiple modules, keep the property in a position that | ||
results in the least amount of “shift” from the previous configuration. | ||
|
||
For properties relating to direction or the affected box edge, if there are | ||
only two possible directions the order should be horizontal then vertical. If | ||
there are four directions, the order should follow the TRBL pattern from the | ||
common shorthand order. See [logical direction order] for examples. | ||
|
||
The order of longhand properties should match the order of the same values in | ||
the shorthand version according to the spec. | ||
|
||
If properties can be ordered “naturally” they should be. For example: | ||
|
||
- `min` → `max` | ||
- `start` → `end` | ||
- `before` → `after`, etc. | ||
|
||
Vendor-prefixed properties should not be included. The exception being prefixed | ||
properties which are widely implemented but not part of an official spec. For | ||
example `-webkit-box-orient` (recognised by all browsers; used for multi-line | ||
truncation), or `-moz-osx-font-smoothing`. | ||
|
||
## Consequences | ||
|
||
While the order of individual properties is (generally) maintained, some groups | ||
have been re-ordered or split up; in particular: | ||
|
||
- `text-overflow-*` (now grouped with overflow) | ||
- `text-decoration-*` (now grouped after basic text properties) | ||
- `list-style-*` (now grouped after text properties) | ||
- `outline-*` (now grouped before backgrounds and borders) | ||
- `transition-*` (now grouped after transform) | ||
|
||
With the new ordering guidelines in place, this will (hopefully) be the last | ||
breaking change to the ordering for this package (major version updates may | ||
still occur due to version compatibility changes). | ||
|
||
[specification module]: https://www.w3.org/Style/CSS/current-work | ||
[logical direction order]: https://github.com/stormwarning/stylelint-config-recess-order/blob/main/docs/decisions/002-logical-direction-order.md |
Oops, something went wrong.