refactor(#2222): delete match description

src/features/MatchPage/components/FinishedMatch/index.tsx

@@ -9,7 +9,6 @@ import { MatchSidePlaylists } from 'features/MatchSidePlaylists'
 import { MultiSourcePlayer } from 'features/MultiSourcePlayer'
 
 import { SettingsPopup } from '../SettingsPopup'
-import { MatchDescription } from '../MatchDescription'
 
 import { useFinishedMatch } from './hooks'
 import { Container } from '../../styled'
@@ -54,7 +53,6 @@ export const FinishedMatch = ({ events, profile }: Props) => {
             onPlayingChange={onPlayingChange}
           />
         )}
-        <MatchDescription profile={profile} />
       </Container>
 
       <MatchSidePlaylists

src/features/MatchPage/components/LiveMatch/index.tsx

@@ -7,7 +7,6 @@ import { StreamPlayer } from 'features/StreamPlayer'
 import { MatchSidePlaylists } from 'features/MatchSidePlaylists'
 
 import { Container } from '../../styled'
-import { MatchDescription } from '../MatchDescription'
 
 import { useLiveMatch } from './hooks'
 
@@ -37,7 +36,6 @@ export const LiveMatch = ({ events, profile }: Props) => {
           resumeFrom={resume}
           url={streamUrl}
         />
-        <MatchDescription profile={profile} />
       </Container>
 
       <MatchSidePlaylists

src/features/MatchPage/styled.tsx

@@ -50,11 +50,12 @@ export const Container = styled.div`
         margin-right: 0;
         padding: 0;
         margin-bottom: 15px;
+        min-height: 32vh;
+
+      @media screen and (orientation: landscape){
+        display: block;
+        margin-bottom: 0;
 
-        @media screen and (orientation: landscape) {
-          display: block;
-          margin-bottom: 0;
-          overflow-y: auto;
         }
       `
     : ''};

src/features/MatchSidePlaylists/styled.tsx

@@ -34,7 +34,7 @@ export const Container = styled.div`
 
   @media ${devices.tablet} {
     max-height: calc(100vh - 40px);
-    margin: 15px auto 0 auto;
+    margin-top: 15px;
   }
 
   ${isMobileDevice

src/features/StreamPlayer/styled.tsx

@@ -300,7 +300,8 @@ export const LiveBtn = styled(ButtonBase)`
 
   ${isMobileDevice
     ? css`
-      margin-right: 7px;
+     @media (max-width: 650px) {
+        margin-right: 7px;
     }
     `
     : ''};

src/features/VideoPlayer/styled.tsx

@@ -6,5 +6,4 @@ export const Video = styled.video`
   left: 0;
   width: 100%;
   height: 100%;
-  object-fit: cover;
 `