Skip to content

Commit 51fdb79

Browse files
philwarehamphilwareham
committed
Move from Sass-lint to stylelint
1 parent c57e375 commit 51fdb79

23 files changed

+1267
-197
lines changed

‎.stylelintrc.yml

Lines changed: 1063 additions & 0 deletions
Large diffs are not rendered by default.

‎Gruntfile.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -215,12 +215,12 @@ module.exports = function (grunt)
215215
}
216216
},
217217

218-
// Validate Sass files via sass-lint.
219-
sasslint: {
218+
// Validate CSS files via stylelint.
219+
stylelint: {
220220
options: {
221-
configFile: '.sass-lint.yml'
221+
configFile: '.stylelintrc.yml'
222222
},
223-
target: ['<%= paths.src.sass %>**/*.scss']
223+
src: ['<%= paths.src.sass %>**/*.{css,scss}']
224224
},
225225

226226
// Uglify and copy JavaScript files from `node_modules` and from `src/js/` to `public/assets/js/`.
@@ -280,7 +280,7 @@ module.exports = function (grunt)
280280

281281
// Register tasks.
282282
grunt.registerTask('build', ['clean', 'concurrent', 'replace', 'uglify']);
283-
grunt.registerTask('css', ['sasslint', 'sass', 'postcss']);
283+
grunt.registerTask('css', ['stylelint', 'sass', 'postcss']);
284284
grunt.registerTask('default', ['watch']);
285285
grunt.registerTask('travis', ['build']);
286286
};

‎package.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,12 @@
2323
"grunt-postcss": "0.9.0",
2424
"grunt-replace-regex": "1.0.3",
2525
"grunt-sass": "3.1.0",
26-
"grunt-sass-lint": "0.2.4",
26+
"grunt-stylelint": "0.11.0",
2727
"load-grunt-tasks": "5.1.0",
2828
"sass": "1.23.7",
29-
"sass-lint": "1.13.1"
29+
"stylelint": "12.0.0",
30+
"stylelint-order": "3.1.1",
31+
"stylelint-scss": "3.13.0"
3032
},
3133
"dependencies": {
3234
"createjs": "1.0.1",

‎src/assets/sass/amp.scss

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -14,31 +14,31 @@
1414
font-family: "PT Serif";
1515
font-style: normal;
1616
font-weight: normal;
17-
src: url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-regular.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-regular.woff") format("woff");
17+
src: url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-regular.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-regular.woff") format("woff");
1818
}
1919

2020
// Regular Italic
2121
@font-face {
2222
font-family: "PT Serif";
2323
font-style: italic;
2424
font-weight: normal;
25-
src: url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-italic.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-italic.woff") format("woff");
25+
src: url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-italic.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-italic.woff") format("woff");
2626
}
2727

2828
// Bold
2929
@font-face {
3030
font-family: "PT Serif";
3131
font-style: normal;
3232
font-weight: bold;
33-
src: url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-700.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-700.woff") format("woff");
33+
src: url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-700.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-700.woff") format("woff");
3434
}
3535

3636
// Bold Italic
3737
@font-face {
3838
font-family: "PT Serif";
3939
font-style: italic;
4040
font-weight: bold;
41-
src: url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-700italic.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v9-latin-ext-700italic.woff") format("woff");
41+
src: url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-700italic.woff2") format("woff2"), url("https://textpattern.com/assets/fonts/pt-serif-v11-latin-ext-700italic.woff") format("woff");
4242
}
4343

