tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix SCSS linting issues (#2207)

Browse Source 
* Disable font-family-no-missing-generic-family-keyword for font-awesome accessibility icons

* Run stylelint --fix

* Avoid `@extend` directives with doodle modal CSS

* Drop use of `@extend` for notification cleanup buttons SCSS

* Run prettier on SCSS
This commit is contained in:
Claire
2023-05-07 15:04:59 +02:00
committed by GitHub
parent a6207d243b
commit 6f64c79ca4
31 changed files with 88 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/flavours/glitch/styles/components/about.scss
View File

@ -136,7 +136,7 @@
margin-bottom: 20px;
}
@media screen and (max-width: 600px) {
@media screen and (width <= 600px) {
display: block;
h4 {

2
app/javascript/flavours/glitch/styles/components/accounts.scss
View File

@ -281,7 +281,7 @@
.notification__message {
margin-inline-start: 42px;
padding-top:8px;
padding-top: 8px;
padding-inline-start: 26px;
cursor: default;
color: $darker-text-color;

10
app/javascript/flavours/glitch/styles/components/columns.scss
View File

@ -79,7 +79,7 @@ $ui-header-height: 55px;
display: none;
}
@media screen and (min-width: 320px) {
@media screen and (width >= 320px) {
.logo--wordmark {
display: block;
}
@ -205,7 +205,7 @@ $ui-header-height: 55px;
&:last-child {
padding: 0;
padding-inline-end: 15px;;
padding-inline-end: 15px;
}
}
@ -441,9 +441,7 @@ $ui-header-height: 55px;
align-items: stretch;
justify-content: space-around;
button {
@extend .column-header__button;
.column-header__button {
background: transparent;
text-align: center;
padding: 10px 5px;
@ -809,7 +807,7 @@ $ui-header-height: 55px;
background: lighten($ui-base-color, 4%);
}
@media screen and (max-width: 600px) {
@media screen and (width <= 600px) {
font-size: 16px;
}
}

4
app/javascript/flavours/glitch/styles/components/doodle.scss
View File

@ -1,8 +1,6 @@
$doodle-background: #d9e1e8;
.doodle-modal {
@extend .boost-modal;
width: unset;
}
@ -16,8 +14,6 @@ $doodle-background: #d9e1e8;
}
.doodle-modal__action-bar {
@extend .boost-modal__action-bar;
.filler {
flex-grow: 1;
margin: 0;

2
app/javascript/flavours/glitch/styles/components/drawer.scss
View File

@ -229,7 +229,7 @@
cursor: inherit;
}
@media screen and (min-height: 640px) {
@media screen and (height >= 640px) {
display: block;
}
}

4
app/javascript/flavours/glitch/styles/components/lists.scss
View File

@ -6,7 +6,7 @@
width: 380px;
overflow: hidden;
@media screen and (max-width: 420px) {
@media screen and (width <= 420px) {
width: 90%;
}
@ -60,7 +60,7 @@
width: 380px;
overflow: hidden;
@media screen and (max-width: 420px) {
@media screen and (width <= 420px) {
width: 90%;
}

2
app/javascript/flavours/glitch/styles/components/local_settings.scss
View File

@ -125,7 +125,7 @@
margin-bottom: 10px;
}
@media screen and (max-width: 630px) {
@media screen and (width <= 630px) {
.glitch.local-settings__navigation {
width: 40px;
flex-shrink: 0;

8
app/javascript/flavours/glitch/styles/components/misc.scss
View File

@ -827,7 +827,7 @@ body > [data-popper-placement] {
overflow: hidden;
}
@media screen and (min-width: 631px) {
@media screen and (width >= 631px) {
.columns-area {
padding: 0;
}
@ -1134,19 +1134,19 @@ body > [data-popper-placement] {
}
}
@media screen and (max-height: 810px) {
@media screen and (height <= 810px) {
.trends__item:nth-of-type(3) {
display: none;
}
}
@media screen and (max-height: 720px) {
@media screen and (height <= 720px) {
.trends__item:nth-of-type(2) {
display: none;
}
}
@media screen and (max-height: 670px) {
@media screen and (height <= 670px) {
display: none;
}

22
app/javascript/flavours/glitch/styles/components/modal.scss
View File

@ -115,7 +115,7 @@
text-align: center;
}
@media screen and (max-width: 550px) {
@media screen and (width <= 550px) {
.onboarding-modal {
width: 100%;
height: 100%;
@ -382,7 +382,7 @@
}
}
@media screen and (max-width: 320px) and (max-height: 600px) {
@media screen and (width <= 320px) and (height <= 600px) {
.onboarding-modal__page p {
font-size: 14px;
line-height: 20px;
@ -413,6 +413,7 @@
margin-inline-start: 10px;
}
.doodle-modal,
.boost-modal,
.confirmation-modal,
.report-modal,
@ -485,6 +486,7 @@
}
}
.doodle-modal__action-bar,
.boost-modal__action-bar,
.confirmation-modal__action-bar,
.mute-modal__action-bar,
@ -560,7 +562,7 @@
font-weight: 700;
margin-bottom: 15px;
@media screen and (max-height: 800px) {
@media screen and (height <= 800px) {
font-size: 22px;
}
}
@ -747,7 +749,7 @@
display: flex;
border-top: 1px solid $ui-secondary-color;
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
flex-wrap: wrap;
overflow-y: auto;
}
@ -758,7 +760,7 @@
box-sizing: border-box;
width: 50%;
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
width: 100%;
}
}
@ -775,13 +777,13 @@
color: $highlight-text-color;
}
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
max-height: 10vh;
}
}
.focal-point-modal__content {
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
max-height: 40vh;
}
}
@ -877,7 +879,7 @@
}
}
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
padding: 10px;
max-width: 100%;
order: 2;
@ -1152,7 +1154,7 @@
background: lighten($ui-base-color, 4%);
}
@media screen and (max-width: 600px) {
@media screen and (width <= 600px) {
font-size: 16px;
}
}
@ -1233,7 +1235,7 @@
}
}
@media screen and (max-width: 480px) {
@media screen and (width <= 480px) {
img,
video {
max-height: 100%;

2
app/javascript/flavours/glitch/styles/components/single_column.scss
View File

@ -94,7 +94,7 @@
}
}
@media screen and (min-width: 600px) {
@media screen and (width >= 600px) {
.tabs-bar__link {
span {
display: inline;