Bump stylelint from 15.10.3 to 15.11.0 (#605)

* Bump stylelint from 15.10.3 to 15.11.0

Bumps [stylelint](https://github.com/stylelint/stylelint) from 15.10.3 to 15.11.0.
- [Release notes](https://github.com/stylelint/stylelint/releases)
- [Changelog](https://github.com/stylelint/stylelint/blob/main/CHANGELOG.md)
- [Commits](stylelint/stylelint@15.10.3...15.11.0)

---
updated-dependencies:
- dependency-name: stylelint
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

* Fix linter issues.

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Marc Görtz <mail@marcgoertz.de>

package.json

@@ -35,7 +35,7 @@
     "react-dom": "^18.2.0",
     "storybook": "^7.6.2",
     "styled-components": "^6.1.0",
-    "stylelint": "^15.10.3",
+    "stylelint": "^15.11.0",
     "stylelint-config-standard": "^34.0.0",
     "stylelint-config-styled-components": "^0.1.1",
     "stylis": "^4.3.0",

src/chat/index.tsx

@@ -95,8 +95,7 @@ const Time = styled.time<{$isMe: boolean}>`
   display: none;
   position: absolute;
   inset-block-start: 100%;
-  inset-inline-start: ${(p) => (p.$isMe ? '' : '0.666667em')};
-  inset-inline-end: ${(p) => (p.$isMe ? '0.666667em' : '')};
+  inset-inline: ${(p) => (p.$isMe ? 'auto 0.666667em' : '0.666667em auto')};
   margin-block-start: 0.25em;
   text-align: ${(p) => (p.$isMe ? 'end' : 'start')};
   font-size: 0.75rem;

src/chat/tests/__snapshots__/index.test.tsx.snap

@@ -143,7 +143,7 @@ exports[`<Chat /> renders a full-featured chat 1`] = `
   display: none;
   position: absolute;
   inset-block-start: 100%;
-  inset-inline-start: 0.666667em;
+  inset-inline: 0.666667em auto;
   margin-block-start: 0.25em;
   text-align: start;
   font-size: 0.75rem;
@@ -156,7 +156,7 @@ exports[`<Chat /> renders a full-featured chat 1`] = `
   display: none;
   position: absolute;
   inset-block-start: 100%;
-  inset-inline-end: 0.666667em;
+  inset-inline: auto 0.666667em;
   margin-block-start: 0.25em;
   text-align: end;
   font-size: 0.75rem;

src/hamburger-button/index.tsx

@@ -27,10 +27,13 @@ type Props = {
 
 const Input = styled.input<{$position: Position}>`
   position: absolute;
-  inset-block-start: ${(p) => p.$position.blockStart ?? ''};
-  inset-block-end: ${(p) => p.$position.blockEnd ?? ''};
-  inset-inline-start: ${(p) => p.$position.inlineStart ?? ''};
-  inset-inline-end: ${(p) => p.$position.inlineEnd ?? ''};
+  inset: ${(p) =>
+    [
+      p.$position.blockStart ?? 'auto',
+      p.$position.inlineEnd ?? 'auto',
+      p.$position.blockEnd ?? 'auto',
+      p.$position.inlineStart ?? 'auto',
+    ].join(' ')};
   inline-size: 1px;
   block-size: 1px;
   clip: rect(1px, 1px, 1px, 1px);
@@ -39,10 +42,13 @@ const Input = styled.input<{$position: Position}>`
 
 const Hamburger = styled.label<{$position: Position}>`
   position: absolute;
-  inset-block-start: ${(p) => p.$position.blockStart ?? ''};
-  inset-block-end: ${(p) => p.$position.blockEnd ?? ''};
-  inset-inline-start: ${(p) => p.$position.inlineStart ?? ''};
-  inset-inline-end: ${(p) => p.$position.inlineEnd ?? ''};
+  inset: ${(p) =>
+    [
+      p.$position.blockStart ?? 'auto',
+      p.$position.inlineEnd ?? 'auto',
+      p.$position.blockEnd ?? 'auto',
+      p.$position.inlineStart ?? 'auto',
+    ].join(' ')};
   z-index: 1;
   inline-size: 2em;
   block-size: 1.5em;