Bump the stylelint group with 2 updates (#5411)

* Bump the stylelint group with 2 updates

Bumps the stylelint group with 2 updates: [stylelint](https://github.com/stylelint/stylelint) and [stylelint-config-sass-guidelines](https://github.com/bjankord/stylelint-config-sass-guidelines).


Updates `stylelint` from 16.6.1 to 16.7.0
- [Release notes](https://github.com/stylelint/stylelint/releases)
- [Changelog](https://github.com/stylelint/stylelint/blob/main/CHANGELOG.md)
- [Commits](stylelint/stylelint@16.6.1...16.7.0)

Updates `stylelint-config-sass-guidelines` from 11.1.0 to 12.0.0
- [Release notes](https://github.com/bjankord/stylelint-config-sass-guidelines/releases)
- [Changelog](https://github.com/bjankord/stylelint-config-sass-guidelines/blob/main/CHANGELOG.md)
- [Commits](bjankord/stylelint-config-sass-guidelines@v11.1.0...v12.0.0)

---
updated-dependencies:
- dependency-name: stylelint
  dependency-type: direct:development
  update-type: version-update:semver-minor
  dependency-group: stylelint
- dependency-name: stylelint-config-sass-guidelines
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: stylelint
...

Signed-off-by: dependabot[bot] <[email protected]>

* * Run yarn run lint-style-fix twice

---------

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: PikachuEXE <[email protected]>

Author: dependabot[bot]

package.json

@@ -118,8 +118,8 @@
     "rimraf": "^6.0.1",
     "sass": "^1.77.8",
     "sass-loader": "^14.2.1",
-    "stylelint": "^16.6.1",
-    "stylelint-config-sass-guidelines": "^11.1.0",
+    "stylelint": "^16.7.0",
+    "stylelint-config-sass-guidelines": "^12.0.0",
     "stylelint-config-standard": "^36.0.1",
     "stylelint-high-performance-animation": "^1.10.0",
     "stylelint-use-logical-spec": "^5.0.1",

src/renderer/App.css

@@ -1,6 +1,6 @@
 @font-face {
   font-family: Roboto;
-  src: url("assets/font/Roboto-Regular.ttf");
+  src: url('assets/font/Roboto-Regular.ttf');
 }
 
 .app {
@@ -45,11 +45,13 @@
   overflow-wrap: break-word;
 }
 
-.fade-enter-active, .fade-leave-active {
-  transition: opacity .15s;
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.15s;
 }
 
-.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
+.fade-enter,
+.fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
   opacity: 0;
 }
 

src/renderer/components/experimental-settings/experimental-settings.css

@@ -1,5 +1,5 @@
 .experimental-warning {
   text-align: center;
   font-weight: bold;
-  padding-inline: 4% 4%
+  padding-inline: 4%;
 }

src/renderer/components/ft-age-restricted/ft-age-restricted.css

@@ -8,7 +8,8 @@
   padding-block: 20px;
 }
 
-.message, .frown {
+.message,
+.frown {
   color: var(--primary-text-color);
   background-color: var(--card-bg-color);
   padding-inline: 0;

src/renderer/components/ft-button/ft-button.css

@@ -34,7 +34,7 @@
 }
 
 .ripple::after {
-  content: "";
+  content: '';
   display: block;
   position: absolute;
   inline-size: 100%;
@@ -47,11 +47,11 @@
   background-position: 50%;
   transform: scale(10, 10);
   opacity: 0;
-  transition: transform .5s, opacity 1s;
+  transition: transform 0.5s, opacity 1s;
 }
 
 .ripple:active::after {
   transform: scale(0, 0);
-  opacity: .3;
+  opacity: 0.3;
   transition: 0s;
 }

src/renderer/components/ft-channel-bubble/ft-channel-bubble.css

@@ -34,7 +34,7 @@
 }
 
 .icon {
-  color: #EEE;
+  color: #eee;
   font-size: 25px;
   position: absolute;
   inset-block-start: 12px;

src/renderer/components/ft-checkbox-list/ft-checkbox-list.css

@@ -1,5 +1,5 @@
 /* stylelint-disable no-descending-specificity */
-.pure-checkbox input[type="checkbox"] {
+.pure-checkbox input[type='checkbox'] {
   border: 0;
   clip: rect(0 0 0 0);
   block-size: 1px;
@@ -10,13 +10,14 @@
   inline-size: 1px;
 }
 
-.pure-checkbox input[type="checkbox"]:focus + label::before, .pure-checkbox input[type="checkbox"]:hover + label::before {
+.pure-checkbox input[type='checkbox']:focus + label::before,
+.pure-checkbox input[type='checkbox']:hover + label::before {
   border: 2px solid var(--primary-color);
 }
 
-.pure-checkbox input[type="checkbox"]:active + label::before { transition-duration: 0s; }
+.pure-checkbox input[type='checkbox']:active + label::before { transition-duration: 0s; }
 
-.pure-checkbox input[type="checkbox"] + label {
+.pure-checkbox input[type='checkbox'] + label {
   position: relative;
   padding-inline-start: 2em;
   user-select: none;
@@ -25,7 +26,7 @@
   margin-block-start: 10px;
 }
 
-.pure-checkbox input[type="checkbox"] + label::before {
+.pure-checkbox input[type='checkbox'] + label::before {
   box-sizing: content-box;
   content: '';
   color: var(--primary-text-color);
@@ -40,7 +41,7 @@
   transition: all 0.4s ease;
 }
 
-.pure-checkbox input[type="checkbox"] + label::after {
+.pure-checkbox input[type='checkbox'] + label::after {
   box-sizing: content-box;
   border-style: solid;
   border-image: none;
@@ -58,34 +59,35 @@
   transition: transform 200ms ease-out;
 }
 
-.pure-checkbox input[type="checkbox"]:disabled + label::before { border-color: #ccc; }
+.pure-checkbox input[type='checkbox']:disabled + label::before { border-color: #ccc; }
 
-.pure-checkbox input[type="checkbox"]:disabled:focus + label::before, .pure-checkbox input[type="checkbox"]:disabled:hover + label::before { background-color: inherit; }
+.pure-checkbox input[type='checkbox']:disabled:focus + label::before,
+.pure-checkbox input[type='checkbox']:disabled:hover + label::before { background-color: inherit; }
 
-.pure-checkbox input[type="checkbox"]:disabled:checked + label::before { background-color: #ccc; }
+.pure-checkbox input[type='checkbox']:disabled:checked + label::before { background-color: #ccc; }
 
-.pure-checkbox input[type="checkbox"]:checked + label::after {
+.pure-checkbox input[type='checkbox']:checked + label::after {
   content: '';
   transform: rotate(-45deg) scale(1);
   transition: transform 200ms ease-out;
 }
 
-.pure-checkbox input[type="checkbox"]:checked + label::before {
+.pure-checkbox input[type='checkbox']:checked + label::before {
   animation: borderscale 200ms ease-in;
 }
 
 @keyframes
-borderscale {  50% {
- box-shadow: 0 0 0 2px var(--primary-text-color);
-}
+  borderscale {  50% {
+    box-shadow: 0 0 0 2px var(--primary-text-color);
+  }
 }
 
 .checkboxTitle {
   margin-block: 0;
 }
 
 @media only screen and (width <= 680px) {
-  .pure-checkbox input[type="checkbox"] + label {
+  .pure-checkbox input[type='checkbox'] + label {
     margin-block-start: 3px;
   }
 }

src/renderer/components/ft-community-poll/ft-community-poll.css

@@ -65,6 +65,7 @@
   cursor: pointer;
 }
 
-.reveal-answer:hover, .reveal-answer:focus {
-  background-color: var(--side-nav-hover-color)
+.reveal-answer:hover,
+.reveal-answer:focus {
+  background-color: var(--side-nav-hover-color);
 }

src/renderer/components/ft-icon-button/ft-icon-button.scss

@@ -98,7 +98,9 @@
     }
   }
 
-  &.favorite, &.favorite:hover, &.favorite:focus-visible {
+  &.favorite,
+  &.favorite:hover,
+  &.favorite:focus-visible {
     &:not(.disabled) {
       color: var(--favorite-icon-color);
     }

src/renderer/components/ft-input/ft-input.css

@@ -3,14 +3,14 @@
   position: relative;
 }
 
- body[dir='rtl'] .ft-input-component.search.showClearTextButton .inputAction {
+body[dir='rtl'] .ft-input-component.search.showClearTextButton .inputAction {
   inset-inline-end: -30px;
- }
+}
 
- body[dir='rtl'] .ft-input-component.search.clearTextButtonVisible .inputAction,
- body[dir='rtl'] .ft-input-component.search.showClearTextButton:focus-within .inputAction {
+body[dir='rtl'] .ft-input-component.search.clearTextButtonVisible .inputAction,
+body[dir='rtl'] .ft-input-component.search.showClearTextButton:focus-within .inputAction {
   inset-inline-end: 0;
- }
+}
 
 .ft-input-component.search.showClearTextButton {
   padding-inline-start: 30px;
@@ -41,7 +41,8 @@
   opacity: 1;
 }
 
-.disabled label, .disabled .ft-input{
+.disabled label,
+.disabled .ft-input {
   opacity: 0.4;
   cursor: not-allowed;
 }
@@ -82,7 +83,7 @@
 }
 
 .forceTextColor .clearInputTextButton {
-  color: #EEE;
+  color: #eee;
 }
 
 .forceTextColor .clearInputTextButton:active {
@@ -109,7 +110,7 @@
 }
 
 .forceTextColor .ft-input {
-  color: #EEE;
+  color: #eee;
   background-color: var(--primary-input-color);
 }
 
@@ -119,7 +120,7 @@
 }
 
 .forceTextColor ::placeholder {
-  color: #EEE;
+  color: #eee;
 }
 
 .inputWrapper {
@@ -153,7 +154,7 @@
 }
 
 .forceTextColor .inputAction {
-  color: #EEE;
+  color: #eee;
 }
 
 .ft-input-component.showActionButton .ft-input {