Skip to content

Commit

Permalink
Merge pull request #57 from shelfio/feature/update-stylelint
Browse files Browse the repository at this point in the history
Update stylelint to v16
  • Loading branch information
Rafler authored Jun 18, 2024
2 parents 0a79c74 + fa436ce commit 4e2dc80
Show file tree
Hide file tree
Showing 13 changed files with 688 additions and 300 deletions.
2 changes: 1 addition & 1 deletion .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ version: 2.1
parameters:
node_version:
type: string
default: '16.15.1'
default: '20.11.1-browsers'

commands:
install_deps:
Expand Down
3 changes: 3 additions & 0 deletions .stylelintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"extends": "./index.js"
}
97 changes: 78 additions & 19 deletions __mocks__/invalid.css
Original file line number Diff line number Diff line change
@@ -1,31 +1,90 @@
.some-selector-custom-rules {
border-radius: 1px 2px 1px 2px;
font: 1em Times New Roman, Times, serif;
color: lch(56.29% 19.86 10 / 15%);
font-weight: bold;
/*This comment should fail due to lack of whitespace inside*/

/*color-no-invalid-hex*/
.invalid-color {
color: #zzzzzz;
}

/*alpha-value-notation*/
.alpha-value {
opacity: 50%;
display: -webkit-flex;
-webkit-transform: scale(1);
top: 0px;
background: #12345aa;
}

[title=flower] {
color: rgb(0 0 0)
/*color-function-notation*/
.color-function {
color: color(display-p3 0.5 0.4 0.3);
}

/*font-weight-notation*/
.font-weight {
font-weight: bold;
}

/*import-notation*/
@import url("styles.css");

/*selector-pseudo-element-colon-notation*/
::before {
content: '';
}

/*declaration-property-value-no-unknown*/
.unknown-property {
foo-bar: 42;
}

a::after { color: pink; }
/*max-nesting-depth*/
.nesting-1 {
.nesting-2 {
.nesting-3 {
.nesting-4 {
color: red;
}
}
}
}

/*selector-max-attribute*/
.max-attribute[class][data-attr][type][role] {
color: blue;
}

/*selector-max-combinators*/
.combinators-1 > .combinators-2 + .combinators-3 ~ .combinators-4 {
color: green;
}

/*selector-max-id*/
#id1 #id2 {
color: yellow;
}

:not(a):not(div) {
color: #ffffff;
/*selector-max-compound-selector*/
.compound1.compound2.compound3.compound4 {
color: purple;
}

@media (-o-max-device-pixel-ratio: 1/1) {}
/*selector-max-pseudo-class*/
.pseudo-class:hover:focus:active:checked {
color: orange;
}

@keyframes foo { from {} 100% {} }
/*selector-max-type*/
div span p ul {
color: brown;
}

@import url("foo.css");
/*selector-max-universal*/
* * {
color: pink;
}

input::-moz-placeholder {}
/*color-named*/
.named-color {
color: red;
}

@-ms-viewport { orientation: landscape; }
/*color-hex-alpha*/
.hex-alpha {
color: #ff000080;
}
93 changes: 75 additions & 18 deletions __mocks__/invalid.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,37 +4,94 @@
<meta charset="UTF-8">
<title>Title</title>
<style>
.some-selector-custom-rules {
border-radius: 1px 2px 1px 2px;
font: 1em Times New Roman, Times, serif;
color: lch(56.29% 19.86 10 / 15%);
font-weight: bold;
/*color-no-invalid-hex*/
.invalid-color {
color: #zzzzzz;
}

/*alpha-value-notation*/
.alpha-value {
opacity: 50%;
display: -webkit-flex;
-webkit-transform: scale(1);
top: 0px;
background: #12345aa;
}

[title=flower] {
color: rgb(0 0 0)
/*color-function-notation*/
.color-function {
color: color(display-p3 0.5 0.4 0.3);
}

/*font-weight-notation*/
.font-weight {
font-weight: bold;
}

/*import-notation*/
@import url("styles.css");

/*selector-pseudo-element-colon-notation*/
::before {
content: '';
}

/*declaration-property-value-no-unknown*/
.unknown-property {
foo-bar: 42;
}

a::after { color: pink; }
/*max-nesting-depth*/
.nesting-1 {
.nesting-2 {
.nesting-3 {
.nesting-4 {
color: red;
}
}
}
}

:not(a):not(div) {
color: #ffffff;
/*selector-max-attribute*/
.max-attribute[class][data-attr][type][role] {
color: blue;
}

@media (-o-max-device-pixel-ratio: 1/1) {}
/*selector-max-combinators*/
.combinators-1 > .combinators-2 + .combinators-3 ~ .combinators-4 {
color: green;
}

@keyframes foo { from {} 100% {} }
/*selector-max-id*/
#id1 #id2 {
color: yellow;
}

/*selector-max-compound-selector*/
.compound1.compound2.compound3.compound4 {
color: purple;
}

input::-moz-placeholder {}
/*selector-max-pseudo-class*/
.pseudo-class:hover:focus:active:checked {
color: orange;
}

@-ms-viewport { orientation: landscape; }
/*selector-max-type*/
div span p ul {
color: brown;
}

/*selector-max-universal*/
* * {
color: pink;
}

/*color-named*/
.named-color {
color: red;
}

/*color-hex-alpha*/
.hex-alpha {
color: #ff000080;
}
</style>
</head>
<body>
Expand Down
101 changes: 78 additions & 23 deletions __mocks__/invalid.scss
Original file line number Diff line number Diff line change
@@ -1,34 +1,89 @@
$var: "my-counter";
// This comment should fail due to lack of whitespace inside
.invalid-color {
// color-no-invalid-hex
color: #zzzzzz;
}

.some-selector-custom-rules {
border-radius: 1px 2px 1px 2px;
font: 1em Times New Roman, Times, serif;
color: lch(56.29% 19.86 10 / 15%);
font-weight: bold;
.alpha-value {
// alpha-value-notation
opacity: 50%;
display: -webkit-flex;
-webkit-transform: scale(1);
top: 0px;
background: #12345aa;
counter-reset: $var;

&[title=flower] {
color: rgb(0 0 0)
}
}

a::after { color: pink; }
.color-function {
// color-function-notation
color: color(display-p3 0.5 0.4 0.3);
}

.font-weight {
// font-weight-notation
font-weight: bold;
}

// import-notation
@import url("styles.css");

::before {
// selector-pseudo-element-colon-notation
content: '';
}

.unknown-property {
// declaration-property-value-no-unknown
foo-bar: 42;
}

&:not(a):not(div) {
color: #ffffff;
// max-nesting-depth
.nesting-1 {
.nesting-2 {
.nesting-3 {
.nesting-4 {
color: red;
}
}
}
}

@media (-o-max-device-pixel-ratio: 1/1) {}
// selector-max-attribute
.max-attribute[class][data-attr][type][role] {
color: blue;
}

@keyframes foo { from {} 100% {} }
// selector-max-combinators
.combinators-1 > .combinators-2 + .combinators-3 ~ .combinators-4 {
color: green;
}

@import url("foo.css");
// selector-max-id
#id1 #id2 {
color: yellow;
}

input::-moz-placeholder {}
// selector-max-compound-selector
.compound1.compound2.compound3.compound4 {
color: purple;
}

// selector-max-pseudo-class
.pseudo-class:hover:focus:active:checked {
color: orange;
}

// selector-max-type
div span p ul {
color: brown;
}

// selector-max-universal
* * {
color: pink;
}

// color-named
.named-color {
color: red;
}

@-ms-viewport { orientation: landscape; }
// color-hex-alpha
.hex-alpha {
color: #ff000080;
}
Loading

0 comments on commit 4e2dc80

Please sign in to comment.