chore: enable Stylelint color-function-notation, lint html files (#9663)

Author: web-padawan

.stylelintrc

@@ -1,5 +1,5 @@
 {
-  "extends": ["stylelint-config-vaadin"],
+  "extends": ["stylelint-config-vaadin", "stylelint-config-html/html"],
   "plugins": [
     "./custom-rules/stylelint/no-shorthand-with-unresolved-longhand.js",
     "./custom-rules/stylelint/license-header.js"
@@ -21,6 +21,7 @@
     }
   ],
   "rules": {
+    "color-function-notation": "legacy",
     "no-duplicate-selectors": true
   }
 }

dev/app-layout.html

@@ -38,7 +38,7 @@
         display: flex;
         place-items: center;
         place-content: center;
-        background-image: linear-gradient(45deg, hsl(0 0 50), hsl(0 0 90));
+        background-image: linear-gradient(45deg, hsl(0deg, 0%, 50%), hsl(0deg, 0%, 90%));
         border: 2px solid;
         border-radius: 0.5rem;
         margin: 1rem;

package.json

@@ -12,7 +12,7 @@
     "docs": "yarn analyze && web-dev-server --node-resolve --open",
     "icons": "lerna run icons",
     "lint": "npm-run-all --parallel lint:*",
-    "lint:css": "stylelint --ignore-path .gitignore \"packages/**/src/**/*.js\" \"packages/**/theme/**/*-styles.js\" \"packages/**/*.css\"",
+    "lint:css": "stylelint --ignore-path .gitignore \"packages/**/src/**/*.js\" \"packages/**/theme/**/*-styles.js\" \"packages/**/*.css\" \"dev/**/*.html\"",
     "lint:js": "eslint",
     "lint:types": "tsc",
     "postinstall": "patch-package",
@@ -64,13 +64,15 @@
     "lint-staged": "^15.2.9",
     "npm-run-all": "^4.1.5",
     "patch-package": "^7.0.0",
+    "postcss-html": "^1.8.0",
     "postcss-lit": "^1.2.0",
     "prettier": "^3.6.0",
     "prettier-plugin-package": "^1.4.0",
     "replace-in-file": "^8.3.0",
     "rimraf": "^6.0.1",
     "rollup": "^4.4.0",
     "stylelint": "^16.21.0",
+    "stylelint-config-html": "^1.1.0",
     "stylelint-config-vaadin": "^1.0.0-alpha.2",
     "typescript": "^5.8.3"
   },

yarn.lock

@@ -6203,6 +6203,16 @@ htmlparser2@^10.0.0:
     domutils "^3.2.1"
     entities "^6.0.0"
 
+htmlparser2@^8.0.0:
+  version "8.0.2"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-8.0.2.tgz#f002151705b383e62433b5cf466f5b716edaec21"
+  integrity sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==
+  dependencies:
+    domelementtype "^2.3.0"
+    domhandler "^5.0.3"
+    domutils "^3.0.1"
+    entities "^4.4.0"
+
 htmlparser2@^9.1.0:
   version "9.1.0"
   resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-9.1.0.tgz#cdb498d8a75a51f739b61d3f718136c369bc8c23"
@@ -7027,6 +7037,11 @@ jest-get-type@^29.6.3:
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
   integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
 
+js-tokens@^9.0.0:
+  version "9.0.1"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-9.0.1.tgz#2ec43964658435296f6761b34e10671c2d9527f4"
+  integrity sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==
+
 js-yaml@4.1.0, js-yaml@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-4.1.0.tgz#c1fb65f8f5017901cdd2c951864ba18458a10602"
@@ -9181,6 +9196,16 @@ possible-typed-array-names@^1.0.0:
   resolved "https://registry.yarnpkg.com/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz#89bb63c6fada2c3e90adc4a647beeeb39cc7bf8f"
   integrity sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==
 
+postcss-html@^1.8.0:
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/postcss-html/-/postcss-html-1.8.0.tgz#2ea1e9d6c53f04ea994135219d3bd8a9e380e13b"
+  integrity sha512-5mMeb1TgLWoRKxZ0Xh9RZDfwUUIqRrcxO2uXO+Ezl1N5lqpCiSU5Gk6+1kZediBfBHFtPCdopr2UZ2SgUsKcgQ==
+  dependencies:
+    htmlparser2 "^8.0.0"
+    js-tokens "^9.0.0"
+    postcss "^8.5.0"
+    postcss-safe-parser "^6.0.0"
+
 postcss-lit@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/postcss-lit/-/postcss-lit-1.2.0.tgz#3b4b37ff3c6cf5883fb7b3be03a1011a746a3259"
@@ -9196,6 +9221,11 @@ postcss-resolve-nested-selector@^0.1.6:
   resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.6.tgz#3d84dec809f34de020372c41b039956966896686"
   integrity sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==
 
+postcss-safe-parser@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz#bb4c29894171a94bc5c996b9a30317ef402adaa1"
+  integrity sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==
+
 postcss-safe-parser@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-7.0.1.tgz#36e4f7e608111a0ca940fd9712ce034718c40ec0"
@@ -9222,7 +9252,7 @@ postcss-value-parser@^4.2.0:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
   integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
 
-postcss@^8.5.5:
+postcss@^8.5.0, postcss@^8.5.5:
   version "8.5.6"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.5.6.tgz#2825006615a619b4f62a9e7426cc120b349a8f3c"
   integrity sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==
@@ -10599,6 +10629,11 @@ strtok3@^9.0.1:
     "@tokenizer/token" "^0.3.0"
     peek-readable "^5.3.1"
 
+stylelint-config-html@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/stylelint-config-html/-/stylelint-config-html-1.1.0.tgz#999db19aea713b7ff6dde92ada76e4c1bd812b66"
+  integrity sha512-IZv4IVESjKLumUGi+HWeb7skgO6/g4VMuAYrJdlqQFndgbj6WJAXPhaysvBiXefX79upBdQVumgYcdd17gCpjQ==
+
 stylelint-config-vaadin@^1.0.0-alpha.2:
   version "1.0.0-alpha.2"
   resolved "https://registry.yarnpkg.com/stylelint-config-vaadin/-/stylelint-config-vaadin-1.0.0-alpha.2.tgz#995372f0d31b8b941c8320414cbeb9f2737e616c"