From bc76cf6b339a672edf3426292a1965aa60bff553 Mon Sep 17 00:00:00 2001 From: William Grant Date: Mon, 17 Oct 2022 14:55:47 +1100 Subject: [PATCH] fix: qa feedback - fixed count overflow styling in notificationCount --- .../icon/SessionNotificationCount.tsx | 19 +++++-------------- 1 file changed, 5 insertions(+), 14 deletions(-) diff --git a/ts/components/icon/SessionNotificationCount.tsx b/ts/components/icon/SessionNotificationCount.tsx index e71ba3854..580586cfc 100644 --- a/ts/components/icon/SessionNotificationCount.tsx +++ b/ts/components/icon/SessionNotificationCount.tsx @@ -27,18 +27,9 @@ const StyledCountContainer = styled.div<{ shouldRender: boolean }>` color: var(--unread-messages-alert-text-color); `; -const StyledCount = styled.div<{ countOverflow: boolean }>` +const StyledCount = styled.div` position: relative; - font-size: ${props => (props.countOverflow ? '0.5em' : '0.6em')}; - margin-top: ${props => (props.countOverflow ? '0.35em' : '0em')}; - margin-left: ${props => (props.countOverflow ? '-0.45em' : '0em')}; -`; - -const StyledCountSup = styled.div` - position: absolute; - font-size: 1.3em; - top: -0.5em; - margin-inline-start: 0.375em; + font-size: 0.6em; `; export const SessionNotificationCount = (props: Props) => { @@ -49,16 +40,16 @@ export const SessionNotificationCount = (props: Props) => { if (overflow) { return ( - + {9} - + + + ); } return ( - {count} + {count} ); };