gnh1201/mastodon
1
0
Fork 0
mirror of https://github.com/mastodon/mastodon.git synced 2025-11-29 10:53:39 +00:00
Code Issues Actions 16 Packages Projects Releases Wiki Activity

Fix scroll shift caused by fetch-all-replies alerts (#36807)

Browse Source
This commit is contained in:
diondiondion 2025-11-10 16:33:56 +01:00 committed by GitHub
parent 9a42d00c12
commit 400943cb4e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/mastodon/features/status/components/refresh_controller.tsx
View File

@ -295,7 +295,7 @@ export const RefreshController: React.FC<{
if (loadingState === 'loading') { if (loadingState === 'loading') {
return ( return (
<div <div
className='load-more load-gap' className='load-more load-more--large'
aria-busy aria-busy
aria-live='polite' aria-live='polite'
aria-label={intl.formatMessage(messages.loadingInitial)} aria-label={intl.formatMessage(messages.loadingInitial)}

16
app/javascript/styles/mastodon/components.scss
View File

@ -3181,20 +3181,21 @@ a.account__display-name {
} }
.column__alert { .column__alert {
--alert-height: 54px;
position: sticky; position: sticky;
bottom: 0; bottom: 0;
z-index: 10; z-index: 10;
box-sizing: border-box; box-sizing: border-box;
display: grid; display: grid;
grid-template-rows: minmax(var(--alert-height), max-content);
align-items: end;
width: 100%; width: 100%;
max-width: 360px; max-width: 360px;
padding: 1rem; padding: 1rem;
margin: auto auto 0; margin: auto auto 0;
overflow: clip; overflow: clip;
pointer-events: none;
&:empty {
padding: 0;
}
@media (max-width: #{$mobile-menu-breakpoint - 1}) { @media (max-width: #{$mobile-menu-breakpoint - 1}) {
// Compensate for mobile menubar // Compensate for mobile menubar
@ -3205,6 +3206,7 @@ a.account__display-name {
// Make all nested alerts occupy the same space // Make all nested alerts occupy the same space
// rather than stack // rather than stack
grid-area: 1 / 1; grid-area: 1 / 1;
pointer-events: initial;
} }
} }
@ -4484,6 +4486,11 @@ a.status-card {
box-sizing: border-box; box-sizing: border-box;
text-decoration: none; text-decoration: none;
&--large {
padding-block: 32px;
}
&:is(button) {
&:hover { &:hover {
background: var(--on-surface-color); background: var(--on-surface-color);
} }
@ -4492,6 +4499,7 @@ a.status-card {
outline: 2px solid $ui-button-focus-outline-color; outline: 2px solid $ui-button-focus-outline-color;
outline-offset: -2px; outline-offset: -2px;
} }
}
.icon { .icon {
width: 22px; width: 22px;