diff --git a/src/features/MatchPage/styled.tsx b/src/features/MatchPage/styled.tsx index a0c1816f..8e73e154 100644 --- a/src/features/MatchPage/styled.tsx +++ b/src/features/MatchPage/styled.tsx @@ -4,7 +4,7 @@ import { devices } from 'config/devices' import { isMobileDevice } from 'config/userAgent' export const Wrapper = styled.div` - width: 100%; + width: 96%; height: calc(100vh - 115px); margin: 20px 0px 0 10px; display: flex; @@ -27,8 +27,8 @@ export const Wrapper = styled.div` ` export const Container = styled.div` - width: 100%; - max-width: 2090px; + //width: 100%; + min-width: 83%; max-height: 896px; display: flex; flex-direction: column; diff --git a/src/features/MatchSidePlaylists/components/TabVideo/components/VideoDate/styled.tsx b/src/features/MatchSidePlaylists/components/TabVideo/components/VideoDate/styled.tsx index 40d7ded7..21c84fbc 100644 --- a/src/features/MatchSidePlaylists/components/TabVideo/components/VideoDate/styled.tsx +++ b/src/features/MatchSidePlaylists/components/TabVideo/components/VideoDate/styled.tsx @@ -11,7 +11,7 @@ export const Wrapper = styled.div` height: 5%; > :not(:last-child) { - margin-right: 20px; + margin-right: 2%; } ${isMobileDevice ? css` @@ -28,7 +28,7 @@ export const WeekDay = styled.div.attrs(() => ({ }))<{isActive?: boolean}>` position: relative; color: rgba(255, 255, 255, 0.5); - font-size: 12px; + font-size: 0.6rem; white-space: nowrap; padding: 5px; cursor: pointer; diff --git a/src/features/MatchSidePlaylists/styled.tsx b/src/features/MatchSidePlaylists/styled.tsx index ef12517f..647111c4 100644 --- a/src/features/MatchSidePlaylists/styled.tsx +++ b/src/features/MatchSidePlaylists/styled.tsx @@ -6,6 +6,7 @@ import { isMobileDevice } from 'config/userAgent' import { customScrollbar } from 'features/Common' export const Wrapper = styled.div` + min-width: 17%; max-height: 896px; ${isMobileDevice ? css` @@ -34,11 +35,11 @@ type TContainer = { } export const Container = styled.div` - width: 320px; + //width: 320px; padding: 14px 10px 0 14px; height: 96%; max-height: calc(100vh - 130px); - overflow-y: ${({ forVideoTab }) => (forVideoTab ? 'hidden' : 'auto')}; + overflow: ${({ forVideoTab }) => (forVideoTab ? 'hidden' : 'auto')}; ${customScrollbar} diff --git a/src/features/StreamPlayer/styled.tsx b/src/features/StreamPlayer/styled.tsx index 7d01845f..990851ab 100644 --- a/src/features/StreamPlayer/styled.tsx +++ b/src/features/StreamPlayer/styled.tsx @@ -107,7 +107,7 @@ export const PlayerWrapper = styled.div` ? css`aspect-ratio: 16 / 9;` : css` height: 0px; - padding-top: 56.25%; + object-fit: cover; `} ${isMobileDevice diff --git a/src/features/UserFavorites/styled.tsx b/src/features/UserFavorites/styled.tsx index f541f7d6..cd7da2fd 100644 --- a/src/features/UserFavorites/styled.tsx +++ b/src/features/UserFavorites/styled.tsx @@ -19,6 +19,7 @@ export const UserSportFavWrapper = styled.aside` top: 0; bottom: 0; z-index: 10; + width: 4%; ${isMobileDevice ? css`