Andrei Dekterev
3 years ago
parent
a7eb04b6f4
commit
e60b59dde8
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 229 B |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 908 B |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 451 B |
@ -1,243 +0,0 @@ |
|||||||
import { |
|
||||||
Table, |
|
||||||
Thead, |
|
||||||
Th, |
|
||||||
Tbody, |
|
||||||
Tr, |
|
||||||
Td, |
|
||||||
PlayerNum, |
|
||||||
ParamShortTitle, |
|
||||||
} from './styled' |
|
||||||
|
|
||||||
export const PlayersTable = () => ( |
|
||||||
<Table> |
|
||||||
<Thead> |
|
||||||
<Th /> |
|
||||||
<Th> |
|
||||||
<ParamShortTitle>Min</ParamShortTitle> |
|
||||||
</Th> |
|
||||||
<Th sorted> |
|
||||||
<ParamShortTitle>Pt</ParamShortTitle> |
|
||||||
</Th> |
|
||||||
<Th> |
|
||||||
<ParamShortTitle>Reb</ParamShortTitle> |
|
||||||
</Th> |
|
||||||
<Th> |
|
||||||
<ParamShortTitle>Ass</ParamShortTitle> |
|
||||||
</Th> |
|
||||||
<Th> |
|
||||||
<ParamShortTitle>To</ParamShortTitle> |
|
||||||
</Th> |
|
||||||
</Thead> |
|
||||||
<Tbody> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
<Tr> |
|
||||||
<Td><PlayerNum>57</PlayerNum> Selikhov</Td> |
|
||||||
<Td clickable>97</Td> |
|
||||||
<Td sorted>12</Td> |
|
||||||
<Td>2</Td> |
|
||||||
<Td>1</Td> |
|
||||||
<Td>4</Td> |
|
||||||
</Tr> |
|
||||||
</Tbody> |
|
||||||
</Table> |
|
||||||
) |
|
||||||
@ -1,86 +0,0 @@ |
|||||||
import styled, { css } from 'styled-components/macro' |
|
||||||
|
|
||||||
import { customScrollbar } from 'features/Common' |
|
||||||
|
|
||||||
export const Table = styled.table` |
|
||||||
width: 100%; |
|
||||||
border-radius: 5px; |
|
||||||
border-collapse: collapse;
|
|
||||||
letter-spacing: -0.078px; |
|
||||||
background-color: #333333; |
|
||||||
table-layout: fixed; |
|
||||||
|
|
||||||
${customScrollbar} |
|
||||||
` |
|
||||||
|
|
||||||
export const Thead = styled.thead` |
|
||||||
height: 45px; |
|
||||||
border-bottom: 0.5px solid rgba(255, 255, 255, 0.5); |
|
||||||
` |
|
||||||
|
|
||||||
type ThProps = { |
|
||||||
sorted?: boolean, |
|
||||||
} |
|
||||||
|
|
||||||
export const Th = styled.th<ThProps>` |
|
||||||
font-size: 11px; |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
text-transform: uppercase; |
|
||||||
|
|
||||||
:first-child { |
|
||||||
width: 115px; |
|
||||||
} |
|
||||||
|
|
||||||
${({ sorted }) => (sorted |
|
||||||
? '' |
|
||||||
: css` |
|
||||||
opacity: 0.5; |
|
||||||
`)}
|
|
||||||
` |
|
||||||
|
|
||||||
export const ParamShortTitle = styled.span`` |
|
||||||
|
|
||||||
export const Tbody = styled.tbody`` |
|
||||||
|
|
||||||
export const Tr = styled.tr` |
|
||||||
height: 45px; |
|
||||||
border-bottom: 0.5px solid rgba(255, 255, 255, 0.5); |
|
||||||
|
|
||||||
:last-child { |
|
||||||
border-bottom: none; |
|
||||||
} |
|
||||||
` |
|
||||||
|
|
||||||
type TdProps = { |
|
||||||
clickable?: boolean, |
|
||||||
sorted?: boolean, |
|
||||||
} |
|
||||||
|
|
||||||
export const Td = styled.td<TdProps>` |
|
||||||
font-size: 11px; |
|
||||||
text-align: center; |
|
||||||
color: ${({ clickable, theme }) => (clickable ? '#5EB2FF' : theme.colors.white)}; |
|
||||||
|
|
||||||
:first-child { |
|
||||||
padding-left: 13px; |
|
||||||
text-align: left; |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
${({ sorted }) => (sorted |
|
||||||
? css` |
|
||||||
font-weight: bold; |
|
||||||
` |
|
||||||
: '')} |
|
||||||
|
|
||||||
${({ clickable }) => (clickable |
|
||||||
? css` |
|
||||||
cursor: pointer; |
|
||||||
` |
|
||||||
: '')} |
|
||||||
` |
|
||||||
|
|
||||||
export const PlayerNum = styled.span` |
|
||||||
color: rgba(255, 255, 255, 0.5); |
|
||||||
` |
|
||||||
@ -1,31 +0,0 @@ |
|||||||
import isEmpty from 'lodash/isEmpty' |
|
||||||
|
|
||||||
import type { Playlists, PlaylistOption } from 'features/MatchPage/types' |
|
||||||
import type { MatchInfo } from 'requests' |
|
||||||
|
|
||||||
import { PlayersPlaylists } from '../PlayersPlaylists' |
|
||||||
|
|
||||||
type Props = { |
|
||||||
onSelect: (option: PlaylistOption) => void, |
|
||||||
playlists: Playlists, |
|
||||||
profile: MatchInfo, |
|
||||||
selectedPlaylist?: PlaylistOption, |
|
||||||
} |
|
||||||
|
|
||||||
export const TabPlayers = ({ |
|
||||||
onSelect, |
|
||||||
playlists, |
|
||||||
profile, |
|
||||||
selectedPlaylist, |
|
||||||
}: Props) => { |
|
||||||
if (isEmpty(playlists.players.team1)) return null |
|
||||||
|
|
||||||
return ( |
|
||||||
<PlayersPlaylists |
|
||||||
profile={profile} |
|
||||||
players={playlists.players} |
|
||||||
selectedMathPlaylist={selectedPlaylist} |
|
||||||
onSelect={onSelect} |
|
||||||
/> |
|
||||||
) |
|
||||||
} |
|
||||||
@ -1,5 +0,0 @@ |
|||||||
export enum Tabs { |
|
||||||
TEAMS, |
|
||||||
TEAM1, |
|
||||||
TEAM2, |
|
||||||
} |
|
||||||
@ -1,34 +0,0 @@ |
|||||||
import { Tooltip } from 'features/Tooltip' |
|
||||||
|
|
||||||
import { PlayersTable } from '../PlayersTable' |
|
||||||
import { TeamsStats } from '../TeamsStats' |
|
||||||
|
|
||||||
import { |
|
||||||
Container, |
|
||||||
Header, |
|
||||||
TabList, |
|
||||||
Tab, |
|
||||||
Switch, |
|
||||||
SwitchTitle, |
|
||||||
SwitchButton, |
|
||||||
} from './styled' |
|
||||||
|
|
||||||
export const TabStats = () => ( |
|
||||||
<Container> |
|
||||||
<Header> |
|
||||||
<TabList> |
|
||||||
<Tab selected>Teams</Tab> |
|
||||||
<Tab>DIN</Tab> |
|
||||||
<Tab>SPA</Tab> |
|
||||||
</TabList> |
|
||||||
<Switch> |
|
||||||
<SwitchTitle>Final Stats</SwitchTitle> |
|
||||||
<SwitchButton> |
|
||||||
<Tooltip lexic='others' /> |
|
||||||
</SwitchButton> |
|
||||||
</Switch> |
|
||||||
</Header> |
|
||||||
<PlayersTable /> |
|
||||||
{/* <TeamsStats /> */} |
|
||||||
</Container> |
|
||||||
) |
|
||||||
@ -1,108 +0,0 @@ |
|||||||
import styled, { css } from 'styled-components/macro' |
|
||||||
|
|
||||||
import { TooltipWrapper } from 'features/Tooltip' |
|
||||||
|
|
||||||
export const Container = styled.div`` |
|
||||||
|
|
||||||
export const Header = styled.div` |
|
||||||
display: flex; |
|
||||||
justify-content: space-between; |
|
||||||
margin-bottom: 23px; |
|
||||||
` |
|
||||||
|
|
||||||
export const TabList = styled.div.attrs({ role: 'tablist' })` |
|
||||||
display: flex; |
|
||||||
` |
|
||||||
|
|
||||||
type TabProps = { |
|
||||||
selected?: boolean, |
|
||||||
} |
|
||||||
|
|
||||||
export const Tab = styled.div.attrs(({ selected }: TabProps) => ({ |
|
||||||
'aria-pressed': selected, |
|
||||||
role: 'tab', |
|
||||||
}))<TabProps>` |
|
||||||
display: flex; |
|
||||||
justify-content: space-between; |
|
||||||
align-items: center; |
|
||||||
padding: 0 15px 10px; |
|
||||||
font-size: 12px; |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
opacity: ${({ selected }) => (selected ? '1' : '0.4')}; |
|
||||||
cursor: pointer; |
|
||||||
border-bottom: 2px solid transparent; |
|
||||||
|
|
||||||
|
|
||||||
${({ selected, theme }) => (selected |
|
||||||
? css` |
|
||||||
border-color: ${theme.colors.white}; |
|
||||||
` |
|
||||||
: '')} |
|
||||||
` |
|
||||||
|
|
||||||
export const Switch = styled.div` |
|
||||||
display: flex; |
|
||||||
` |
|
||||||
|
|
||||||
export const SwitchTitle = styled.span` |
|
||||||
font-size: 12px; |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
` |
|
||||||
|
|
||||||
export const SwitchButton = styled.button` |
|
||||||
position: relative; |
|
||||||
width: 20px; |
|
||||||
height: 7px; |
|
||||||
margin-left: 5px; |
|
||||||
margin-top: 5px; |
|
||||||
border-radius: 2px; |
|
||||||
border: none; |
|
||||||
border: 1px solid ${({ theme }) => theme.colors.white}; |
|
||||||
cursor: pointer; |
|
||||||
|
|
||||||
${TooltipWrapper} { |
|
||||||
left: auto; |
|
||||||
right: 0; |
|
||||||
padding: 2px 10px; |
|
||||||
border-radius: 6px; |
|
||||||
transform: none; |
|
||||||
|
|
||||||
::before { |
|
||||||
display: none; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
:hover { |
|
||||||
${TooltipWrapper} { |
|
||||||
display: block; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
${({ theme }) => (true // Позже будет добавлен пропс
|
|
||||||
? css` |
|
||||||
background-image: linear-gradient( |
|
||||||
to right, |
|
||||||
${theme.colors.white} 33.333%, |
|
||||||
${theme.colors.black} 33.333%, |
|
||||||
${theme.colors.black} 66.666%, |
|
||||||
${theme.colors.white} 66.666%, |
|
||||||
${theme.colors.white} 72%, |
|
||||||
${theme.colors.black} 72%, |
|
||||||
${theme.colors.black} 100%) |
|
||||||
` |
|
||||||
: css` |
|
||||||
border-color: transparent; |
|
||||||
background-image: linear-gradient( |
|
||||||
to right, |
|
||||||
${theme.colors.white} 33.333%, |
|
||||||
${theme.colors.black} 33.333%, |
|
||||||
${theme.colors.black} 38%, |
|
||||||
${theme.colors.white} 38%, |
|
||||||
${theme.colors.white} 66.666%, |
|
||||||
${theme.colors.black} 66.666%, |
|
||||||
${theme.colors.black} 72%, |
|
||||||
${theme.colors.white} 72%, |
|
||||||
${theme.colors.white} 100%) |
|
||||||
` |
|
||||||
)} |
|
||||||
` |
|
||||||
@ -1,276 +0,0 @@ |
|||||||
import { |
|
||||||
Container, |
|
||||||
Row, |
|
||||||
TeamShortName, |
|
||||||
ParamValueContainer, |
|
||||||
ParamValue, |
|
||||||
ParamTitle, |
|
||||||
} from './styled' |
|
||||||
|
|
||||||
export const TeamsStats = () => ( |
|
||||||
<Container> |
|
||||||
<Row> |
|
||||||
<TeamShortName>DIN</TeamShortName> |
|
||||||
<TeamShortName>SPA</TeamShortName> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue clickable>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue clickable>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<ParamValueContainer> |
|
||||||
<ParamValue>90</ParamValue> |
|
||||||
</ParamValueContainer> |
|
||||||
<ParamTitle>Points</ParamTitle> |
|
||||||
<ParamValue>123</ParamValue> |
|
||||||
</Row> |
|
||||||
</Container> |
|
||||||
) |
|
||||||
@ -1,56 +0,0 @@ |
|||||||
import styled, { css } from 'styled-components/macro' |
|
||||||
|
|
||||||
import { customScrollbar } from 'features/Common' |
|
||||||
|
|
||||||
export const Container = styled.div` |
|
||||||
width: 100%; |
|
||||||
font-size: 11px; |
|
||||||
background-color: #333333; |
|
||||||
|
|
||||||
${customScrollbar} |
|
||||||
` |
|
||||||
|
|
||||||
export const TeamShortName = styled.span` |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
letter-spacing: -0.078px; |
|
||||||
text-transform: uppercase; |
|
||||||
font-weight: 600; |
|
||||||
opacity: 0.5; |
|
||||||
` |
|
||||||
|
|
||||||
export const Row = styled.div` |
|
||||||
display: flex; |
|
||||||
justify-content: space-between; |
|
||||||
align-items: center; |
|
||||||
height: 45px; |
|
||||||
padding: 0 12px; |
|
||||||
border-bottom: 0.5px solid rgba(255, 255, 255, 0.5); |
|
||||||
|
|
||||||
:last-child { |
|
||||||
border-bottom: none; |
|
||||||
} |
|
||||||
` |
|
||||||
|
|
||||||
export const ParamValueContainer = styled.div`` |
|
||||||
|
|
||||||
type TParamValue = { |
|
||||||
clickable?: boolean, |
|
||||||
} |
|
||||||
|
|
||||||
export const ParamValue = styled.span<TParamValue>` |
|
||||||
color: ${({ clickable, theme }) => (clickable ? '#5EB2FF' : theme.colors.white)}; |
|
||||||
|
|
||||||
${({ clickable }) => (clickable |
|
||||||
? css` |
|
||||||
cursor: pointer; |
|
||||||
` |
|
||||||
: '')} |
|
||||||
` |
|
||||||
|
|
||||||
export const ParamTitle = styled.span` |
|
||||||
color: ${({ theme }) => theme.colors.white}; |
|
||||||
letter-spacing: -0.078px; |
|
||||||
text-transform: uppercase; |
|
||||||
font-weight: 600; |
|
||||||
opacity: 0.5; |
|
||||||
` |
|
||||||
@ -1,6 +1,5 @@ |
|||||||
export enum Tabs { |
export enum Tabs { |
||||||
WATCH, |
WATCH, |
||||||
EVENTS, |
EVENTS, |
||||||
STATS, |
VIDEO |
||||||
PLAYERS, |
|
||||||
} |
} |
||||||
|
|||||||
Loading…
Reference in new issue