From 893978323c5cbc5ac1b1adc2d9ad85f60a9673e6 Mon Sep 17 00:00:00 2001 From: Andrei Dekterev Date: Tue, 15 Feb 2022 15:19:58 +0700 Subject: [PATCH] style(#2239): fix popup height --- src/features/ItemsList/styled.tsx | 3 -- .../components/TournamentInfo/index.tsx | 2 +- src/features/TournamentsPopup/styled.tsx | 44 ++++++++++++++----- 3 files changed, 33 insertions(+), 16 deletions(-) diff --git a/src/features/ItemsList/styled.tsx b/src/features/ItemsList/styled.tsx index 752370c0..29c2d38a 100644 --- a/src/features/ItemsList/styled.tsx +++ b/src/features/ItemsList/styled.tsx @@ -92,9 +92,6 @@ export const TeamOrCountry = styled(NameBase)` font-size: 0.625rem; line-height: 0.75rem; color: rgba(255, 255, 255, 0.7); - :hover { - text-decoration: none; - } ${isMobileDevice ? css` font-size: 10px; diff --git a/src/features/PreferencesPopup/components/TournamentInfo/index.tsx b/src/features/PreferencesPopup/components/TournamentInfo/index.tsx index b1c73dd2..64ff1020 100644 --- a/src/features/PreferencesPopup/components/TournamentInfo/index.tsx +++ b/src/features/PreferencesPopup/components/TournamentInfo/index.tsx @@ -43,7 +43,7 @@ type Props = { export const TournamentInfo = ({ isIcon, tournament }: Props) => ( - + {isIcon && } diff --git a/src/features/TournamentsPopup/styled.tsx b/src/features/TournamentsPopup/styled.tsx index 32c56dd4..e0085f9c 100644 --- a/src/features/TournamentsPopup/styled.tsx +++ b/src/features/TournamentsPopup/styled.tsx @@ -10,20 +10,38 @@ import { customScrollbar } from 'features/Common' import { HeaderTitle } from 'features/PreferencesPopup/styled' export const ScModalContainer = styled(BaseModal)` + background-color: rgba(0, 0, 0, 0.7); + padding: 0 60px; + ${ModalWindow} { - width: 616px; - max-height: 95vh; + width: 679px; + height: 734px; + padding: 0; + background-color: #333333; + border-radius: 5px; overflow-y: auto; - ${customScrollbar} + ${customScrollbar} + + @media (max-width: 1370px) { + max-width: 679px; + height: auto; + } + ${isMobileDevice ? css` - width: 95vw; - ` - : '' -}; - } + @media (max-width: 650px){ + width: 95vw; + height: auto; + top: -7vh; + } + + @media (orientation: landscape){ + min-width: 95vw; + } + ` + : ''}; } ` @@ -57,14 +75,13 @@ export const ScHeaderTitle = styled(HeaderTitle)` ` export const ScTournamentList = styled.div` - width: 50%; + width: 100%; margin-bottom: 20px; ` export const ScList = styled.div` max-width: 212px; margin-top: 20px; - overflow-y: scroll; ` export const StyledLink = styled(ProfileLink)` @@ -75,10 +92,13 @@ export const StyledLink = styled(ProfileLink)` color: white; padding: 10px; - &:hover { - text-decoration: underline; + :hover { background-color: #2d323d; border-radius: 2px; + + & .title { + text-decoration: underline; + } } `