From 5098519d46eb799dbb9392edc8d538f5171b178e Mon Sep 17 00:00:00 2001 From: Chocobo1 Date: Tue, 21 Jan 2025 13:03:07 +0800 Subject: [PATCH 1/3] WebUI: enable cache for lint checks Also, WebUI gets its own .gitignore file. --- .gitignore | 4 ---- src/webui/www/.gitignore | 5 +++++ src/webui/www/package.json | 2 +- 3 files changed, 6 insertions(+), 5 deletions(-) create mode 100644 src/webui/www/.gitignore diff --git a/.gitignore b/.gitignore index c928583ee..17b925842 100644 --- a/.gitignore +++ b/.gitignore @@ -41,7 +41,3 @@ src/icons/skin/build-icons/icons/*.png # CMake build directory build/ - -# Web UI tools -node_modules -package-lock.json diff --git a/src/webui/www/.gitignore b/src/webui/www/.gitignore new file mode 100644 index 000000000..2f85f13cb --- /dev/null +++ b/src/webui/www/.gitignore @@ -0,0 +1,5 @@ +# Web UI tools +.eslintcache +.stylelintcache +node_modules +package-lock.json diff --git a/src/webui/www/package.json b/src/webui/www/package.json index 818d48738..7149a8628 100644 --- a/src/webui/www/package.json +++ b/src/webui/www/package.json @@ -7,7 +7,7 @@ }, "scripts": { "format": "js-beautify -r *.mjs private/*.html private/scripts/*.js private/views/*.html public/*.html public/scripts/*.js && prettier --write **.css", - "lint": "eslint *.mjs private/*.html private/scripts/*.js private/views/*.html public/*.html public/scripts/*.js && stylelint **/*.css && html-validate private public" + "lint": "eslint --cache *.mjs private/*.html private/scripts/*.js private/views/*.html public/*.html public/scripts/*.js && stylelint --cache **/*.css && html-validate private public" }, "devDependencies": { "@stylistic/eslint-plugin": "*", From e3eacf2bf76c179e324fe69142c3d1072f7ba271 Mon Sep 17 00:00:00 2001 From: Chocobo1 Date: Tue, 21 Jan 2025 14:45:17 +0800 Subject: [PATCH 2/3] WebUI: migrate stylelint config file format From https://stylelint.io/user-guide/configure : >Stylelint currently supports other configuration locations and formats, but we may remove these >in the future: >... >.stylelintrc.json file --- src/webui/www/.stylelintrc.json | 19 ------------------- src/webui/www/stylelint.config.mjs | 19 +++++++++++++++++++ 2 files changed, 19 insertions(+), 19 deletions(-) delete mode 100644 src/webui/www/.stylelintrc.json create mode 100644 src/webui/www/stylelint.config.mjs diff --git a/src/webui/www/.stylelintrc.json b/src/webui/www/.stylelintrc.json deleted file mode 100644 index 55324a0dd..000000000 --- a/src/webui/www/.stylelintrc.json +++ /dev/null @@ -1,19 +0,0 @@ -{ - "extends": "stylelint-config-standard", - "plugins": [ - "stylelint-order" - ], - "ignoreFiles": ["private/css/lib/*.css"], - "rules": { - "color-hex-length": null, - "comment-empty-line-before": null, - "comment-whitespace-inside": null, - "function-name-case": null, - "length-zero-no-unit": null, - "no-descending-specificity": null, - "order/properties-alphabetical-order": true, - "selector-class-pattern": null, - "selector-id-pattern": null, - "value-keyword-case": null - } -} diff --git a/src/webui/www/stylelint.config.mjs b/src/webui/www/stylelint.config.mjs new file mode 100644 index 000000000..712f9f844 --- /dev/null +++ b/src/webui/www/stylelint.config.mjs @@ -0,0 +1,19 @@ +export default { + extends: "stylelint-config-standard", + plugins: [ + "stylelint-order" + ], + ignoreFiles: ["private/css/lib/*.css"], + rules: { + "color-hex-length": null, + "comment-empty-line-before": null, + "comment-whitespace-inside": null, + "function-name-case": null, + "length-zero-no-unit": null, + "no-descending-specificity": null, + "order/properties-alphabetical-order": true, + "selector-class-pattern": null, + "selector-id-pattern": null, + "value-keyword-case": null + } +}; From dc8ac3849498d6a95c115e183c2db6d4b35b16c3 Mon Sep 17 00:00:00 2001 From: Chocobo1 Date: Tue, 21 Jan 2025 14:56:13 +0800 Subject: [PATCH 3/3] WebUI: revise lint rules for css Some rules are already covered by other tools, so remove them. --- src/webui/www/private/css/Window.css | 22 +++++++++---------- src/webui/www/private/css/dynamicTable.css | 8 +++---- src/webui/www/private/css/noscript.css | 2 +- src/webui/www/private/css/style.css | 18 +++++++-------- .../www/private/css/vanillaSelectBox.css | 10 ++++----- src/webui/www/public/css/login.css | 2 +- src/webui/www/public/css/noscript.css | 2 +- src/webui/www/stylelint.config.mjs | 5 +---- 8 files changed, 33 insertions(+), 36 deletions(-) diff --git a/src/webui/www/private/css/Window.css b/src/webui/www/private/css/Window.css index 865fc8051..9aeaf365f 100644 --- a/src/webui/www/private/css/Window.css +++ b/src/webui/www/private/css/Window.css @@ -99,7 +99,7 @@ div.mochaToolbarWrapper.bottom { } .mocha .handle { - background: #0f0; + background: #00ff00; font-size: 1px; /* For IE6 */ height: 3px; opacity: 0; @@ -111,7 +111,7 @@ div.mochaToolbarWrapper.bottom { /* Corner resize handles */ .mocha .corner { - background: #f00; + background: #ff0000; height: 10px; width: 10px; } @@ -229,7 +229,7 @@ div.mochaToolbarWrapper.bottom { /* Underlay */ #windowUnderlay { - background: #fff; + background: #ffffff; left: 0; position: fixed; top: 0; @@ -276,18 +276,18 @@ div.mochaToolbarWrapper.bottom { /* Modals */ .modal2 { - border: 8px solid #fff; + border: 8px solid #ffffff; } .modal2 .mochaContentBorder { - border-width: 0px; + border-width: 0; } /* Window Themes */ .mocha.no-canvas { background: #e5e5e5; - border: 1px solid #555; + border: 1px solid #555555; } .mocha.no-canvas .mochaTitlebar { @@ -295,7 +295,7 @@ div.mochaToolbarWrapper.bottom { } .mocha.transparent .mochaTitlebar h3 { - color: #fff; + color: #ffffff; display: none; } @@ -312,7 +312,7 @@ div.mochaToolbarWrapper.bottom { } .mocha.notification .mochaContentBorder { - border-width: 0px; + border-width: 0; } .mocha.notification .mochaContentWrapper { @@ -345,12 +345,12 @@ div.mochaToolbarWrapper.bottom { } .jsonExample .mochaTitlebar h3 { - color: #ddd; + color: #dddddd; } /* This does not work in IE6. */ .isFocused.jsonExample .mochaTitlebar h3 { - color: #fff; + color: #ffffff; } #fxmorpherExample .mochaContentWrapper { @@ -358,7 +358,7 @@ div.mochaToolbarWrapper.bottom { } #clock { - background: #fff; + background: #ffffff; } /* Workaround to make invisible buttons clickable */ diff --git a/src/webui/www/private/css/dynamicTable.css b/src/webui/www/private/css/dynamicTable.css index 2cc9c7626..be391f77e 100644 --- a/src/webui/www/private/css/dynamicTable.css +++ b/src/webui/www/private/css/dynamicTable.css @@ -105,10 +105,10 @@ div:has(> div.dynamicTableFixedHeaderDiv):not(.invisible) { } .dynamicTableDiv thead th { - height: 0px !important; - line-height: 0px !important; - padding-bottom: 0px !important; - padding-top: 0px !important; + height: 0 !important; + line-height: 0 !important; + padding-bottom: 0 !important; + padding-top: 0 !important; } /* Trackers table */ diff --git a/src/webui/www/private/css/noscript.css b/src/webui/www/private/css/noscript.css index 090b572b8..cb0063ac5 100644 --- a/src/webui/www/private/css/noscript.css +++ b/src/webui/www/private/css/noscript.css @@ -3,6 +3,6 @@ } #noscript { - color: #f00; + color: #ff0000; text-align: center; } diff --git a/src/webui/www/private/css/style.css b/src/webui/www/private/css/style.css index 186d0f5e8..665300d91 100644 --- a/src/webui/www/private/css/style.css +++ b/src/webui/www/private/css/style.css @@ -257,7 +257,7 @@ pre { hr { background-color: var(--color-background-default); - border: 0px; + border: 0; color: var(--color-text-default); height: 1px; margin-bottom: 6px; @@ -435,8 +435,8 @@ a.propButton img { .sliderarea { background: #f2f2f2 url("../images/slider-area.gif") repeat-x; border: 1px solid #a3a3a3; - border-bottom: 1px solid #ccc; - border-left: 1px solid #ccc; + border-bottom: 1px solid #cccccc; + border-left: 1px solid #cccccc; font-size: 1px; height: 7px; left: 0; @@ -573,7 +573,7 @@ label.tristate { display: block; float: left; height: 13px; - margin: 0.15em 8px 5px 0px; + margin: 0.15em 8px 5px 0; overflow: hidden; text-indent: -999em; width: 13px; @@ -785,20 +785,20 @@ td.generalLabel { .select-watched-folder-editable select { border: none; - bottom: 0px; - left: 0px; + bottom: 0; + left: 0; padding: 0; position: absolute; - top: 0px; + top: 0; width: 158px; } .select-watched-folder-editable input { border: none; - left: 0px; + left: 0; padding: 0; position: absolute; - top: 0px; + top: 0; width: 140px; } diff --git a/src/webui/www/private/css/vanillaSelectBox.css b/src/webui/www/private/css/vanillaSelectBox.css index 8191e5f17..63a38c776 100644 --- a/src/webui/www/private/css/vanillaSelectBox.css +++ b/src/webui/www/private/css/vanillaSelectBox.css @@ -55,13 +55,13 @@ li[data-parent].open:not(.hidden-search) { } li.disabled { - background-color: #999; + background-color: #999999; cursor: not-allowed; opacity: 0.3; } li.overflow { - background-color: #999; + background-color: #999999; cursor: not-allowed; opacity: 0.3; } @@ -140,7 +140,7 @@ li.short { height: 11px; margin-left: 22px; margin-right: 2px; - margin-top: 0px; + margin-top: 0; padding: 1px 3px 2px; width: 8px; } @@ -151,7 +151,7 @@ li.short { float: left; font-size: inherit; height: 8px; - margin-left: 0px; + margin-left: 0; transform: rotate(45deg); width: 5px; } @@ -194,7 +194,7 @@ li.short { font-weight: bold; margin-left: -22px; margin-right: 2px; - margin-top: 0px; + margin-top: 0; padding: 7px; } diff --git a/src/webui/www/public/css/login.css b/src/webui/www/public/css/login.css index 0b7efe890..bbf25e92e 100644 --- a/src/webui/www/public/css/login.css +++ b/src/webui/www/public/css/login.css @@ -28,7 +28,7 @@ body { } #error_msg { - color: #f00; + color: #ff0000; white-space: pre; } diff --git a/src/webui/www/public/css/noscript.css b/src/webui/www/public/css/noscript.css index 8897870b3..f2631c6c6 100644 --- a/src/webui/www/public/css/noscript.css +++ b/src/webui/www/public/css/noscript.css @@ -3,6 +3,6 @@ } #noscript { - color: #f00; + color: #ff0000; text-align: center; } diff --git a/src/webui/www/stylelint.config.mjs b/src/webui/www/stylelint.config.mjs index 712f9f844..bc4ba866b 100644 --- a/src/webui/www/stylelint.config.mjs +++ b/src/webui/www/stylelint.config.mjs @@ -5,15 +5,12 @@ export default { ], ignoreFiles: ["private/css/lib/*.css"], rules: { - "color-hex-length": null, + "color-hex-length": "long", "comment-empty-line-before": null, "comment-whitespace-inside": null, - "function-name-case": null, - "length-zero-no-unit": null, "no-descending-specificity": null, "order/properties-alphabetical-order": true, "selector-class-pattern": null, "selector-id-pattern": null, - "value-keyword-case": null } };