Introduce stylelint (#600)

* introduce stylelint config

* run stylelint check on ci
This commit is contained in:
Konstantin Krivlenia
2020-02-16 11:25:59 -06:00
committed by GitHub
parent 1334048d89
commit 11327cee5b
23 changed files with 1505 additions and 47 deletions
+1 -1
View File
@@ -24,5 +24,5 @@ jobs:
- run: npm ci
working-directory: ./frontend
- run: npx run-p check lint test
- run: npx run-p check lint lint:style test
working-directory: ./frontend
+1 -1
View File
@@ -51,7 +51,7 @@ ARG NODE_ENV=production
COPY --from=build-frontend-deps /srv/frontend/node_modules /srv/frontend/node_modules
ADD frontend /srv/frontend
RUN cd /srv/frontend && \
if [ -z "$SKIP_FRONTEND_TEST" ] ; then npx run-p check lint test build ; \
if [ -z "$SKIP_FRONTEND_TEST" ] ; then npx run-p check lint lint:style test build ; \
else echo "skip frontend tests and lint" ; npm run build ; fi && \
rm -rf ./node_modules
+3 -1
View File
@@ -2,4 +2,6 @@ node_modules
public
!.prettierrc.js
!.eslintrc.js
!.babelrc.js
!.babelrc.js
!.lintstagedrc.js
!.stylelintrc.js
+5
View File
@@ -0,0 +1,5 @@
module.exports = {
'./**/*.{ts,tsx,js,jsx}': [`eslint --fix --max-warnings=0`, `git add`],
'./**/*.{scss,pcss,css}': ['prettier --write', 'stylelint', 'git add'],
'./iframe.html': ['prettier --write', 'stylelint', 'git add'],
};
+2
View File
@@ -0,0 +1,2 @@
node_modules
public
+13
View File
@@ -0,0 +1,13 @@
module.exports = {
extends: ['stylelint-config-standard', 'stylelint-config-prettier'],
rules: {
'max-empty-lines': 1,
'rule-empty-line-before': [
'always-multi-line',
{
except: ['first-nested'],
ignore: ['after-comment'],
},
],
},
};
@@ -36,7 +36,7 @@
margin-left: 0.1rem;
margin-bottom: 0.5rem;
&:before {
&::before {
content: '';
display: inline-block;
margin-right: 3px;
@@ -28,9 +28,11 @@
margin-top: 10px;
flex-grow: 1;
}
.comment-form__subscribe-by-email__preloader {
margin: 0 auto;
}
.comment-form__subscribe-by-email__token-input {
resize: vertical;
border: 1px solid #c4c4c4;
@@ -1,6 +1,7 @@
.comment-form__rss-dropdown {
text-align: left;
}
.comment-form__rss-dropdown__link {
font-weight: 700;
white-space: nowrap;
@@ -38,6 +38,7 @@
.comment-form__toolbar-item {
color: #ddd;
&:hover {
color: #0aa;
}
@@ -28,8 +28,6 @@
border-bottom: 1px solid #dfe2e5;
}
.suggesterItemDark {
border-bottom: 1px solid #333;
}
@@ -45,6 +43,7 @@
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.suggesterItem:last-child {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
@@ -7,11 +7,13 @@
display: none;
}
}
.comment__info {
margin-bottom: 0;
opacity: 0.8;
min-height: 20px;
}
.comment__avatar {
width: 20px;
height: 20px;
@@ -15,6 +15,7 @@
.comment__info {
padding-left: 8px;
}
.comment__body {
padding: 8px 8px 0;
}
@@ -32,6 +32,7 @@
.comment__edit-timer {
color: #a6a6a6;
+ .comment__controls {
&::before {
color: #eee;
@@ -32,6 +32,7 @@
.comment__edit-timer {
color: #a6a6a6;
+ .comment__controls {
&::before {
color: #777;
@@ -4,7 +4,7 @@
outline-width: 0;
display: none;
top: 100%;
left: 0%;
left: 0;
transform: translate(-0.5em, 5px);
min-width: 120px;
max-width: 260px;
@@ -25,6 +25,7 @@ pre {
.kd {
color: var(--chroma-07);
}
.kn,
.k,
.kc,
@@ -28,12 +28,13 @@
margin: 1rem 0;
&:first-child {
margin-top: 0rem;
margin-top: 0;
}
&:last-child {
margin-bottom: 0rem;
margin-bottom: 0;
}
/* imported comments have br instead of p */
br {
content: '';
@@ -66,7 +67,7 @@
margin-top: 0;
}
}
/* stylelint-disable-next-line no-descending-specificity */
blockquote {
padding: 12px 8px 12px 16px;
border-left: 2px solid;
@@ -6,7 +6,7 @@
left: -4px;
cursor: pointer;
&:after {
&::after {
display: block;
content: '';
position: absolute;
@@ -16,7 +16,7 @@
height: 100%;
}
&:hover:after {
&:hover::after {
transform: translateX(-1px);
border-left: 3px solid #777;
z-index: 10;
@@ -29,13 +29,12 @@
top: 12px;
left: 0;
display: flex;
border-radius: 2px;
text-align: center;
opacity: 0.8;
border-radius: 2px;
border: 1px solid;
&:after {
&::after {
display: none;
}
@@ -43,7 +42,7 @@
opacity: 1;
}
&:hover:after {
&:hover::after {
transform: translateX(0);
}
}
@@ -56,8 +55,8 @@
height: 2px;
border-bottom: 2px solid;
&:before,
&:after {
&::before,
&::after {
content: '';
width: 100%;
height: 2px;
@@ -66,7 +65,8 @@
top: -4px;
left: 0;
}
&:after {
&::after {
top: 4px !important;
}
}
@@ -1,10 +1,10 @@
.thread_theme_dark {
.thread__collapse {
&:after {
&::after {
border-color: #505050;
}
&:hover:after {
&:hover::after {
border-color: #fff;
}
}
+13 -7
View File
@@ -26,20 +26,24 @@
100% {
box-shadow: 0 10px 0 -10px;
}
40% {
box-shadow: 0 10px 0 0;
}
}
.preloader,
.preloader:before,
.preloader:after {
.preloader::before,
.preloader::after {
border-radius: 50%;
width: 10px;
height: 10px;
text-align: left;
animation-name: bouncing;
animation-timing-function: ease-in-out;
animation-fill-mode: both;
animation: bouncing 1.8s infinite ease-in-out;
animation-duration: 1.8s;
animation-iteration-count: infinite;
}
.preloader {
@@ -49,17 +53,19 @@
animation-delay: -0.16s;
}
.preloader:before,
.preloader:after {
.preloader::before,
.preloader::after {
content: '';
position: absolute;
top: 0;
}
.preloader:before {
.preloader::before {
transform: translate3d(-15px, 0, 0);
animation-delay: -0.32s;
}
.preloader:after {
.preloader::after {
transform: translate3d(15px, 0, 0);
}
+1436 -10
View File
File diff suppressed because it is too large Load Diff
+4 -10
View File
@@ -6,6 +6,7 @@
"start": "webpack-dev-server --mode development",
"check": "tsc -p tsconfig.json --noEmit --skipLibCheck",
"lint": "eslint --max-warnings=0 --ext=.ts,.tsx,.js,.jsx .",
"lint:style": "stylelint \"**/*.scss\" \"**/*.pcss\" \"**/*.css\" \"iframe.html\"",
"test": "jest",
"test:coverage": "jest --coverage",
"prettier": "prettier --write \"./**/*.{js,jsx,ts,tsx,scss}\""
@@ -17,16 +18,6 @@
"pre-push": "npm run check && npm test"
}
},
"lint-staged": {
"./**/*.{ts,tsx,js,jsx}": [
"eslint --fix --max-warnings=0",
"git add"
],
"./**/*.scss": [
"prettier --write",
"git add"
]
},
"devDependencies": {
"@babel/core": "^7.6.4",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
@@ -86,6 +77,9 @@
"prettier": "^1.19.1",
"redux-mock-store": "^1.5.3",
"style-loader": "^1.0.0",
"stylelint": "^13.1.0",
"stylelint-config-prettier": "^8.0.1",
"stylelint-config-standard": "^20.0.0",
"ts-jest": "^24.1.0",
"ts-loader": "^6.2.1",
"typescript": "^3.6.4",