4444
html {
@@ -122,33 +122,33 @@ samp {
122122

123123
pre {
124124
padding: 0.5714286em 1.1428571em; // 8px / 14px + 16px / 14px
125-
word-wrap: normal;
126125
overflow-x: auto;
126+
word-wrap: normal;
127127
tab-size: 4;
128128

129129
code {
130130
padding: 0;
131131
border: 0;
132132
background-color: transparent;
133+
direction: ltr;
133134
font-size: 1em; // 14px
135+
hyphens: none;
134136
text-align: left;
135-
white-space: pre;
136-
word-spacing: normal;
137-
word-break: normal;
138137
word-wrap: normal;
139-
direction: ltr;
140-
hyphens: none;
138+
word-break: normal;
139+
word-spacing: normal;
140+
white-space: pre;
141141
}
142142
}
143143

144144
hr {
145+
box-sizing: content-box;
145146
height: 24px;
146147
margin: 1em 0;
148+
overflow: visible;
147149
border: 0; // remove the default `hr` border
148150
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 24'%3E%3Cpath fill='%23333' d='M0,0c1.742,13.61,54.74,20.912,119.995,15.279C184.922,9.679,238.594,13.024,240,24c-1.744-13.613-54.742-20.913-120.005-15.284C55.078,14.32,1.405,10.973,0,0z'/%3E%3C/svg%3E") 50% 50% no-repeat;
149151
background-size: 240px 24px;
150-
overflow: visible;
151-
box-sizing: content-box;
152152
}
153153

154154
.container {
@@ -161,12 +161,12 @@ hr {
161161

162162
.site-header {
163163
position: fixed;
164+
z-index: 10;
164165
top: 0;
165166
right: 0;
166167
left: 0;
167168
border-bottom: 2px solid $color-text;
168169
background-color: $color-background;
169-
z-index: 10;
170170
}
171171

172172
.open-sidebar,
@@ -193,28 +193,28 @@ hr {
193193
@include gradient-linear($color-button-primary-gradient-from, $color-button-primary-gradient-to);
194194

195195
display: inline-block;
196+
box-sizing: border-box;
196197
height: 2.5em; // 40px / 16px
197198
margin: 0;
198199
padding: 0.5em 1em; // 8px / 16px
199200
border: 1px solid $color-button-primary-border;
200201
border-radius: 1.25em;
201202
background-clip: padding-box;
203+
box-shadow: 0 2px 0 $color-button-primary-shadow;
202204
color: $color-text-button;
203205
font-weight: bolder;
204206
line-height: 1.375; // 22px / 16px
205-
box-shadow: 0 2px 0 $color-button-primary-shadow;
206-
cursor: pointer; /* 1 */
207207
vertical-align: baseline;
208-
appearance: none; /* 2 */
209-
box-sizing: border-box;
208+
appearance: none;
209+
cursor: pointer;
210210

211211
&:active {
212212
position: relative;
213213
top: 2px;
214214
border-color: darken($color-button-primary-border, 13%);
215+
box-shadow: none;
215216
color: $color-text-button-active;
216217
text-decoration: none;
217-
box-shadow: none;
218218
}
219219
}
220220

@@ -262,9 +262,9 @@ amp-sidebar {
262262
height: 1px;
263263
margin: -1px;
264264
padding: 0;
265-
border: 0;
266-
white-space: nowrap;
267265
overflow: hidden;
268266
clip: rect(0 0 0 0); // TODO: Deprecated - use `clip-path` when browser support is better.
269267
//clip-path: inset(50%); // TODO: Currently causes severe performance issues in Chrome.
268+
border: 0;
269+
white-space: nowrap;
270270
}

‎src/assets/sass/designpatterns.scss

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -261,18 +261,18 @@ $dark-colors: (
261261

262262
.docs-menu {
263263
position: fixed;
264+
z-index: 2000;
264265
top: 0;
265266
bottom: 0;
266267
left: 0;
268+
box-sizing: border-box;
267269
width: 29%;
268270
padding: 0.5em 2%;
271+
overflow-x: hidden;
272+
overflow-y: auto;
269273
border-right: 1px solid $color-border;
270274
background-color: $color-background-box;
271275
box-shadow: inset -0.25em 0 0.25em -0.25em rgba(0, 0, 0, 0.2);
272-
z-index: 2000;
273-
overflow-x: hidden;
274-
overflow-y: auto;
275-
box-sizing: border-box;
276276
}
277277

278278
.docs-content {

‎src/assets/sass/modules/_base.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,9 @@ nav ul,
3737
nav ol,
3838
.clearfix {
3939
&::after {
40+
content: "";
4041
display: table;
4142
clear: both;
42-
content: "";
4343
}
4444
}
4545

‎src/assets/sass/modules/_blog.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@
8484
}
8585

8686
// Put a bit more margin on 2nd category link, if it exists (for better touch accessibility).
87+
8788
a + a {
8889
margin-left: 0.25em;
8990
}

‎src/assets/sass/modules/_breadcrumbs.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,14 +16,15 @@
1616
margin: 0 -1.3333333em;
1717
padding: 0.5em 1.3333333em; // 6px / 12px + 16px / 12px
1818
background-color: $color-background-box;
19-
font-size: $small-font-size;
2019
list-style: none;
20+
font-size: $small-font-size;
2121

2222
li {
2323
display: inline-block;
2424
}
2525

2626
// Path-like breadcrumb styling.
27+
2728
> li + li::before {
2829
content: "\00A0" "\002F" "\00A0";
2930
}

‎src/assets/sass/modules/_buttons.scss

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ button::-moz-focus-inner,
2222
}
2323

2424
/**
25-
* 1. Improve usability and consistency of cursor style between image-type
25+
* 1. Remove browser-specific default styling.
26+
* 2. Improve usability and consistency of cursor style between image-type
2627
* `input` and others.
27-
* 2. Remove browser-specific default styling.
2828
*/
2929

3030
button,
@@ -42,12 +42,12 @@ button,
4242
border: 1px solid $color-button-border;
4343
border-radius: 1em;
4444
background-clip: padding-box;
45+
box-shadow: 0 2px 0 $color-button-shadow;
4546
color: $color-text-button;
4647
font-weight: normal;
4748
text-align: center;
48-
box-shadow: 0 2px 0 $color-button-shadow;
49-
cursor: pointer; /* 1 */
50-
appearance: none; /* 2 */
49+
appearance: none; /* 1 */
50+
cursor: pointer; /* 2 */
5151
user-select: none;
5252

5353
&:hover {
@@ -61,9 +61,9 @@ button,
6161
&:active {
6262
top: 2px;
6363
border-color: shade($color-button-border, 15%);
64+
box-shadow: none;
6465
color: $color-text-button-active;
6566
text-decoration: none;
66-
box-shadow: none;
6767
}
6868

6969
&:focus {
@@ -84,8 +84,8 @@ button,
8484
@include gradient-linear($color-button-primary-gradient-from, $color-button-primary-gradient-to);
8585

8686
border-color: $color-button-primary-border;
87-
font-weight: bolder;
8887
box-shadow: 0 2px 0 $color-button-primary-shadow;
88+
font-weight: bolder;
8989

9090
&:hover {
9191
@include gradient-linear(lighten($color-button-primary-gradient-from, 6%), lighten($color-button-primary-gradient-to, 6%));

‎src/assets/sass/modules/_code-highlighting.scss

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@
33

44
code[class*="language-"],
55
pre[class*="language-"] {
6-
text-align: left;
7-
white-space: pre;
8-
word-spacing: normal;
9-
word-break: normal;
10-
word-wrap: normal;
116
direction: ltr;
127
hyphens: none;
8+
text-align: left;
9+
word-wrap: normal;
10+
word-break: normal;
11+
word-spacing: normal;
12+
white-space: pre;
1313
}
1414

1515
/**
@@ -123,16 +123,16 @@ pre.line-numbers > code {
123123

124124
.line-numbers-rows > span {
125125
display: block;
126-
pointer-events: none;
127126
counter-increment: linenumber;
127+
pointer-events: none;
128128
}
129129

130130
.line-numbers-rows > span::before {
131+
content: counter(linenumber);
131132
display: block;
132133
padding-right: 0.8em;
133134
color: #999999;
134135
text-align: right;
135-
content: counter(linenumber);
136136
}
137137

138138
@include dark-mode {

0 commit comments

Comments
 (0)