[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
This commit is contained in:
Zoë Bijl
2025-10-15 21:08:31 +02:00
parent 59c8cb987f
commit 25af845912
34 changed files with 155 additions and 168 deletions
@@ -1,7 +1,7 @@
$emojis-requiring-inversion: 'back' 'copyright' 'curly_loop' 'currency_exchange' $emojis-requiring-inversion: "back" "copyright" "curly_loop" "currency_exchange"
'end' 'heavy_check_mark' 'heavy_division_sign' 'heavy_dollar_sign' "end" "heavy_check_mark" "heavy_division_sign" "heavy_dollar_sign"
'heavy_minus_sign' 'heavy_multiplication_x' 'heavy_plus_sign' 'on' "heavy_minus_sign" "heavy_multiplication_x" "heavy_plus_sign" "on"
'registered' 'soon' 'spider' 'telephone_receiver' 'tm' 'top' 'wavy_dash' !default; "registered" "soon" "spider" "telephone_receiver" "tm" "top" "wavy_dash" !default;
%emoji-color-inversion { %emoji-color-inversion {
filter: invert(1); filter: invert(1);
@@ -9,7 +9,7 @@ $emojis-requiring-inversion: 'back' 'copyright' 'curly_loop' 'currency_exchange'
.emojione { .emojione {
@each $emoji in $emojis-requiring-inversion { @each $emoji in $emojis-requiring-inversion {
&[title=':#{$emoji}:'] { &[title=":#{$emoji}:"] {
@extend %emoji-color-inversion; @extend %emoji-color-inversion;
} }
} }
@@ -1,4 +1,4 @@
@use 'sass:math'; @use "sass:math";
$no-columns-breakpoint: 600px; $no-columns-breakpoint: 600px;
$sidebar-width: 240px; $sidebar-width: 240px;
@@ -1456,7 +1456,7 @@ a.sparkline {
&::after { &::after {
display: block; display: block;
content: ''; content: "";
width: 50px; width: 50px;
height: 21px; height: 21px;
position: absolute; position: absolute;
@@ -1850,7 +1850,7 @@ a.sparkline {
&::after { &::after {
position: absolute; position: absolute;
content: ''; content: "";
width: 1px; width: 1px;
background: $highlight-text-color; background: $highlight-text-color;
bottom: 0; bottom: 0;
@@ -1,9 +1,9 @@
@function hex-color($color) { @function hex-color($color) {
@if type-of($color) == 'color' { @if type-of($color) == "color" {
$color: str-slice(ie-hex-str($color), 4); $color: str-slice(ie-hex-str($color), 4);
} }
@return '%23' + unquote($color); @return "%23" + unquote($color);
} }
body { body {
@@ -14,7 +14,7 @@ body {
font-weight: 400; font-weight: 400;
color: var(--color-fg); color: var(--color-fg);
text-rendering: optimizelegibility; text-rendering: optimizelegibility;
font-feature-settings: 'kern'; font-feature-settings: "kern";
text-size-adjust: none; text-size-adjust: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
@@ -35,13 +35,13 @@ body {
system-ui, system-ui,
-apple-system, -apple-system,
BlinkMacSystemFont, BlinkMacSystemFont,
'Segoe UI', "Segoe UI",
Oxygen, Oxygen,
Ubuntu, Ubuntu,
Cantarell, Cantarell,
'Fira Sans', "Fira Sans",
'Droid Sans', "Droid Sans",
'Helvetica Neue', "Helvetica Neue",
$font-sans-serif, $font-sans-serif,
sans-serif; sans-serif;
} }
@@ -467,7 +467,7 @@
width: 2px; width: 2px;
height: 24px; height: 24px;
background: var(--color-notifications-lines); background: var(--color-notifications-lines);
content: ''; content: "";
} }
} }
@@ -295,7 +295,7 @@ $ui-header-height: 55px;
&::before { &::before {
display: block; display: block;
content: ''; content: "";
position: absolute; position: absolute;
bottom: -13px; bottom: -13px;
inset-inline-start: 0; inset-inline-start: 0;
@@ -64,7 +64,7 @@
&:focus { &:focus {
outline: 0; outline: 0;
} }
@include single-column('screen and (max-width: 630px)') { @include single-column("screen and (max-width: 630px)") {
font-size: 16px; font-size: 16px;
} }
} }
@@ -103,7 +103,7 @@
color: $highlight-text-color; color: $highlight-text-color;
} }
input[type='checkbox'] { input[type="checkbox"] {
display: none; display: none;
} }
@@ -240,11 +240,11 @@
outline: 0; outline: 0;
} }
@include single-column('screen and (max-width: 630px)') { @include single-column("screen and (max-width: 630px)") {
font-size: 16px; 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 height: 100px !important; // prevent auto-resize textarea
resize: vertical; resize: vertical;
} }
@@ -42,8 +42,8 @@
text-overflow: ellipsis; text-overflow: ellipsis;
cursor: pointer; cursor: pointer;
input[type='radio'], input[type="radio"],
input[type='checkbox'] { input[type="checkbox"] {
display: none; display: none;
} }
@@ -35,8 +35,8 @@ $doodle-background: #d9e1e8;
margin-inline-end: 2px; margin-inline-end: 2px;
} }
input[type='number'], input[type="number"],
input[type='text'] { input[type="text"] {
width: 40px; width: 40px;
} }
@@ -16,11 +16,11 @@
padding-inline-end: 10px; padding-inline-end: 10px;
} }
@include single-column('screen and (max-width: 630px)') { @include single-column("screen and (max-width: 630px)") {
flex: auto; flex: auto;
} }
@include limited-single-column('screen and (max-width: 630px)') { @include limited-single-column("screen and (max-width: 630px)") {
&, &,
&:first-child, &:first-child,
&:last-child { &:last-child {
@@ -34,7 +34,7 @@
flex: 1 1 200px; flex: 1 1 200px;
} }
@include single-column('screen and (max-width: 630px)') { @include single-column("screen and (max-width: 630px)") {
:root & { :root & {
// Overrides `.wide` for single-column view // Overrides `.wide` for single-column view
flex: auto; flex: auto;
@@ -109,11 +109,11 @@
flex: none; flex: none;
@include limited-single-column( @include limited-single-column(
'screen and (max-width: #{$no-gap-breakpoint})' "screen and (max-width: #{$no-gap-breakpoint})"
) { ) {
margin-bottom: 0; margin-bottom: 0;
} }
@include single-column('screen and (max-width: 630px)') { @include single-column("screen and (max-width: 630px)") {
font-size: 16px; font-size: 16px;
} }
} }
@@ -299,7 +299,7 @@
.mbstobon-#{$i} .drawer__inner__mastodon { .mbstobon-#{$i} .drawer__inner__mastodon {
@if $i == 3 { @if $i == 3 {
background: background:
url('~flavours/glitch/images/wave-drawer.png') url("~flavours/glitch/images/wave-drawer.png")
no-repeat no-repeat
bottom / bottom /
100% 100%
@@ -307,7 +307,7 @@
lighten($ui-base-color, 4%); lighten($ui-base-color, 4%);
} @else { } @else {
background: background:
url('~flavours/glitch/images/wave-drawer-glitched.png') url("~flavours/glitch/images/wave-drawer-glitched.png")
no-repeat no-repeat
bottom / bottom /
100% 100%
@@ -316,7 +316,7 @@
} }
& > .mastodon { & > .mastodon {
background: url('~flavours/glitch/images/mbstobon-ui-#{$i}.png') background: url("~flavours/glitch/images/mbstobon-ui-#{$i}.png")
no-repeat no-repeat
left left
bottom / bottom /
@@ -174,7 +174,7 @@
&:hover::before { &:hover::before {
z-index: 0; z-index: 0;
content: ''; content: "";
position: absolute; position: absolute;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
@@ -1,26 +1,26 @@
@import 'misc'; @import "misc";
@import 'boost'; @import "boost";
@import 'accounts'; @import "accounts";
@import 'domains'; @import "domains";
@import 'status'; @import "status";
@import 'modal'; @import "modal";
@import 'compose_form'; @import "compose_form";
@import 'columns'; @import "columns";
@import 'regeneration_indicator'; @import "regeneration_indicator";
@import 'directory'; @import "directory";
@import 'search'; @import "search";
@import 'emoji'; @import "emoji";
@import 'doodle'; @import "doodle";
@import 'drawer'; @import "drawer";
@import 'media'; @import "media";
@import 'sensitive'; @import "sensitive";
@import 'lists'; @import "lists";
@import 'emoji_picker'; @import "emoji_picker";
@import 'local_settings'; @import "local_settings";
@import 'single_column'; @import "single_column";
@import 'announcements'; @import "announcements";
@import 'explore'; @import "explore";
@import 'scrollbars'; @import "scrollbars";
@import 'signed_out'; @import "signed_out";
@import 'privacy_policy'; @import "privacy_policy";
@import 'about'; @import "about";
@@ -267,7 +267,7 @@
} }
.onboarding-modal__page__wrapper-0 { .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; auto 250px;
height: 100%; height: 100%;
padding: 0; padding: 0;
@@ -1204,7 +1204,7 @@
width: 100px; width: 100px;
height: 100px; height: 100px;
transform: translate(-50%, -50%); 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%; border-radius: 50%;
box-shadow: 0 0 0 9999em rgba($base-shadow-color, 0.35); box-shadow: 0 0 0 9999em rgba($base-shadow-color, 0.35);
} }
@@ -87,14 +87,14 @@
counter-increment: list-counter; counter-increment: list-counter;
&::before { &::before {
content: counter(list-counter) '.'; content: counter(list-counter) ".";
position: absolute; position: absolute;
inset-inline-start: 0; inset-inline-start: 0;
} }
} }
ul > li::before { ul > li::before {
content: ''; content: "";
position: absolute; position: absolute;
background-color: $darker-text-color; background-color: $darker-text-color;
border-radius: 50%; border-radius: 50%;
@@ -216,6 +216,7 @@
&.status-direct { &.status-direct {
--color-status-bg: #{mix($ui-base-color, $ui-highlight-color, 95%)}; --color-status-bg: #{mix($ui-base-color, $ui-highlight-color, 95%)};
border-bottom-color: lighten($ui-base-color, 12%); border-bottom-color: lighten($ui-base-color, 12%);
} }
@@ -1,3 +1,3 @@
@import 'contrast/variables'; @import "contrast/variables";
@import 'index'; @import "index";
@import 'contrast/diff'; @import "contrast/diff";
@@ -309,9 +309,9 @@ code {
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border-radius: 4px; border-radius: 4px;
background: url('images/void.png'); background: url("images/void.png");
&[src$='missing.png'] { &[src$="missing.png"] {
visibility: hidden; visibility: hidden;
} }
@@ -404,7 +404,7 @@ code {
flex: 1 1 auto; flex: 1 1 auto;
} }
input[type='checkbox'] { input[type="checkbox"] {
position: absolute; position: absolute;
inset-inline-start: 0; inset-inline-start: 0;
top: 5px; top: 5px;
@@ -420,12 +420,12 @@ code {
border-radius: 4px; border-radius: 4px;
} }
input[type='text'], input[type="text"],
input[type='number'], input[type="number"],
input[type='email'], input[type="email"],
input[type='password'], input[type="password"],
input[type='url'], input[type="url"],
input[type='datetime-local'], input[type="datetime-local"],
textarea { textarea {
box-sizing: border-box; box-sizing: border-box;
font-size: 16px; font-size: 16px;
@@ -463,11 +463,11 @@ code {
} }
} }
input[type='text'], input[type="text"],
input[type='number'], input[type="number"],
input[type='email'], input[type="email"],
input[type='password'], input[type="password"],
input[type='datetime-local'] { input[type="datetime-local"] {
&:focus:invalid:not(:placeholder-shown), &:focus:invalid:not(:placeholder-shown),
&:required:invalid:not(:placeholder-shown) { &:required:invalid:not(:placeholder-shown) {
border-color: lighten($error-red, 12%); border-color: lighten($error-red, 12%);
@@ -479,11 +479,11 @@ code {
color: lighten($error-red, 12%); color: lighten($error-red, 12%);
} }
input[type='text'], input[type="text"],
input[type='number'], input[type="number"],
input[type='email'], input[type="email"],
input[type='password'], input[type="password"],
input[type='datetime-local'], input[type="datetime-local"],
textarea, textarea,
select { select {
border-color: lighten($error-red, 12%); border-color: lighten($error-red, 12%);
@@ -619,7 +619,7 @@ code {
overflow: hidden; overflow: hidden;
&::after { &::after {
content: ''; content: "";
display: block; display: block;
position: absolute; position: absolute;
top: 0; top: 0;
@@ -1019,7 +1019,7 @@ code {
flex: 1 1 auto; flex: 1 1 auto;
} }
input[type='text'] { input[type="text"] {
background: transparent; background: transparent;
border: 0; border: 0;
padding: 10px; padding: 10px;
@@ -1205,7 +1205,7 @@ code {
border-color: $highlight-text-color; border-color: $highlight-text-color;
&::before { &::before {
content: ''; content: "";
width: 10px; width: 10px;
height: 10px; height: 10px;
border-radius: 50%; border-radius: 50%;
@@ -6,8 +6,8 @@
*/ */
/* 🛠️ Config */ /* 🛠️ Config */
@import 'colors'; @import "colors";
@import 'sizes'; @import "sizes";
/* 🧩 Components */ /* 🧩 Components */
@import 'status'; @import "status";
@@ -22,7 +22,7 @@
right: calc(100% + 5px); right: calc(100% + 5px);
width: 20px; width: 20px;
height: 100%; height: 100%;
content: ''; content: "";
background: linear-gradient(90deg, transparent, var(--color-status-bg)); background: linear-gradient(90deg, transparent, var(--color-status-bg));
transition: all 0.2s; transition: all 0.2s;
} }
@@ -1,28 +1,28 @@
@import 'mixins'; @import "mixins";
@import 'variables'; @import "variables";
@import 'styles/fonts/roboto'; @import "styles/fonts/roboto";
@import 'styles/fonts/roboto-mono'; @import "styles/fonts/roboto-mono";
@import 'reset'; @import "reset";
@import 'basics'; @import "basics";
@import 'branding'; @import "branding";
@import 'containers'; @import "containers";
@import 'lists'; @import "lists";
@import 'modal'; @import "modal";
@import 'widgets'; @import "widgets";
@import 'forms'; @import "forms";
@import 'accounts'; @import "accounts";
@import 'statuses'; @import "statuses";
@import 'components/index'; @import "components/index";
@import 'polls'; @import "polls";
@import 'about'; @import "about";
@import 'tables'; @import "tables";
@import 'admin'; @import "admin";
@import 'accessibility'; @import "accessibility";
@import 'rtl'; @import "rtl";
@import 'dashboard'; @import "dashboard";
@import 'rich_text'; @import "rich_text";
@import 'gts'; @import "gts";
@import 'gts/config'; @import "gts/config";
@import 'tangerine/config'; @import "tangerine/config";
@@ -1,5 +1,5 @@
@import 'styles/fonts/roboto'; @import "styles/fonts/roboto";
@import 'reset'; @import "reset";
:root { :root {
--color-bg: #191b22; --color-bg: #191b22;
@@ -91,7 +91,7 @@ button {
} }
} }
input[type='text'] { input[type="text"] {
display: block; display: block;
margin: 0; margin: 0;
padding: 15px; padding: 15px;
@@ -1,4 +1,4 @@
@import 'mastodon-light/variables'; @import "mastodon-light/variables";
@import 'index'; @import "index";
@import 'mastodon-light/diff'; @import "mastodon-light/diff";
@import 'mastodon-light/colors'; @import "mastodon-light/colors";
@@ -40,5 +40,5 @@
/* Status */ /* Status */
--color-status-fg: var(--color-fg); --color-status-fg: var(--color-fg);
--color-status-bg: #fff; --color-status-bg: #fff;
--color-status-bg--focus: hsl(0, 0%, 96%); --color-status-bg--focus: hsl(0deg, 0%, 96%);
} }
@@ -141,7 +141,7 @@ html {
} }
.compose-form__autosuggest-wrapper, .compose-form__autosuggest-wrapper,
.poll__option input[type='text'], .poll__option input[type="text"],
.compose-form .spoiler-input__input, .compose-form .spoiler-input__input,
.compose-form__poll-wrapper select, .compose-form__poll-wrapper select,
.search__input, .search__input,
@@ -495,10 +495,10 @@ html {
} }
.simple_form { .simple_form {
input[type='text'], input[type="text"],
input[type='number'], input[type="number"],
input[type='email'], input[type="email"],
input[type='password'], input[type="password"],
textarea { textarea {
&:hover { &:hover {
border-color: lighten($ui-base-color, 12%); border-color: lighten($ui-base-color, 12%);
@@ -54,4 +54,4 @@ $account-background-color: $white !default;
@return hsl(hue($color), saturation($color), lightness($color) - $amount); @return hsl(hue($color), saturation($color), lightness($color) - $amount);
} }
$emojis-requiring-inversion: 'chains'; $emojis-requiring-inversion: "chains";
@@ -107,11 +107,11 @@ body.rtl {
} }
.fa-chevron-left::before { .fa-chevron-left::before {
content: '\F054'; content: "\F054";
} }
.fa-chevron-right::before { .fa-chevron-right::before {
content: '\F053'; content: "\F053";
} }
.dismissable-banner, .dismissable-banner,
@@ -86,7 +86,7 @@
} }
.embed { .embed {
.status__content[data-spoiler='folded'] { .status__content[data-spoiler="folded"] {
.e-content { .e-content {
display: none; display: none;
} }
@@ -4,7 +4,7 @@
*/ */
/* 🛠️ Config */ /* 🛠️ Config */
@import 'keyframes'; @import "keyframes";
/* 🧩 Components */ /* 🧩 Components */
@import 'status-bar'; @import "status-bar";
@@ -83,9 +83,9 @@ $media-modal-media-max-height: 80%;
$no-gap-breakpoint: 1175px; $no-gap-breakpoint: 1175px;
$font-sans-serif: 'mastodon-font-sans-serif' !default; $font-sans-serif: "mastodon-font-sans-serif" !default;
$font-display: 'mastodon-font-display' !default; $font-display: "mastodon-font-display" !default;
$font-monospace: 'mastodon-font-monospace' !default; $font-monospace: "mastodon-font-monospace" !default;
// Avatar border size (8% default, 100% for rounded avatars) // Avatar border size (8% default, 100% for rounded avatars)
$ui-avatar-border-size: 8%; $ui-avatar-border-size: 8%;
@@ -1,4 +1,4 @@
@use 'sass:math'; @use "sass:math";
.hero-widget { .hero-widget {
margin-bottom: 10px; margin-bottom: 10px;
@@ -1 +1 @@
@import 'flavours/glitch/styles/contrast'; @import "flavours/glitch/styles/contrast";
@@ -1 +1 @@
@import 'flavours/glitch/styles/mastodon-light'; @import "flavours/glitch/styles/mastodon-light";
+2 -2
View File
@@ -1,8 +1,8 @@
@font-face { @font-face {
font-family: mastodon-font-monospace; font-family: mastodon-font-monospace;
src: src:
local('Roboto Mono'), local("Roboto Mono"),
url('~fonts/roboto-mono/robotomono-regular-webfont.woff2') format('woff2'); url("~fonts/roboto-mono/robotomono-regular-webfont.woff2") format("woff2");
font-weight: 400; font-weight: 400;
font-display: swap; font-display: swap;
font-style: normal; font-style: normal;
+8 -8
View File
@@ -1,8 +1,8 @@
@font-face { @font-face {
font-family: mastodon-font-sans-serif; font-family: mastodon-font-sans-serif;
src: src:
local('Roboto Italic'), local("Roboto Italic"),
url('~fonts/roboto/roboto-italic-webfont.woff2') format('woff2'); url("~fonts/roboto/roboto-italic-webfont.woff2") format("woff2");
font-weight: normal; font-weight: normal;
font-display: swap; font-display: swap;
font-style: italic; font-style: italic;
@@ -11,8 +11,8 @@
@font-face { @font-face {
font-family: mastodon-font-sans-serif; font-family: mastodon-font-sans-serif;
src: src:
local('Roboto Bold'), local("Roboto Bold"),
url('~fonts/roboto/roboto-bold-webfont.woff2') format('woff2'); url("~fonts/roboto/roboto-bold-webfont.woff2") format("woff2");
font-weight: bold; font-weight: bold;
font-display: swap; font-display: swap;
font-style: normal; font-style: normal;
@@ -21,8 +21,8 @@
@font-face { @font-face {
font-family: mastodon-font-sans-serif; font-family: mastodon-font-sans-serif;
src: src:
local('Roboto Medium'), local("Roboto Medium"),
url('~fonts/roboto/roboto-medium-webfont.woff2') format('woff2'); url("~fonts/roboto/roboto-medium-webfont.woff2") format("woff2");
font-weight: 500; font-weight: 500;
font-display: swap; font-display: swap;
font-style: normal; font-style: normal;
@@ -31,8 +31,8 @@
@font-face { @font-face {
font-family: mastodon-font-sans-serif; font-family: mastodon-font-sans-serif;
src: src:
local('Roboto'), local("Roboto"),
url('~fonts/roboto/roboto-regular-webfont.woff2') format('woff2'); url("~fonts/roboto/roboto-regular-webfont.woff2") format("woff2");
font-weight: normal; font-weight: normal;
font-display: swap; font-display: swap;
font-style: normal; font-style: normal;
-14
View File
@@ -36,18 +36,4 @@ module.exports = {
"scss/dollar-variable-empty-line-before": null, "scss/dollar-variable-empty-line-before": null,
"scss/no-global-function-names": null, "scss/no-global-function-names": null,
}, },
overrides: [
{
"files": ["app/javascript/styles/mailer.scss"],
rules: {
"property-no-unknown": [
true,
{
ignoreProperties: [
"/^mso-/",
] },
],
},
},
],
}; };