Fix modal border and padding inconsistencies (#31399)

This commit is contained in:
Claire 2024-08-13 19:48:28 +02:00 committed by GitHub
parent 2ed13071ef
commit 2b1670da48
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 6 additions and 4 deletions

View file

@ -2837,7 +2837,7 @@ $ui-header-logo-wordmark-width: 99px;
overflow: hidden; overflow: hidden;
} }
@media screen and (width >= 631px) { @media screen and (width > $mobile-breakpoint) {
.columns-area { .columns-area {
padding: 0; padding: 0;
} }
@ -5736,7 +5736,7 @@ a.status-card {
user-select: text; user-select: text;
display: flex; display: flex;
@media screen and (width <= 630px) { @media screen and (width <= $mobile-breakpoint) {
margin-top: auto; margin-top: auto;
} }
} }
@ -6095,7 +6095,7 @@ a.status-card {
border-radius: 0 0 16px 16px; border-radius: 0 0 16px 16px;
border-top: 0; border-top: 0;
@media screen and (max-width: $no-gap-breakpoint) { @media screen and (max-width: $mobile-breakpoint) {
border-radius: 0; border-radius: 0;
border-bottom: 0; border-bottom: 0;
padding-bottom: 32px; padding-bottom: 32px;
@ -9097,8 +9097,9 @@ noscript {
backdrop-filter: var(--background-filter); backdrop-filter: var(--background-filter);
border: 1px solid var(--modal-border-color); border: 1px solid var(--modal-border-color);
padding: 24px; padding: 24px;
box-sizing: border-box;
@media screen and (max-width: $no-gap-breakpoint) { @media screen and (max-width: $mobile-breakpoint) {
border-radius: 16px 16px 0 0; border-radius: 16px 16px 0 0;
border-bottom: 0; border-bottom: 0;
padding-bottom: 32px; padding-bottom: 32px;

View file

@ -88,6 +88,7 @@ $media-modal-media-max-width: 100%;
$media-modal-media-max-height: 80%; $media-modal-media-max-height: 80%;
$no-gap-breakpoint: 1175px; $no-gap-breakpoint: 1175px;
$mobile-breakpoint: 630px;
$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;