style: resolve linting issues

config/.eslintrc.cjs

@@ -76,11 +76,12 @@ module.exports = {
   },
   ignorePatterns: [
     '**/bin/**/*',
-    '**/dist/**/*',
-    '**/hydrate/**/*',
-    '**/dist_docs/**/*',
     '**/coverage/**/*',
     '**/components.d.ts',
+    '**/dist/**/*',
+    '**/dist_docs/**/*',
+    '**/hydrate/**/*',
+    '**/out/**/*',
     '**/src/liquid/**/__mocks__/**/*',
   ],
 }

package.json

@@ -55,6 +55,7 @@
     "icons:update": "dotenv -e .env -- ts-node scripts/iconsUpdate.ts",
     "lint": "run-p lint:ts lint:eslint lint:styles",
     "lint:eslint": "eslint .",
+    "lint:eslint:fix": "eslint . --fix",
     "lint:styles": "stylelint ./src/**/*css",
     "lint:styles:fix": "stylelint ./src/**/*css --fix",
     "lint:ts": "tsc --noemit -p config/tsconfig.docs.json",
@@ -148,7 +149,7 @@
     "semantic-release": "^22.0.0",
     "shx": "^0.3.4",
     "stenciljs-web-types-generator": "^1.0.4",
-    "stylelint": "^15.6.0",
+    "stylelint": "^15.10.3",
     "stylelint-config-standard": "^34.0.0",
     "stylelint-declaration-strict-value": "^1.9.1",
     "stylelint-high-performance-animation": "^1.8.0",
@@ -222,6 +223,11 @@
     "printWidth": 80,
     "semi": false
   },
+  "overrides": {
+    "stylelint": {
+      "cosmiconfig": "8.1.3"
+    }
+  },
   "stylelint": {
     "extends": [
       "./config/stylelint.config.cjs"

src/docs/components/docs-main/docs-main.css

@@ -357,8 +357,7 @@
     }
 
     > table {
-      overflow-x: scroll;
-      overflow-y: hidden;
+      overflow: scroll hidden;
       min-width: 100%;
       text-align: left;
       border-collapse: collapse;

src/liquid/components/ld-label/ld-label.css

@@ -18,8 +18,7 @@
   color: var(--ld-label-col);
   font: var(--ld-typo-label-s);
   display: inline-grid;
-  row-gap: var(--ld-label-row-gap);
-  column-gap: 0;
+  gap: var(--ld-label-row-gap) 0;
   max-width: 100%;
   align-content: flex-start;
 }
@@ -28,8 +27,7 @@
 .ld-label--right {
   justify-content: flex-start;
   align-items: center;
-  column-gap: var(--ld-label-column-gap);
-  row-gap: 0;
+  gap: 0 var(--ld-label-column-gap);
 
   > ::slotted(.ld-checkbox),
   > .ld-checkbox,

src/liquid/components/ld-modal/ld-modal.css

@@ -137,15 +137,14 @@ dialog.ld-modal--blurry-backdrop,
 
 /* custom icon cross */
 .ld-modal__x {
-  align-self: flex-start;
+  place-self: flex-start flex-end;
   appearance: none;
   background-color: transparent;
   border: solid transparent var(--ld-sp-8);
   box-sizing: border-box;
   cursor: pointer;
   display: inline-flex;
   height: 3rem;
-  justify-self: flex-end;
   margin: auto calc(var(--ld-sp-16) * -1) auto auto;
   overflow: hidden;
   position: relative;

src/liquid/components/ld-select/ld-option-internal/ld-option-internal.shadow.css

@@ -46,10 +46,9 @@
   color: var(--ld-option-text-col);
   background-color: var(--ld-option-bg-col);
   padding-block: var(--ld-sp-8);
-  padding-inline-end: var(--ld-sp-12);
-  padding-inline-start: calc(
+  padding-inline: calc(
     var(--ld-option-padding-inline-start) + var(--ld-option-indent, 0px)
-  );
+  ) var(--ld-sp-12);
   font: var(--ld-typo-label-m);
   min-height: 2.5rem;
   white-space: nowrap;