diff --git a/src/features/MatchPage/MatchProfileCard/index.tsx b/src/features/MatchPage/MatchProfileCard/index.tsx index f1446190..c18c24d5 100644 --- a/src/features/MatchPage/MatchProfileCard/index.tsx +++ b/src/features/MatchPage/MatchProfileCard/index.tsx @@ -2,6 +2,8 @@ import React, { Fragment } from 'react' import isNull from 'lodash/isNull' +import format from 'date-fns/format' + import { getProfileUrl } from 'helpers' import { ProfileTypes } from 'config' @@ -19,8 +21,11 @@ import { Tournament, Dash, StyledLink, + DateStyled, } from './styled' +const dateFormat = 'dd.MM.yyyy' + type Props = { profile: MatchProfile, } @@ -82,6 +87,7 @@ export const MatchProfileCard = ({ profile }: Props) => { {tournament?.name} + {format(new Date(profile.date), dateFormat)} )} diff --git a/src/features/MatchPage/MatchProfileCard/styled.tsx b/src/features/MatchPage/MatchProfileCard/styled.tsx index 3b840879..8d2b5cb9 100644 --- a/src/features/MatchPage/MatchProfileCard/styled.tsx +++ b/src/features/MatchPage/MatchProfileCard/styled.tsx @@ -11,6 +11,7 @@ export const Wrapper = styled.div` line-height: 24px; color: white; min-height: 28px; + max-width: 1504px; @media ${devices.tablet} { order: 2; @@ -22,7 +23,6 @@ export const Wrapper = styled.div` export const Teams = styled.div` display: flex; - ` export const StyledLink = styled(Link)` @@ -74,3 +74,12 @@ export const Tournament = styled.div` font-size: 11px; } ` + +export const DateStyled = styled.span` + margin-left: auto; + + @media ${devices.tablet} { + margin-top: 4px; + margin-left: 0; + } +` diff --git a/src/requests/getMatchInfo.tsx b/src/requests/getMatchInfo.tsx index ca845319..9a543221 100644 --- a/src/requests/getMatchInfo.tsx +++ b/src/requests/getMatchInfo.tsx @@ -17,7 +17,7 @@ type Team = { } export type MatchInfo = { - date: Date, + date: string, stream_status: MatchStatuses, team1: Team, team2: Team,