Change background color of notifications on private messages (#31657)

This commit is contained in:
Claire 2024-08-30 11:42:48 +02:00 committed by GitHub
parent 35538fe694
commit 3ddeaca863
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 11 additions and 3 deletions

View file

@ -9,7 +9,7 @@ import { navigateToStatus } from 'mastodon/actions/statuses';
import type { IconProp } from 'mastodon/components/icon'; import type { IconProp } from 'mastodon/components/icon';
import { Icon } from 'mastodon/components/icon'; import { Icon } from 'mastodon/components/icon';
import { RelativeTimestamp } from 'mastodon/components/relative_timestamp'; import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
import { useAppDispatch } from 'mastodon/store'; import { useAppSelector, useAppDispatch } from 'mastodon/store';
import { AvatarGroup } from './avatar_group'; import { AvatarGroup } from './avatar_group';
import { DisplayedName } from './displayed_name'; import { DisplayedName } from './displayed_name';
@ -60,6 +60,10 @@ export const NotificationGroupWithStatus: React.FC<{
[labelRenderer, accountIds, count, labelSeeMoreHref], [labelRenderer, accountIds, count, labelSeeMoreHref],
); );
const isPrivateMention = useAppSelector(
(state) => state.statuses.getIn([statusId, 'visibility']) === 'direct',
);
const handlers = useMemo( const handlers = useMemo(
() => ({ () => ({
open: () => { open: () => {
@ -79,7 +83,10 @@ export const NotificationGroupWithStatus: React.FC<{
role='button' role='button'
className={classNames( className={classNames(
`notification-group focusable notification-group--${type}`, `notification-group focusable notification-group--${type}`,
{ 'notification-group--unread': unread }, {
'notification-group--unread': unread,
'notification-group--direct': isPrivateMention,
},
)} )}
tabIndex={0} tabIndex={0}
> >

View file

@ -1626,7 +1626,8 @@ body > [data-popper-placement] {
} }
.status__wrapper-direct, .status__wrapper-direct,
.notification-ungrouped--direct { .notification-ungrouped--direct,
.notification-group--direct {
background: rgba($ui-highlight-color, 0.05); background: rgba($ui-highlight-color, 0.05);
&:focus { &:focus {