ci: improve SCSS linting for variable names and class names

BEM class names with _ are now allowed (somehow were not)

.stylelintrc.json

@@ -5,12 +5,12 @@
     "order/properties-alphabetical-order": true,
     "scss/at-rule-no-unknown": true,
     "scss/dollar-variable-default": true,
-    "scss/dollar-variable-first-in-block": true,
-    "scss/dollar-variable-pattern": "/(example|utrecht)-[a-z0-9-]+/",
-    "scss/percent-placeholder-pattern": "/(example|utrecht)-[a-z0-9-]+/",
-    "custom-property-pattern": "(example|utrecht)-[a-z0-9-]+",
-    "selector-class-pattern": "(example|utrecht)-[a-z0-9-]+",
-    "keyframes-name-pattern": "(example|utrecht)-[a-z0-9-]+",
+    "scss/dollar-variable-first-in-block": [true, { "ignore": ["comments", "imports"] }],
+    "scss/dollar-variable-pattern": "^(example|utrecht)-[a-z0-9-]+$",
+    "scss/percent-placeholder-pattern": "^(example|utrecht)-[a-z0-9-]+$",
+    "custom-property-pattern": "^(example|utrecht)-[a-z0-9-]+$",
+    "selector-class-pattern": "^(example|utrecht)-[a-z0-9_-]+$",
+    "keyframes-name-pattern": "^(example|utrecht)-[a-z0-9-]+$",
     "at-rule-no-unknown": null,
     "block-no-empty": [true],
     "color-no-invalid-hex": [true],