bterkuile/fizzy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #1825 from basecamp/clean-media-queries

Browse Source 
Consistent breakpoints for min- and max-width
This commit is contained in:
Andy Smith
2025-12-02 17:12:10 -06:00
committed by GitHub
parent aef5520a36 ccd8d5736b
commit c1881ffb15
3 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/assets/stylesheets/buttons.css
+1 -1
View File
@@ -104,7 +104,7 @@
} }
/* Make a normal button circular on mobile */ /* Make a normal button circular on mobile */
@media (max-width: 640px) { @media (max-width: 639px) {
.btn--circle-mobile { .btn--circle-mobile {
aspect-ratio: 1; aspect-ratio: 1;
padding: 0.5em; padding: 0.5em;
app/assets/stylesheets/card-perma.css
+4 -4
View File
@@ -78,7 +78,7 @@
.card__meta, .card__meta,
.card__stages { .card__stages {
@media (min-width: 639px) { @media (min-width: 640px) {
font-size: var(--text-small); font-size: var(--text-small);
} }
} }
@@ -119,14 +119,14 @@
inset: calc(var(--bubble-size) / -4) calc(var(--bubble-size) / 1.5) auto auto; inset: calc(var(--bubble-size) / -4) calc(var(--bubble-size) / 1.5) auto auto;
translate: 0 0; translate: 0 0;
@media (max-width: 800px) { @media (max-width: 799px) {
--bubble-size: 4.5rem; --bubble-size: 4.5rem;
inset: calc(var(--bubble-size) / 1.5) 0 auto auto; inset: calc(var(--bubble-size) / 1.5) 0 auto auto;
} }
} }
@media (max-width: 800px) { @media (max-width: 799px) {
--padding-inline: var(--main-padding); --padding-inline: var(--main-padding);
column-gap: 0; column-gap: 0;
@@ -169,7 +169,7 @@
.card-perma__actions--left { grid-area: actions-left; } .card-perma__actions--left { grid-area: actions-left; }
.card-perma__actions--right { grid-area: actions-right; } .card-perma__actions--right { grid-area: actions-right; }
@media (max-width: 800px) { @media (max-width: 799px) {
.card-perma__actions { .card-perma__actions {
display: flex; display: flex;
padding-inline: var(--padding-inline); padding-inline: var(--padding-inline);
app/assets/stylesheets/reactions.css
+1 -1
View File
@@ -190,7 +190,7 @@
gap: var(--inline-space-half); gap: var(--inline-space-half);
grid-template-columns: repeat(10, 1fr); grid-template-columns: repeat(10, 1fr);
@media (max-width: 630px) { @media (max-width: 639px) {
grid-template-columns: repeat(6, 1fr); grid-template-columns: repeat(6, 1fr);
} }