mirrors
/
mastodon-glitch
mirror of https://github.com/glitch-soc/mastodon
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[Glitch] Move filtered notifications bar in scrollable area 

Port 9d0bce4072 to glitch-soc

Co-authored-by: Claire <claire.github-309c@sitedethib.com>
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
pull/2777/head
David Roetzel 2024-07-15 15:42:47 +02:00 committed by Claire
parent 64b2c712d4
commit 70969ac64c
2 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/javascript/flavours/glitch/features/notifications/index.jsx
View File

@ -258,6 +258,13 @@ class Notifications extends PureComponent {
let scrollContainer; let scrollContainer;
const prepend = (
<>
{needsNotificationPermission && <NotificationsPermissionBanner />}
<FilteredNotificationsBanner />
</>
);
if (signedIn) { if (signedIn) {
scrollContainer = ( scrollContainer = (
<ScrollableList <ScrollableList
@ -267,7 +274,7 @@ class Notifications extends PureComponent {
showLoading={isLoading && notifications.size === 0} showLoading={isLoading && notifications.size === 0}
hasMore={hasMore} hasMore={hasMore}
numPending={numPending} numPending={numPending}
prepend={needsNotificationPermission && <NotificationsPermissionBanner />} prepend={prepend}
alwaysPrepend alwaysPrepend
emptyMessage={emptyMessage} emptyMessage={emptyMessage}
onLoadMore={this.handleLoadOlder} onLoadMore={this.handleLoadOlder}
@ -356,8 +363,6 @@ class Notifications extends PureComponent {
{filterBarContainer} {filterBarContainer}
<FilteredNotificationsBanner />
{scrollContainer} {scrollContainer}
<Helmet> <Helmet>

3
app/javascript/flavours/glitch/styles/components.scss
View File

@ -10746,8 +10746,7 @@ noscript {
.filtered-notifications-banner { .filtered-notifications-banner {
display: flex; display: flex;
align-items: center; align-items: center;
border: 1px solid var(--background-border-color); border-bottom: 1px solid var(--background-border-color);
border-top: 0;
padding: 24px 32px; padding: 24px 32px;
gap: 16px; gap: 16px;
color: $darker-text-color; color: $darker-text-color;