From 943e3672bdfc6906855441c5fde580d82a796dfd Mon Sep 17 00:00:00 2001 From: Ruslan Khayrullin Date: Tue, 22 Nov 2022 15:59:28 +0500 Subject: [PATCH] feat(in-142): fixes --- .../components/TabStats/styled.tsx | 1 + .../components/TeamsStatsTable/styled.tsx | 4 +++- src/features/MatchSidePlaylists/styled.tsx | 17 +++++++++++------ 3 files changed, 15 insertions(+), 7 deletions(-) diff --git a/src/features/MatchSidePlaylists/components/TabStats/styled.tsx b/src/features/MatchSidePlaylists/components/TabStats/styled.tsx index 477a56c0..13318a33 100644 --- a/src/features/MatchSidePlaylists/components/TabStats/styled.tsx +++ b/src/features/MatchSidePlaylists/components/TabStats/styled.tsx @@ -62,6 +62,7 @@ export const SwitchButton = styled.button` ${TooltipWrapper} { left: auto; right: 0; + top: 15px; padding: 2px 10px; border-radius: 6px; transform: none; diff --git a/src/features/MatchSidePlaylists/components/TeamsStatsTable/styled.tsx b/src/features/MatchSidePlaylists/components/TeamsStatsTable/styled.tsx index 0eb38886..39b3a3c7 100644 --- a/src/features/MatchSidePlaylists/components/TeamsStatsTable/styled.tsx +++ b/src/features/MatchSidePlaylists/components/TeamsStatsTable/styled.tsx @@ -5,6 +5,9 @@ import { Name } from 'features/Name' export const Container = styled.div` width: 100%; font-size: 11px; + overflow: hidden; + border-radius: 5px; + background-color: #333333; ` export const TeamShortName = styled(Name)` @@ -22,7 +25,6 @@ export const Row = styled.div` height: 45px; padding: 0 12px; border-bottom: 0.5px solid rgba(255, 255, 255, 0.5); - background-color: #333333; :last-child { border-bottom: none; diff --git a/src/features/MatchSidePlaylists/styled.tsx b/src/features/MatchSidePlaylists/styled.tsx index ab6ec05f..75a962a4 100644 --- a/src/features/MatchSidePlaylists/styled.tsx +++ b/src/features/MatchSidePlaylists/styled.tsx @@ -56,6 +56,12 @@ export const TabsGroup = styled.div.attrs({ role: 'tablist' })` : ''}; ` +export const TabTitle = styled(T9n)` + font-size: 8px; + text-transform: uppercase; + color: ${({ theme }) => theme.colors.white}; +` + export const Tab = styled.button.attrs({ role: 'tab' })` display: flex; flex-direction: column; @@ -69,6 +75,11 @@ export const Tab = styled.button.attrs({ role: 'tab' })` &[aria-pressed="true"], :hover { opacity: 1; + + ${TabTitle} { + font-size: 9px; + font-weight: 600; + } } ` @@ -91,12 +102,6 @@ export const TabIcon = styled.div` : '')} ` -export const TabTitle = styled(T9n)` - font-size: 8px; - text-transform: uppercase; - color: ${({ theme }) => theme.colors.white}; -` - type TContainer = { forWatchTab?: boolean, hasScroll: boolean,