⚙️ Add stylelint and base configuration (see #74) (#92)

* tooling: add stylelint and base configuration (see #74)

* Autofix with stylelint on commit
This commit is contained in:
Ned Zimmerman 2020-03-07 11:23:05 -07:00 committed by GitHub
parent ca07ab31f6
commit 86713728a4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
18 changed files with 1593 additions and 53 deletions

13
.stylelintrc Normal file
View File

@ -0,0 +1,13 @@
{
"extends": "stylelint-config-recommended-scss",
"plugins": [
"stylelint-order"
],
"rules": {
"order/order": [
"custom-properties",
"declarations"
],
"order/properties-alphabetical-order": true
}
}

View File

@ -2,8 +2,8 @@ body {
border-top: 1rem solid $primary-color;
font-family: $sans-serif;
font-size: pxToRem(20);
padding: 2rem;
margin: 0;
padding: 2rem;
}
h1 {
@ -15,22 +15,22 @@ h1,
h2,
h3,
h4 {
margin-top: 1em;
margin-bottom: 0.5em;
margin-top: 1em;
}
p {
margin: 0.75rem 0;
font-size: 1.25rem;
line-height: 1.25;
margin: 0.75rem 0;
}
a {
text-decoration: none;
color: $black;
border-bottom: $dark-grey solid 0.1em;
color: $black;
font-family: $ext-sans;
margin: 1rem 0;
text-decoration: none;
&:hover {
border-bottom: $primary-color solid 0.1rem;
@ -44,16 +44,16 @@ a {
code {
background-color: $dark-grey;
border: 1px solid $black;
color: $white;
padding: 0.15em;
border-radius: 0.25em;
color: $white;
font-size: 95%;
padding: 0.15em;
pre & {
border: none;
padding: 0;
border-radius: 0;
font-size: inherit;
padding: 0;
}
}

View File

@ -1,6 +1,6 @@
.subtitle {
font-family: $ext-sans;
font-weight: $regular;
letter-spacing: 0.1;
grid-column: span 2;
letter-spacing: 0.1;
}

View File

@ -1,21 +1,20 @@
.word__type {
text-align: right;
padding-right: 1rem;
font-family: $con-sans;
font-size: 0.85rem;
padding-right: 1rem;
text-align: right;
text-transform: uppercase;
}
.word__link {
text-decoration: none;
color: black;
border-bottom: darkgrey solid 0.1em;
color: black;
font-family: $ext-sans;
text-decoration: none;
}
.word__breakdown {
font-family: $sans-serif;
border-left: 0.1rem solid lightgrey;
font-family: $sans-serif;
padding-left: 1rem;
}

View File

@ -1,10 +1,10 @@
.flag__red {
background-color: rgb(255, 192, 203);
border-radius: 1rem;
font-size: 0.9rem;
font-weight: bold;
border-radius: 1rem;
padding: 0.45rem 0.65rem;
margin: 0.25rem 0.75rem;
padding: 0.45rem 0.65rem;
text-transform: lowercase;
&:before {

View File

@ -1,6 +1,6 @@
ol {
padding: 0 0 0 1em;
margin: 0;
padding: 0 0 0 1em;
}
li {
@ -22,9 +22,9 @@
}
.list-semicolon {
list-style: none;
margin: 0;
padding: 0;
list-style: none;
& > li {
display: inline;

View File

@ -3,8 +3,8 @@
&__title {
font-family: $serif;
font-weight: 900;
font-size: 2.5rem;
font-weight: 900;
line-height: 1.25;
margin-bottom: 1rem;
margin-top: 0;
@ -16,8 +16,8 @@
@supports (display: grid) {
// align-items: flex-start;
display: grid;
grid-template-columns: 1fr 4fr;
grid-gap: 1rem;
grid-template-columns: 1fr 4fr;
& > * {
margin: 0;
@ -25,17 +25,17 @@
}
& > p {
grid-column: 1 / -1;
font-family: $sans-serif;
font-size: 1.5rem;
grid-column: 1 / -1;
}
& h4 {
grid-column: 1;
flex: 0 1 auto;
font-family: $con-sans;
font-size: 0.85rem;
font-weight: normal;
flex: 0 1 auto;
grid-column: 1;
text-transform: uppercase;
transform: translateY(0.4em);
@ -51,16 +51,16 @@
& h4 ~ p,
& h4 ~ ul {
font-size: inherit;
// border-left: 0.1rem solid lightgrey;
// padding-left: 1rem;
grid-column: 2;
font-size: inherit;
}
}
&__speech {
font-size: 0.5em;
font-family: $sans-serif;
font-size: 0.5em;
}
&__signal {
@ -68,10 +68,10 @@
color: var(--word-signal-color);
display: inline-block;
font-family: $ext-sans;
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.15rem;
padding: 0.5rem 0.75rem;
text-transform: uppercase;
&--avoid {
--word-signal-color: #a40000;

View File

@ -5,19 +5,19 @@
.grid {
display: grid;
grid-column-gap: 4rem;
grid-row-gap: 10rem;
grid-template-columns: repeat(4, [col] 1fr [col]);
grid-template-rows: fit-content, fit-content, auto;
grid-row-gap: 10rem;
grid-column-gap: 4rem;
}
.auto-grid {
display: grid;
grid-gap: var(--l-gap);
grid-template-columns: repeat(
auto-fill,
minmax(var(--auto-grid-min-size), 1fr)
);
grid-gap: var(--l-gap);
}
.small-left-grid {
@ -30,23 +30,23 @@
}
.block__dictionary {
max-width: 50rem;
margin-left: auto;
margin-right: auto;
max-width: 50rem;
padding: 0 1rem;
}
.block__word {
grid-column: span 2;
display: flex;
flex-direction: column;
grid-column: span 2;
margin: 1rem;
}
.block__type {
align-items: flex-start;
display: grid;
grid-template-columns: 1fr 4fr;
align-items: flex-start;
}
.page {
@ -62,9 +62,9 @@
.box {
background: black;
color: white;
padding: 1rem;
margin: 1rem 0.5rem;
height: auto;
margin: 1rem 0.5rem;
padding: 1rem;
a {
color: white;

View File

@ -2,8 +2,8 @@
// a sensible base font size
font-size: 3rem;
line-height: 0.75;
padding: 0;
margin: 0.5rem 0rem;
padding: 0;
// transform: rotateZ(90deg);
// margin: 13rem -7rem;
}
@ -35,8 +35,8 @@
}
.sub-headline {
font-weight: bold;
font-size: 1.25rem;
font-weight: bold;
}
.summary {

View File

@ -0,0 +1 @@
// TODO: Add themes.

1519
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -9,7 +9,8 @@
"build:site": "eleventy",
"build": "npm run build:css && npm run build:site",
"create-definitions": "bin/create-definitions",
"lint": "npm run lint:js",
"lint": "npm run lint:css && npm run lint:js",
"lint:css": "stylelint \"assets/css/**/*.scss\"",
"lint:js": "eslint \"11ty/**/*.js\"",
"serve": "concurrently \"npm run serve:site\" \"npm run watch:css\"",
"serve:site": "eleventy --serve",
@ -42,6 +43,9 @@
"11ty/**/*.js": [
"npm run lint:js -- --fix",
"npm run test"
],
"assets/css/**/*.scss": [
"npm run lint:css -- --fix"
]
},
"dependencies": {
@ -62,6 +66,10 @@
"parcel-bundler": "^1.12.4",
"prettier": "^1.19.1",
"sass": "^1.23.7",
"slugify": "^1.3.6"
"slugify": "^1.3.6",
"stylelint": "^13.2.0",
"stylelint-config-recommended-scss": "^4.2.0",
"stylelint-order": "^4.0.0",
"stylelint-scss": "^3.14.2"
}
}