style(#2239): fix popup height

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;

src/features/PreferencesPopup/components/TournamentInfo/index.tsx

@@ -43,7 +43,7 @@ type Props = {
 
 export const TournamentInfo = ({ isIcon, tournament }: Props) => (
   <Wrapper>
-    <StyledName nameObj={tournament} />
+    <StyledName nameObj={tournament} className='title' />
     <ItemInfo>
       {isIcon && <SportIcon sport={tournament.sport} />}
       <Flag src={`https://instatscout.com/images/flags/48/${tournament.country.id}.png`} />

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;
+    }
   }
 `