Introduce stylelint (#600)
* introduce stylelint config * run stylelint check on ci
This commit is contained in:
@@ -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
@@ -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
|
||||
|
||||
|
||||
@@ -2,4 +2,6 @@ node_modules
|
||||
public
|
||||
!.prettierrc.js
|
||||
!.eslintrc.js
|
||||
!.babelrc.js
|
||||
!.babelrc.js
|
||||
!.lintstagedrc.js
|
||||
!.stylelintrc.js
|
||||
|
||||
@@ -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'],
|
||||
};
|
||||
@@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
public
|
||||
@@ -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'],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
+1
-1
@@ -36,7 +36,7 @@
|
||||
margin-left: 0.1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
&:before {
|
||||
&::before {
|
||||
content: '◄';
|
||||
display: inline-block;
|
||||
margin-right: 3px;
|
||||
|
||||
+2
@@ -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
@@ -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
@@ -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);
|
||||
}
|
||||
|
||||
|
||||
Generated
+1436
-10
File diff suppressed because it is too large
Load Diff
+4
-10
@@ -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",
|
||||
|
||||
Reference in New Issue
Block a user