Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-23 00:22:19 +01:00
Code Issues Projects Releases Wiki Activity

chore: use palette.background.alternative for background (#8627)

Browse Source 
The default badge styling uses theme.palette.primary.main for the
color, but this color doesn't give us the contrast we need in dark
mode. The solution is to use theme.palette.background.alternative
instead.

Before:

![image](https://github.com/user-attachments/assets/5fb535ff-1c17-47b9-a818-7b995cd188ae)


After:

![image](https://github.com/user-attachments/assets/43b7aa05-bfd8-4f6c-a9c3-fadb5268429f)
This commit is contained in:
Thomas Heartman 2024-11-01 10:08:16 +01:00 committed by GitHub
parent ea08067534
commit 88e1ec5dc4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/component/events/EventTimeline/EventTimelineEventGroup/EventTimelineEventGroup.tsx
View File

@ -23,6 +23,12 @@ interface IEventTimelineEventProps {
endTime: number;
}
const StyledBadge = styled(Badge)(({ theme }) => ({
'.MuiBadge-badge': {
backgroundColor: theme.palette.background.alternative,
},
}));
export const EventTimelineEventGroup = ({
group,
startTime,
@ -48,13 +54,12 @@ export const EventTimelineEventGroup = ({
maxWidth={350}
arrow
>
<Badge
<StyledBadge
badgeContent={group.length}
color='primary'
invisible={group.length < 2}
>
<EventTimelineEventCircle group={group} />
</Badge>
</StyledBadge>
</HtmlTooltip>
</StyledEvent>
);