IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

FIX: Enforce 'prefix' notation for media-query ranges (#30913)

Browse Source 
"context" notation is not supported in iOS < 16.4, and we don't have any
post-processing on our CSS files which can automatically make that
conversion.

For now, changing the stylelint config to enforce the more-compatible
syntax, and updating all occurences.
This commit is contained in:
David Taylor 2025-01-21 23:42:17 +00:00 committed by GitHub
parent 9b100db91c
commit c266e4acb8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
33 changed files with 85 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
app/assets/stylesheets/common/admin/admin_base.scss
View File

@ -90,7 +90,7 @@ $mobile-breakpoint: 700px;
position: relative; position: relative;
.nav-stacked { .nav-stacked {
@media screen and (width <= 700px) { @media screen and (max-width: 700px) {
margin: 0; margin: 0;
} }
} }
@ -108,7 +108,7 @@ $mobile-breakpoint: 700px;
&.admin-site-settings-category { &.admin-site-settings-category {
overflow: hidden; overflow: hidden;
@media (width <= 500px) { @media (max-width: 500px) {
background-color: var(--primary-very-low); background-color: var(--primary-very-low);
} }
} }
@ -143,7 +143,7 @@ $mobile-breakpoint: 700px;
display: none; display: none;
} }
@media screen and (width <= 970px) and (width >= 768px) { @media screen and (max-width: 970px) and (min-width: 768px) {
td, td,
th { th {
padding: 6px 4px; padding: 6px 4px;
@ -173,7 +173,7 @@ $mobile-breakpoint: 700px;
.admin-contents table.grid { .admin-contents table.grid {
// Table switches to grid for narrow screens // Table switches to grid for narrow screens
@media screen and (width <= 767px) { @media screen and (max-width: 767px) {
thead { thead {
display: none; display: none;
} }
@ -240,7 +240,7 @@ $mobile-breakpoint: 700px;
} }
} }
@media screen and (width >= 550px) { @media screen and (min-width: 550px) {
tr { tr {
grid-template-columns: repeat(6, 1fr); grid-template-columns: repeat(6, 1fr);
} }
@ -587,7 +587,7 @@ $mobile-breakpoint: 700px;
.username { .username {
input[type="text"] { input[type="text"] {
min-width: 15em; min-width: 15em;
@media screen and (width <= 500px) { @media screen and (max-width: 500px) {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
} }
@ -608,7 +608,7 @@ $mobile-breakpoint: 700px;
.search-logs-filter { .search-logs-filter {
margin-left: auto; margin-left: auto;
@media screen and (width <= 700px) { @media screen and (max-width: 700px) {
flex: 1 1 100%; flex: 1 1 100%;
margin-left: 0; margin-left: 0;
} }
@ -788,7 +788,7 @@ $mobile-breakpoint: 700px;
// Hide the search checkbox for very small screens // Hide the search checkbox for very small screens
// Todo: find somewhere to display it - probably requires switching its order in the html // Todo: find somewhere to display it - probably requires switching its order in the html
@media (width <= 550px) { @media (max-width: 550px) {
display: none; display: none;
} }
} }
@ -840,7 +840,7 @@ $mobile-breakpoint: 700px;
z-index: z("base") - 1; z-index: z("base") - 1;
width: 250px; width: 250px;
} }
@media (width <= 500px) { @media (max-width: 500px) {
width: 50%; width: 50%;
} }
@ -875,7 +875,7 @@ $mobile-breakpoint: 700px;
transition: transform 0.3s ease; transition: transform 0.3s ease;
@include transform(translateX(250px)); @include transform(translateX(250px));
} }
@media (width <= 500px) { @media (max-width: 500px) {
transition: transform 0.3s ease; transition: transform 0.3s ease;
@include transform(translateX(50%)); @include transform(translateX(50%));
} }
@ -945,7 +945,7 @@ section.details {
} }
} }
@media all and (width >= 320px) and (width <= 500px) { @media all and (min-width: 320px) and (max-width: 500px) {
.full-width { .full-width {
margin: 0; margin: 0;
} }

4
app/assets/stylesheets/common/admin/admin_filter.scss
View File

@ -6,14 +6,14 @@
.admin-filter__input-container { .admin-filter__input-container {
min-width: 50%; min-width: 50%;
@media screen and (width <= 500px) { @media screen and (max-width: 500px) {
width: 100%; width: 100%;
} }
input { input {
min-width: 15em; min-width: 15em;
margin: 0; margin: 0;
@media screen and (width <= 500px) { @media screen and (max-width: 500px) {
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
} }

2
app/assets/stylesheets/common/admin/admin_report.scss
View File

@ -213,7 +213,7 @@
border-bottom: 1px solid var(--primary-low); border-bottom: 1px solid var(--primary-low);
padding-bottom: 0.5em; padding-bottom: 0.5em;
@media screen and (width <= 400px) { @media screen and (max-width: 400px) {
flex-wrap: wrap; flex-wrap: wrap;
} }

2
app/assets/stylesheets/common/admin/admin_report_counters.scss
View File

@ -26,7 +26,7 @@
} }
} }
@media screen and (width <= 400px) { @media screen and (max-width: 400px) {
&.title .d-icon { &.title .d-icon {
display: none; display: none;
} }

12
app/assets/stylesheets/common/admin/customize.scss
View File

@ -200,11 +200,11 @@
justify-content: space-between; justify-content: space-between;
width: 79.7%; width: 79.7%;
@media screen and (width <= 700px) { @media screen and (max-width: 700px) {
width: 100%; width: 100%;
} }
@media screen and (width >= 700px) and (width <= 768px) { @media screen and (min-width: 700px) and (max-width: 768px) {
width: 73%; width: 73%;
} }
@ -386,10 +386,10 @@
max-height: 60vh; max-height: 60vh;
border-bottom-right-radius: var(--d-border-radius); border-bottom-right-radius: var(--d-border-radius);
border-bottom-left-radius: var(--d-border-radius); border-bottom-left-radius: var(--d-border-radius);
@media screen and (height <= 1000px) { @media screen and (max-height: 1000px) {
max-height: 50vh; max-height: 50vh;
} }
@media screen and (height <= 800px) { @media screen and (max-height: 800px) {
max-height: 40vh; max-height: 40vh;
} }
border-right: 1px solid var(--primary-low); border-right: 1px solid var(--primary-low);
@ -937,7 +937,7 @@
width: calc(100% - 10px); width: calc(100% - 10px);
} }
} }
@media screen and (width <= 880px) { @media screen and (max-width: 880px) {
table.grid { table.grid {
thead { thead {
display: none; display: none;
@ -961,7 +961,7 @@
} }
} }
@media screen and (width <= 580px) { @media screen and (max-width: 580px) {
table.grid { table.grid {
tr td.editing-input { tr td.editing-input {
grid-column-start: 1; grid-column-start: 1;

6
app/assets/stylesheets/common/admin/dashboard.scss
View File

@ -109,7 +109,7 @@
border-bottom: 1px solid var(--primary-low); border-bottom: 1px solid var(--primary-low);
padding-bottom: 0.5em; padding-bottom: 0.5em;
@media screen and (width <= 400px) { @media screen and (max-width: 400px) {
flex-wrap: wrap; flex-wrap: wrap;
} }
@ -197,7 +197,7 @@
} }
} }
@media screen and (width <= 400px) { @media screen and (max-width: 400px) {
flex-wrap: wrap; flex-wrap: wrap;
.storage-stats, .storage-stats,
@ -547,7 +547,7 @@
.update-header { .update-header {
flex: 1 1 100%; flex: 1 1 100%;
@media screen and (width <= 650px) { @media screen and (max-width: 650px) {
margin: 0; margin: 0;
} }

14
app/assets/stylesheets/common/admin/staff_logs.scss
View File

@ -9,7 +9,7 @@
.staff-actions { .staff-actions {
width: 100%; width: 100%;
word-wrap: break-word; word-wrap: break-word;
@media screen and (width >= 550px) and (width <= 767px) { @media screen and (min-width: 550px) and (max-width: 767px) {
table.staff-logs tr { table.staff-logs tr {
display: grid; display: grid;
grid-template-rows: auto auto; grid-template-rows: auto auto;
@ -169,10 +169,10 @@
.combobox { .combobox {
width: 140px; width: 140px;
} }
@media screen and (width >= 900px) { @media screen and (min-width: 900px) {
margin-left: auto; margin-left: auto;
} }
@media screen and (width <= 899px) { @media screen and (max-width: 899px) {
margin-top: 1em; margin-top: 1em;
} }
} }
@ -193,13 +193,13 @@ table.screened-ip-addresses {
} }
} }
@media screen and (width >= 550px) { @media screen and (min-width: 550px) {
table.screened-ip-addresses tr { table.screened-ip-addresses tr {
grid-template-columns: repeat(5, 1fr) auto; grid-template-columns: repeat(5, 1fr) auto;
} }
} }
@media screen and (width <= 549px) { @media screen and (max-width: 549px) {
table.screened-ip-addresses tr { table.screened-ip-addresses tr {
td.actions { td.actions {
grid-row: 3; grid-row: 3;
@ -382,7 +382,7 @@ table.search-logs-list {
td.term { td.term {
width: 60%; width: 60%;
word-wrap: break-word; word-wrap: break-word;
@media screen and (width <= 767px) { @media screen and (max-width: 767px) {
width: 100%; width: 100%;
} }
} }
@ -391,7 +391,7 @@ table.search-logs-list {
td:not(.term) { td:not(.term) {
text-align: center; text-align: center;
} }
@media screen and (width >= 550px) { @media screen and (min-width: 550px) {
tr { tr {
td.term { td.term {
grid-column-start: 1; grid-column-start: 1;

2
app/assets/stylesheets/common/base/activation.scss
View File

@ -24,7 +24,7 @@
padding: 2rem 3rem; padding: 2rem 3rem;
background: var(--secondary); background: var(--secondary);
margin: 10vh auto 1em auto; margin: 10vh auto 1em auto;
@media screen and (height <= 700px) { @media screen and (max-height: 700px) {
margin: 1em auto 1em auto; margin: 1em auto 1em auto;
} }
} }

4
app/assets/stylesheets/common/base/compose.scss
View File

@ -23,7 +23,7 @@ html.composer-open {
max-width: 740px; max-width: 740px;
} }
@media screen and (width <= 1200px) { @media screen and (max-width: 1200px) {
min-width: 0; min-width: 0;
} }
z-index: z("composer", "content"); z-index: z("composer", "content");
@ -165,7 +165,7 @@ html.composer-open {
margin-right: 5px; margin-right: 5px;
max-width: 100px; max-width: 100px;
@include ellipsis; @include ellipsis;
@media screen and (width <= 500px) { @media screen and (max-width: 500px) {
display: none; display: none;
} }
} }

2
app/assets/stylesheets/common/base/crawler_layout.scss
View File

@ -138,7 +138,7 @@ body > noscript {
width: 20%; width: 20%;
} }
@media (width <= 850px) { @media (max-width: 850px) {
table-layout: auto; table-layout: auto;
margin: 0; margin: 0;

6
app/assets/stylesheets/common/base/magnific-popup.scss
View File

@ -532,8 +532,8 @@ button {
} }
@if $include-mobile-layout-for-image { @if $include-mobile-layout-for-image {
@media all and (width <= 800px) and (orientation: landscape), @media all and (max-width: 800px) and (orientation: landscape),
screen and (height <= 300px) { screen and (max-height: 300px) {
/** /**
* Remove all paddings around the image on small screen * Remove all paddings around the image on small screen
*/ */
@ -599,7 +599,7 @@ button {
} }
// Scale navigation arrows and reduce padding from sides // Scale navigation arrows and reduce padding from sides
@media all and (width <= 900px) { @media all and (max-width: 900px) {
.mfp-arrow { .mfp-arrow {
@include transform(scale(0.75)); @include transform(scale(0.75));
} }

4
app/assets/stylesheets/common/base/menu-panel.scss
View File

@ -134,7 +134,7 @@
position: relative; position: relative;
border-radius: 0; border-radius: 0;
padding: 0.857em; padding: 0.857em;
@media screen and (height <= 400px) { @media screen and (max-height: 400px) {
// helps with 400% zoom level // helps with 400% zoom level
font-size: var(--font-down-1); font-size: var(--font-down-1);
padding: 0.5em 0.875em; padding: 0.5em 0.875em;
@ -150,7 +150,7 @@
right: 6px; right: 6px;
top: 6px; top: 6px;
font-size: var(--font-down-3); font-size: var(--font-down-3);
@media screen and (height <= 400px) { @media screen and (max-height: 400px) {
// helps with 400% zoom level // helps with 400% zoom level
right: 0; right: 0;
top: 0; top: 0;

2
app/assets/stylesheets/common/base/modal.scss
View File

@ -368,7 +368,7 @@
width: calc(100% - 36px); width: calc(100% - 36px);
padding: 10px 4px 4px 4px; padding: 10px 4px 4px 4px;
} }
@media screen and (width <= 760px) { @media screen and (max-width: 760px) {
.incoming-email-html-part { .incoming-email-html-part {
width: calc(100% - 10px); width: calc(100% - 10px);
} }

6
app/assets/stylesheets/common/base/not-found.scss
View File

@ -18,7 +18,7 @@
.page-not-found-topics { .page-not-found-topics {
display: flex; display: flex;
@media screen and (width <= 600px) { @media screen and (max-width: 600px) {
flex-wrap: wrap; flex-wrap: wrap;
} }
} }
@ -30,7 +30,7 @@
max-width: 400px; max-width: 400px;
margin-bottom: 40px; margin-bottom: 40px;
padding-right: 20px; padding-right: 20px;
@media screen and (width <= 600px) { @media screen and (max-width: 600px) {
width: 100%; width: 100%;
} }
@ -44,7 +44,7 @@
flex-wrap: wrap; flex-wrap: wrap;
align-items: baseline; align-items: baseline;
margin-bottom: 15px; margin-bottom: 15px;
@media screen and (width <= 600px) { @media screen and (max-width: 600px) {
&:nth-of-type(n + 6) { &:nth-of-type(n + 6) {
display: none; display: none;
} }

2
app/assets/stylesheets/common/base/onebox.scss
View File

@ -154,7 +154,7 @@ aside.onebox {
img:not(.avatar, .onebox-avatar-inline) { img:not(.avatar, .onebox-avatar-inline) {
max-height: 170px; max-height: 170px;
max-width: 20%; max-width: 20%;
@media all and (width <= 600px) { @media all and (max-width: 600px) {
max-width: 35%; max-width: 35%;
} }
height: auto; height: auto;

4
app/assets/stylesheets/common/base/topic-post.scss
View File

@ -689,7 +689,7 @@ aside.quote {
.buttons { .buttons {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@media screen and (width <= 420px) { @media screen and (max-width: 420px) {
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
@ -1344,7 +1344,7 @@ span.mention {
} }
} }
@media all and (width <= 767px) { @media all and (max-width: 767px) {
.reply-to-tab { .reply-to-tab {
span { span {
display: none; display: none;

6
app/assets/stylesheets/common/base/topic.scss
View File

@ -51,7 +51,7 @@
} }
// timeline // timeline
@media screen and (width >= 925px) { @media screen and (min-width: 925px) {
// at 925px viewport width and above the timeline is visible (see topic-navigation.js) // at 925px viewport width and above the timeline is visible (see topic-navigation.js)
.topic-navigation { .topic-navigation {
grid-area: timeline; grid-area: timeline;
@ -94,7 +94,7 @@
} }
// progress bar // progress bar
@media screen and (width <= 924px) { @media screen and (max-width: 924px) {
grid-template-areas: "posts"; grid-template-areas: "posts";
grid-template-columns: auto; grid-template-columns: auto;
@ -193,7 +193,7 @@
.title-wrapper { .title-wrapper {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@media screen and (width >= 925px) { @media screen and (min-width: 925px) {
width: 90%; // topic title isn't full-width on wide screens width: 90%; // topic title isn't full-width on wide screens
} }
} }

6
app/assets/stylesheets/common/base/user-badges.scss
View File

@ -44,7 +44,7 @@
} }
} }
@media all and (width <= 750px) { @media all and (max-width: 750px) {
.show-badge .user-badge-with-posts .badge-user a.post-link { .show-badge .user-badge-with-posts .badge-user a.post-link {
width: auto; width: auto;
} }
@ -231,7 +231,7 @@
h3 { h3 {
margin-bottom: 0.25em; margin-bottom: 0.25em;
font-size: var(--font-up-1); font-size: var(--font-up-1);
@media screen and (width >= 900px) { @media screen and (min-width: 900px) {
font-size: var(--font-up-2); font-size: var(--font-up-2);
} }
} }
@ -242,7 +242,7 @@
width: 100%; width: 100%;
align-self: flex-start; align-self: flex-start;
@media screen and (width >= 767px) { @media screen and (min-width: 767px) {
max-width: calc(var(--d-max-width) / 2); max-width: calc(var(--d-max-width) / 2);
} }

2
app/assets/stylesheets/common/base/user.scss
View File

@ -520,7 +520,7 @@
} }
} }
@media all and (width <= 600px) { @media all and (max-width: 600px) {
float: none; float: none;
width: 100%; width: 100%;
} }

4
app/assets/stylesheets/common/components/topic-map.scss
View File

@ -51,7 +51,7 @@ body:not(.archetype-private_message) {
&.--op, &.--op,
&.--bottom { &.--bottom {
@media screen and (width <= 500px) { @media screen and (max-width: 500px) {
padding-left: 0; padding-left: 0;
} }
} }
@ -253,7 +253,7 @@ body:not(.archetype-private_message) {
color: var(--primary-medium); color: var(--primary-medium);
} }
@media screen and (width <= 475px) { @media screen and (max-width: 475px) {
display: none; display: none;
} }
} }

2
app/assets/stylesheets/common/login/invite-signup.scss
View File

@ -81,7 +81,7 @@
padding: 2rem 3rem; padding: 2rem 3rem;
background: var(--secondary); background: var(--secondary);
margin: 0 auto; margin: 0 auto;
@media screen and (width <= 700px) { @media screen and (max-width: 700px) {
margin: 1em auto 1em auto; margin: 1em auto 1em auto;
padding: 1rem; padding: 1rem;
} }

2
app/assets/stylesheets/common/modal/login-modal.scss
View File

@ -166,7 +166,7 @@
} }
.desktop-view & { .desktop-view & {
@media screen and (width <= 767px) { @media screen and (max-width: 767px) {
// important to maintain narrow desktop widths // important to maintain narrow desktop widths
// for auth modals in Discourse Hub on iPad // for auth modals in Discourse Hub on iPad
.d-modal__header { .d-modal__header {

2
app/assets/stylesheets/common/modal/modal-overrides.scss
View File

@ -343,7 +343,7 @@
} }
} }
@media screen and (width <= 768px) { @media screen and (max-width: 768px) {
.d-modal { .d-modal {
&__container { &__container {
width: 100%; width: 100%;

6
app/assets/stylesheets/common/topic-timeline.scss
View File

@ -20,7 +20,7 @@
transition: max-height 0.4s ease-out; transition: max-height 0.4s ease-out;
} }
@media screen and (height <= 425px) { @media screen and (max-height: 425px) {
max-height: 75vh; max-height: 75vh;
} }
@ -53,7 +53,7 @@
box-shadow: var(--shadow-composer); box-shadow: var(--shadow-composer);
padding: 20px 0; padding: 20px 0;
z-index: z("fullscreen"); z-index: z("fullscreen");
@media screen and (height <= 425px) { @media screen and (max-height: 425px) {
padding-top: 10px; padding-top: 10px;
} }
@ -78,7 +78,7 @@
line-height: var(--line-height-large); line-height: var(--line-height-large);
display: block; display: block;
@include line-clamp(8); @include line-clamp(8);
@media screen and (height <= 425px) { @media screen and (max-height: 425px) {
@include line-clamp(5); @include line-clamp(5);
} }
} }

6
app/assets/stylesheets/desktop/category-list.scss
View File

@ -170,13 +170,13 @@
} }
div.column.categories { div.column.categories {
@media all and (width <= 600px) { @media all and (max-width: 600px) {
margin-right: 0; margin-right: 0;
} }
@media all and (width >= 600px) { @media all and (min-width: 600px) {
margin-right: 1em; margin-right: 1em;
} }
@media all and (width >= 700px) { @media all and (min-width: 700px) {
margin-right: 2em; margin-right: 2em;
} }
} }

2
app/assets/stylesheets/desktop/login-signup-page.scss
View File

@ -47,7 +47,7 @@
height: 100%; height: 100%;
} }
@media screen and (width <= 767px) { @media screen and (max-width: 767px) {
// important to maintain narrow desktop widths // important to maintain narrow desktop widths
// for auth modals in Discourse Hub on iPad // for auth modals in Discourse Hub on iPad
.has-alt-auth { .has-alt-auth {

2
app/assets/stylesheets/desktop/topic-post.scss
View File

@ -750,7 +750,7 @@ span.highlighted {
/* Tablet (portrait) ----------- */ /* Tablet (portrait) ----------- */
@media all and (width <= 790px) { @media all and (max-width: 790px) {
.topic-avatar { .topic-avatar {
width: 45px; width: 45px;
} }

2
app/assets/stylesheets/mobile/components/user-card.scss
View File

@ -105,7 +105,7 @@
} }
.public-user-fields { .public-user-fields {
@media screen and (height <= 550px) { @media screen and (max-height: 550px) {
max-height: 12vh; max-height: 12vh;
} }
max-height: 40vh; max-height: 40vh;

2
app/assets/stylesheets/mobile/modal.scss
View File

@ -82,7 +82,7 @@ html:not(.keyboard-visible.mobile-view) {
font-size: var(--font-up-4); font-size: var(--font-up-4);
} }
@media only screen and (device-width <= 568px) { @media only screen and (max-device-width: 568px) {
.flag-modal-body .flag-message { .flag-modal-body .flag-message {
height: 3em; height: 3em;
} }

2
app/assets/stylesheets/mobile/topic-post.scss
View File

@ -138,7 +138,7 @@ nav.post-controls button.reply .d-icon {
.post-admin-menu { .post-admin-menu {
bottom: -50px; bottom: -50px;
left: 135px; left: 135px;
@media screen and (width <= 374px) { @media screen and (max-width: 374px) {
left: 50px; left: 50px;
} }
} }

26
app/assets/stylesheets/wizard.scss
View File

@ -57,7 +57,7 @@ body.wizard {
@include breakpoint("mobile-extra-large") { @include breakpoint("mobile-extra-large") {
height: 50px; height: 50px;
} }
@media screen and (height <= 900px) { @media screen and (max-height: 900px) {
.desktop-view & { .desktop-view & {
display: none; display: none;
} }
@ -182,7 +182,7 @@ body.wizard {
&__field.text-governing-law, &__field.text-governing-law,
&__field.text-city-for-disputes { &__field.text-city-for-disputes {
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
display: none; display: none;
} }
} }
@ -202,7 +202,7 @@ body.wizard {
box-sizing: border-box; box-sizing: border-box;
margin-right: 1em; margin-right: 1em;
@media only screen and (width <= 925px) { @media only screen and (max-width: 925px) {
width: 100%; width: 100%;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@ -215,7 +215,7 @@ body.wizard {
border-radius: 0.5em; border-radius: 0.5em;
margin-top: -1em; margin-top: -1em;
@media only screen and (width <= 925px) { @media only screen and (max-width: 925px) {
display: none; display: none;
} }
} }
@ -312,7 +312,7 @@ body.wizard {
&__step-form { &__step-form {
flex: 1 0 50%; flex: 1 0 50%;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
width: 100%; width: 100%;
} }
} }
@ -344,7 +344,7 @@ body.wizard {
&__step-text { &__step-text {
display: inline; display: inline;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
display: none; display: none;
} }
} }
@ -549,7 +549,7 @@ body.wizard {
margin: 0; margin: 0;
} }
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
font-size: var(--font-0); font-size: var(--font-0);
} }
} }
@ -558,7 +558,7 @@ body.wizard {
color: var(--primary-high); color: var(--primary-high);
font-size: var(--font-up-1); font-size: var(--font-up-1);
margin: 0.25em 0 0.5em 3.5em; margin: 0.25em 0 0.5em 3.5em;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
margin-left: 2em; margin-left: 2em;
} }
} }
@ -619,7 +619,7 @@ body.wizard {
position: relative; position: relative;
vertical-align: middle; vertical-align: middle;
transition: background 0.25s; transition: background 0.25s;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
height: 20px; height: 20px;
width: 35px; width: 35px;
} }
@ -637,7 +637,7 @@ body.wizard {
color: var(--secondary); color: var(--secondary);
top: 4px; top: 4px;
left: 9px; left: 9px;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
top: 3px; top: 3px;
left: 5px; left: 5px;
font-size: var(--font-down-3); font-size: var(--font-down-3);
@ -652,7 +652,7 @@ body.wizard {
top: 4px; top: 4px;
left: 4px; left: 4px;
transition: left 0.25s; transition: left 0.25s;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
height: 12px; height: 12px;
width: 12px; width: 12px;
} }
@ -671,7 +671,7 @@ body.wizard {
&__checkbox:checked + .wizard-container__checkbox-slider::before { &__checkbox:checked + .wizard-container__checkbox-slider::before {
left: 26px; left: 26px;
@media only screen and (width <= 568px) { @media only screen and (max-width: 568px) {
left: 20px; left: 20px;
} }
} }
@ -750,7 +750,7 @@ body.wizard {
.wizard-congratulations-wrap { .wizard-congratulations-wrap {
display: flex; display: flex;
gap: 1em; gap: 1em;
@media screen and (width <= 750px) { @media screen and (max-width: 750px) {
flex-direction: column-reverse; flex-direction: column-reverse;
} }
} }

2
plugins/discourse-presence/assets/stylesheets/presence.scss
View File

@ -75,7 +75,7 @@
// When topic progress is visible in the posts grid area and is sticky, // When topic progress is visible in the posts grid area and is sticky,
// adjust positioning so presence is on the same line // adjust positioning so presence is on the same line
@media screen and (width <= 924px) { @media screen and (max-width: 924px) {
body:has(.topic-navigation.with-topic-progress) body:has(.topic-navigation.with-topic-progress)
.topic-above-footer-buttons-outlet.presence { .topic-above-footer-buttons-outlet.presence {
margin-top: -3.2em; margin-top: -3.2em;

1
stylelint.config.mjs
View File

@ -39,5 +39,6 @@ export default {
"scss/comment-no-empty": null, "scss/comment-no-empty": null,
"function-linear-gradient-no-nonstandard-direction": null, "function-linear-gradient-no-nonstandard-direction": null,
"scss/at-mixin-pattern": null, "scss/at-mixin-pattern": null,
"media-feature-range-notation": "prefix",
}, },
}; };