[chore] lint sass files (#103)

commit c811679128
Author: Zoë Bijl <code@moiety.me>
Date:   Wed Oct 15 21:02:39 2025 +0200

    [chore] remove unused override

commit a3e56447aa
Author: Zoë Bijl <code@moiety.me>
Date:   Wed Oct 15 18:57:22 2025 +0200

    [chore] lint Sass files

app/javascript/flavours/glitch/styles/accessibility.scss

@@ -1,7 +1,7 @@
-$emojis-requiring-inversion: 'back' 'copyright' 'curly_loop' 'currency_exchange'
-  'end' 'heavy_check_mark' 'heavy_division_sign' 'heavy_dollar_sign'
-  'heavy_minus_sign' 'heavy_multiplication_x' 'heavy_plus_sign' 'on'
-  'registered' 'soon' 'spider' 'telephone_receiver' 'tm' 'top' 'wavy_dash' !default;
+$emojis-requiring-inversion: "back" "copyright" "curly_loop" "currency_exchange"
+  "end" "heavy_check_mark" "heavy_division_sign" "heavy_dollar_sign"
+  "heavy_minus_sign" "heavy_multiplication_x" "heavy_plus_sign" "on"
+  "registered" "soon" "spider" "telephone_receiver" "tm" "top" "wavy_dash" !default;
 
 %emoji-color-inversion {
   filter: invert(1);
@@ -9,7 +9,7 @@ $emojis-requiring-inversion: 'back' 'copyright' 'curly_loop' 'currency_exchange'
 
 .emojione {
   @each $emoji in $emojis-requiring-inversion {
-    &[title=':#{$emoji}:'] {
+    &[title=":#{$emoji}:"] {
       @extend %emoji-color-inversion;
     }
   }

app/javascript/flavours/glitch/styles/admin.scss

@@ -1,4 +1,4 @@
-@use 'sass:math';
+@use "sass:math";
 
 $no-columns-breakpoint: 600px;
 $sidebar-width: 240px;
@@ -1456,7 +1456,7 @@ a.sparkline {
 
     &::after {
       display: block;
-      content: '';
+      content: "";
       width: 50px;
       height: 21px;
       position: absolute;
@@ -1850,7 +1850,7 @@ a.sparkline {
 
     &::after {
       position: absolute;
-      content: '';
+      content: "";
       width: 1px;
       background: $highlight-text-color;
       bottom: 0;

app/javascript/flavours/glitch/styles/basics.scss

@@ -1,9 +1,9 @@
 @function hex-color($color) {
-  @if type-of($color) == 'color' {
+  @if type-of($color) == "color" {
     $color: str-slice(ie-hex-str($color), 4);
   }
 
-  @return '%23' + unquote($color);
+  @return "%23" + unquote($color);
 }
 
 body {
@@ -14,7 +14,7 @@ body {
   font-weight: 400;
   color: var(--color-fg);
   text-rendering: optimizelegibility;
-  font-feature-settings: 'kern';
+  font-feature-settings: "kern";
   text-size-adjust: none;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-tap-highlight-color: transparent;
@@ -35,13 +35,13 @@ body {
       system-ui,
       -apple-system,
       BlinkMacSystemFont,
-      'Segoe UI',
+      "Segoe UI",
       Oxygen,
       Ubuntu,
       Cantarell,
-      'Fira Sans',
-      'Droid Sans',
-      'Helvetica Neue',
+      "Fira Sans",
+      "Droid Sans",
+      "Helvetica Neue",
       $font-sans-serif,
       sans-serif;
   }

app/javascript/flavours/glitch/styles/components/accounts.scss

@@ -467,7 +467,7 @@
       width: 2px;
       height: 24px;
       background: var(--color-notifications-lines);
-      content: '';
+      content: "";
     }
   }
 

app/javascript/flavours/glitch/styles/components/columns.scss

@@ -295,7 +295,7 @@ $ui-header-height: 55px;
 
     &::before {
       display: block;
-      content: '';
+      content: "";
       position: absolute;
       bottom: -13px;
       inset-inline-start: 0;

app/javascript/flavours/glitch/styles/components/compose_form.scss

@@ -64,7 +64,7 @@
     &:focus {
       outline: 0;
     }
-    @include single-column('screen and (max-width: 630px)') {
+    @include single-column("screen and (max-width: 630px)") {
       font-size: 16px;
     }
   }
@@ -103,7 +103,7 @@
     color: $highlight-text-color;
   }
 
-  input[type='checkbox'] {
+  input[type="checkbox"] {
     display: none;
   }
 
@@ -240,11 +240,11 @@
         outline: 0;
       }
 
-      @include single-column('screen and (max-width: 630px)') {
+      @include single-column("screen and (max-width: 630px)") {
         font-size: 16px;
       }
 
-      @include limited-single-column('screen and (max-width: 600px)') {
+      @include limited-single-column("screen and (max-width: 600px)") {
         height: 100px !important; // prevent auto-resize textarea
         resize: vertical;
       }

app/javascript/flavours/glitch/styles/components/directory.scss

@@ -42,8 +42,8 @@
   text-overflow: ellipsis;
   cursor: pointer;
 
-  input[type='radio'],
-  input[type='checkbox'] {
+  input[type="radio"],
+  input[type="checkbox"] {
     display: none;
   }
 

app/javascript/flavours/glitch/styles/components/doodle.scss

@@ -35,8 +35,8 @@ $doodle-background: #d9e1e8;
         margin-inline-end: 2px;
       }
 
-      input[type='number'],
-      input[type='text'] {
+      input[type="number"],
+      input[type="text"] {
         width: 40px;
       }
 

app/javascript/flavours/glitch/styles/components/drawer.scss

@@ -16,11 +16,11 @@
     padding-inline-end: 10px;
   }
 
-  @include single-column('screen and (max-width: 630px)') {
+  @include single-column("screen and (max-width: 630px)") {
     flex: auto;
   }
 
-  @include limited-single-column('screen and (max-width: 630px)') {
+  @include limited-single-column("screen and (max-width: 630px)") {
     &,
     &:first-child,
     &:last-child {
@@ -34,7 +34,7 @@
     flex: 1 1 200px;
   }
 
-  @include single-column('screen and (max-width: 630px)') {
+  @include single-column("screen and (max-width: 630px)") {
     :root & {
       //  Overrides `.wide` for single-column view
       flex: auto;
@@ -109,11 +109,11 @@
   flex: none;
 
   @include limited-single-column(
-    'screen and (max-width: #{$no-gap-breakpoint})'
+    "screen and (max-width: #{$no-gap-breakpoint})"
   ) {
     margin-bottom: 0;
   }
-  @include single-column('screen and (max-width: 630px)') {
+  @include single-column("screen and (max-width: 630px)") {
     font-size: 16px;
   }
 }
@@ -299,7 +299,7 @@
   .mbstobon-#{$i} .drawer__inner__mastodon {
     @if $i == 3 {
       background:
-        url('~flavours/glitch/images/wave-drawer.png')
+        url("~flavours/glitch/images/wave-drawer.png")
           no-repeat
           bottom /
           100%
@@ -307,7 +307,7 @@
         lighten($ui-base-color, 4%);
     } @else {
       background:
-        url('~flavours/glitch/images/wave-drawer-glitched.png')
+        url("~flavours/glitch/images/wave-drawer-glitched.png")
           no-repeat
           bottom /
           100%
@@ -316,7 +316,7 @@
     }
 
     & > .mastodon {
-      background: url('~flavours/glitch/images/mbstobon-ui-#{$i}.png')
+      background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png")
         no-repeat
         left
         bottom /

app/javascript/flavours/glitch/styles/components/emoji_picker.scss

@@ -174,7 +174,7 @@
 
   &:hover::before {
     z-index: 0;
-    content: '';
+    content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;

app/javascript/flavours/glitch/styles/components/index.scss

@@ -1,26 +1,26 @@
-@import 'misc';
-@import 'boost';
-@import 'accounts';
-@import 'domains';
-@import 'status';
-@import 'modal';
-@import 'compose_form';
-@import 'columns';
-@import 'regeneration_indicator';
-@import 'directory';
-@import 'search';
-@import 'emoji';
-@import 'doodle';
-@import 'drawer';
-@import 'media';
-@import 'sensitive';
-@import 'lists';
-@import 'emoji_picker';
-@import 'local_settings';
-@import 'single_column';
-@import 'announcements';
-@import 'explore';
-@import 'scrollbars';
-@import 'signed_out';
-@import 'privacy_policy';
-@import 'about';
+@import "misc";
+@import "boost";
+@import "accounts";
+@import "domains";
+@import "status";
+@import "modal";
+@import "compose_form";
+@import "columns";
+@import "regeneration_indicator";
+@import "directory";
+@import "search";
+@import "emoji";
+@import "doodle";
+@import "drawer";
+@import "media";
+@import "sensitive";
+@import "lists";
+@import "emoji_picker";
+@import "local_settings";
+@import "single_column";
+@import "announcements";
+@import "explore";
+@import "scrollbars";
+@import "signed_out";
+@import "privacy_policy";
+@import "about";

app/javascript/flavours/glitch/styles/components/modal.scss

@@ -267,7 +267,7 @@
 }
 
 .onboarding-modal__page__wrapper-0 {
-  background: url('~images/elephant_ui_greeting.svg') no-repeat left bottom /
+  background: url("~images/elephant_ui_greeting.svg") no-repeat left bottom /
     auto 250px;
   height: 100%;
   padding: 0;
@@ -1204,7 +1204,7 @@
     width: 100px;
     height: 100px;
     transform: translate(-50%, -50%);
-    background: url('~images/reticle.png') no-repeat 0 0;
+    background: url("~images/reticle.png") no-repeat 0 0;
     border-radius: 50%;
     box-shadow: 0 0 0 9999em rgba($base-shadow-color, 0.35);
   }

app/javascript/flavours/glitch/styles/components/privacy_policy.scss

@@ -87,14 +87,14 @@
     counter-increment: list-counter;
 
     &::before {
-      content: counter(list-counter) '.';
+      content: counter(list-counter) ".";
       position: absolute;
       inset-inline-start: 0;
     }
   }
 
   ul > li::before {
-    content: '';
+    content: "";
     position: absolute;
     background-color: $darker-text-color;
     border-radius: 50%;

app/javascript/flavours/glitch/styles/components/status.scss

@@ -216,6 +216,7 @@
 
   &.status-direct {
     --color-status-bg: #{mix($ui-base-color, $ui-highlight-color, 95%)};
+
     border-bottom-color: lighten($ui-base-color, 12%);
   }
 

app/javascript/flavours/glitch/styles/contrast.scss

@@ -1,3 +1,3 @@
-@import 'contrast/variables';
-@import 'index';
-@import 'contrast/diff';
+@import "contrast/variables";
+@import "index";
+@import "contrast/diff";

app/javascript/flavours/glitch/styles/forms.scss

@@ -309,9 +309,9 @@ code {
       max-width: 100%;
       height: auto;
       border-radius: 4px;
-      background: url('images/void.png');
+      background: url("images/void.png");
 
-      &[src$='missing.png'] {
+      &[src$="missing.png"] {
         visibility: hidden;
       }
 
@@ -404,7 +404,7 @@ code {
         flex: 1 1 auto;
       }
 
-      input[type='checkbox'] {
+      input[type="checkbox"] {
         position: absolute;
         inset-inline-start: 0;
         top: 5px;
@@ -420,12 +420,12 @@ code {
     border-radius: 4px;
   }
 
-  input[type='text'],
-  input[type='number'],
-  input[type='email'],
-  input[type='password'],
-  input[type='url'],
-  input[type='datetime-local'],
+  input[type="text"],
+  input[type="number"],
+  input[type="email"],
+  input[type="password"],
+  input[type="url"],
+  input[type="datetime-local"],
   textarea {
     box-sizing: border-box;
     font-size: 16px;
@@ -463,11 +463,11 @@ code {
     }
   }
 
-  input[type='text'],
-  input[type='number'],
-  input[type='email'],
-  input[type='password'],
-  input[type='datetime-local'] {
+  input[type="text"],
+  input[type="number"],
+  input[type="email"],
+  input[type="password"],
+  input[type="datetime-local"] {
     &:focus:invalid:not(:placeholder-shown),
     &:required:invalid:not(:placeholder-shown) {
       border-color: lighten($error-red, 12%);
@@ -479,11 +479,11 @@ code {
       color: lighten($error-red, 12%);
     }
 
-    input[type='text'],
-    input[type='number'],
-    input[type='email'],
-    input[type='password'],
-    input[type='datetime-local'],
+    input[type="text"],
+    input[type="number"],
+    input[type="email"],
+    input[type="password"],
+    input[type="datetime-local"],
     textarea,
     select {
       border-color: lighten($error-red, 12%);
@@ -619,7 +619,7 @@ code {
       overflow: hidden;
 
       &::after {
-        content: '';
+        content: "";
         display: block;
         position: absolute;
         top: 0;
@@ -1019,7 +1019,7 @@ code {
     flex: 1 1 auto;
   }
 
-  input[type='text'] {
+  input[type="text"] {
     background: transparent;
     border: 0;
     padding: 10px;
@@ -1205,7 +1205,7 @@ code {
     border-color: $highlight-text-color;
 
     &::before {
-      content: '';
+      content: "";
       width: 10px;
       height: 10px;
       border-radius: 50%;

app/javascript/flavours/glitch/styles/gts/_config.scss

@@ -6,8 +6,8 @@
 */
 
 /* 🛠️ Config */
-@import 'colors';
-@import 'sizes';
+@import "colors";
+@import "sizes";
 
 /* 🧩 Components */
-@import 'status';
+@import "status";

app/javascript/flavours/glitch/styles/gts/status/status-icons.scss

@@ -22,7 +22,7 @@
         right: calc(100% + 5px);
         width: 20px;
         height: 100%;
-        content: '';
+        content: "";
         background: linear-gradient(90deg, transparent, var(--color-status-bg));
         transition: all 0.2s;
     }

app/javascript/flavours/glitch/styles/index.scss

@@ -1,28 +1,28 @@
-@import 'mixins';
-@import 'variables';
-@import 'styles/fonts/roboto';
-@import 'styles/fonts/roboto-mono';
+@import "mixins";
+@import "variables";
+@import "styles/fonts/roboto";
+@import "styles/fonts/roboto-mono";
 
-@import 'reset';
-@import 'basics';
-@import 'branding';
-@import 'containers';
-@import 'lists';
-@import 'modal';
-@import 'widgets';
-@import 'forms';
-@import 'accounts';
-@import 'statuses';
-@import 'components/index';
-@import 'polls';
-@import 'about';
-@import 'tables';
-@import 'admin';
-@import 'accessibility';
-@import 'rtl';
-@import 'dashboard';
-@import 'rich_text';
+@import "reset";
+@import "basics";
+@import "branding";
+@import "containers";
+@import "lists";
+@import "modal";
+@import "widgets";
+@import "forms";
+@import "accounts";
+@import "statuses";
+@import "components/index";
+@import "polls";
+@import "about";
+@import "tables";
+@import "admin";
+@import "accessibility";
+@import "rtl";
+@import "dashboard";
+@import "rich_text";
 
-@import 'gts';
-@import 'gts/config';
-@import 'tangerine/config';
+@import "gts";
+@import "gts/config";
+@import "tangerine/config";

app/javascript/flavours/glitch/styles/login.scss

@@ -1,5 +1,5 @@
-@import 'styles/fonts/roboto';
-@import 'reset';
+@import "styles/fonts/roboto";
+@import "reset";
 
 :root {
     --color-bg: #191b22;
@@ -91,7 +91,7 @@ button {
     }
 }
 
-input[type='text'] {
+input[type="text"] {
     display: block;
     margin: 0;
     padding: 15px;

app/javascript/flavours/glitch/styles/mastodon-light.scss

@@ -1,4 +1,4 @@
-@import 'mastodon-light/variables';
-@import 'index';
-@import 'mastodon-light/diff';
-@import 'mastodon-light/colors';
+@import "mastodon-light/variables";
+@import "index";
+@import "mastodon-light/diff";
+@import "mastodon-light/colors";

app/javascript/flavours/glitch/styles/mastodon-light/colors.scss

@@ -40,5 +40,5 @@
   /* Status */
   --color-status-fg: var(--color-fg);
   --color-status-bg: #fff;
-  --color-status-bg--focus: hsl(0, 0%, 96%);
+  --color-status-bg--focus: hsl(0deg, 0%, 96%);
 }

app/javascript/flavours/glitch/styles/mastodon-light/diff.scss

@@ -141,7 +141,7 @@ html {
 }
 
 .compose-form__autosuggest-wrapper,
-.poll__option input[type='text'],
+.poll__option input[type="text"],
 .compose-form .spoiler-input__input,
 .compose-form__poll-wrapper select,
 .search__input,
@@ -495,10 +495,10 @@ html {
 }
 
 .simple_form {
-  input[type='text'],
-  input[type='number'],
-  input[type='email'],
-  input[type='password'],
+  input[type="text"],
+  input[type="number"],
+  input[type="email"],
+  input[type="password"],
   textarea {
     &:hover {
       border-color: lighten($ui-base-color, 12%);

app/javascript/flavours/glitch/styles/mastodon-light/variables.scss

@@ -54,4 +54,4 @@ $account-background-color: $white !default;
   @return hsl(hue($color), saturation($color), lightness($color) - $amount);
 }
 
-$emojis-requiring-inversion: 'chains';
+$emojis-requiring-inversion: "chains";

app/javascript/flavours/glitch/styles/rtl.scss

@@ -107,11 +107,11 @@ body.rtl {
   }
 
   .fa-chevron-left::before {
-    content: '\F054';
+    content: "\F054";
   }
 
   .fa-chevron-right::before {
-    content: '\F053';
+    content: "\F053";
   }
 
   .dismissable-banner,

app/javascript/flavours/glitch/styles/statuses.scss

@@ -86,7 +86,7 @@
 }
 
 .embed {
-  .status__content[data-spoiler='folded'] {
+  .status__content[data-spoiler="folded"] {
     .e-content {
       display: none;
     }

app/javascript/flavours/glitch/styles/tangerine/_config.scss

@@ -4,7 +4,7 @@
 */
 
 /* 🛠️ Config */
-@import 'keyframes';
+@import "keyframes";
 
 /* 🧩 Components */
-@import 'status-bar';
+@import "status-bar";

app/javascript/flavours/glitch/styles/variables.scss

@@ -83,9 +83,9 @@ $media-modal-media-max-height: 80%;
 
 $no-gap-breakpoint: 1175px;
 
-$font-sans-serif: 'mastodon-font-sans-serif' !default;
-$font-display: 'mastodon-font-display' !default;
-$font-monospace: 'mastodon-font-monospace' !default;
+$font-sans-serif: "mastodon-font-sans-serif" !default;
+$font-display: "mastodon-font-display" !default;
+$font-monospace: "mastodon-font-monospace" !default;
 
 // Avatar border size (8% default, 100% for rounded avatars)
 $ui-avatar-border-size: 8%;

app/javascript/flavours/glitch/styles/widgets.scss

@@ -1,4 +1,4 @@
-@use 'sass:math';
+@use "sass:math";
 
 .hero-widget {
   margin-bottom: 10px;

app/javascript/skins/glitch/contrast/common.scss

@@ -1 +1 @@
-@import 'flavours/glitch/styles/contrast';
+@import "flavours/glitch/styles/contrast";

app/javascript/skins/glitch/mastodon-light/common.scss

@@ -1 +1 @@
-@import 'flavours/glitch/styles/mastodon-light';
+@import "flavours/glitch/styles/mastodon-light";

app/javascript/styles/fonts/roboto-mono.scss

@@ -1,8 +1,8 @@
 @font-face {
   font-family: mastodon-font-monospace;
   src:
-    local('Roboto Mono'),
-    url('~fonts/roboto-mono/robotomono-regular-webfont.woff2') format('woff2');
+    local("Roboto Mono"),
+    url("~fonts/roboto-mono/robotomono-regular-webfont.woff2") format("woff2");
   font-weight: 400;
   font-display: swap;
   font-style: normal;

app/javascript/styles/fonts/roboto.scss

@@ -1,8 +1,8 @@
 @font-face {
   font-family: mastodon-font-sans-serif;
   src:
-    local('Roboto Italic'),
-    url('~fonts/roboto/roboto-italic-webfont.woff2') format('woff2');
+    local("Roboto Italic"),
+    url("~fonts/roboto/roboto-italic-webfont.woff2") format("woff2");
   font-weight: normal;
   font-display: swap;
   font-style: italic;
@@ -11,8 +11,8 @@
 @font-face {
   font-family: mastodon-font-sans-serif;
   src:
-    local('Roboto Bold'),
-    url('~fonts/roboto/roboto-bold-webfont.woff2') format('woff2');
+    local("Roboto Bold"),
+    url("~fonts/roboto/roboto-bold-webfont.woff2") format("woff2");
   font-weight: bold;
   font-display: swap;
   font-style: normal;
@@ -21,8 +21,8 @@
 @font-face {
   font-family: mastodon-font-sans-serif;
   src:
-    local('Roboto Medium'),
-    url('~fonts/roboto/roboto-medium-webfont.woff2') format('woff2');
+    local("Roboto Medium"),
+    url("~fonts/roboto/roboto-medium-webfont.woff2") format("woff2");
   font-weight: 500;
   font-display: swap;
   font-style: normal;
@@ -31,8 +31,8 @@
 @font-face {
   font-family: mastodon-font-sans-serif;
   src:
-    local('Roboto'),
-    url('~fonts/roboto/roboto-regular-webfont.woff2') format('woff2');
+    local("Roboto"),
+    url("~fonts/roboto/roboto-regular-webfont.woff2") format("woff2");
   font-weight: normal;
   font-display: swap;
   font-style: normal;

stylelint.config.js

@@ -36,18 +36,4 @@ module.exports = {
     "scss/dollar-variable-empty-line-before": null,
     "scss/no-global-function-names": null,
   },
-  overrides: [
-    {
-      "files": ["app/javascript/styles/mailer.scss"],
-      rules: {
-        "property-no-unknown": [
-          true,
-          {
-            ignoreProperties: [
-              "/^mso-/",
-            ] },
-        ],
-      },
-    },
-  ],
 };