This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const TeamRank = styled.span``; | |
const StatValue = styled.span``; | |
const StatName = styled.span``; | |
const StatRow = ({ stat }) => { | |
const { away, home } = stat; | |
return <div></div> | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const TeamRank = styled.span``; | |
const StatValue = styled.span``; | |
const StatName = styled.span``; | |
const StatRow = ({ stat }) => { | |
const { away, home } = stat; | |
return ( |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const Stat = styled.div` | |
display: flex; | |
flex-direction: row; | |
align-items: center; | |
justify-content: space-between; | |
width: 100%; | |
`; | |
const TeamRank = styled.span` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<Stat> | |
<div> | |
<TeamRank>#{away.team_rank}</TeamRank> | |
<StatValue>{away.stat_value}</StatValue> | |
</div> | |
<StatName>{away.stat_name}</StatName> | |
<div> | |
<StatValue>{home.stat_value}</StatValue> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const TeamRank = styled.span` | |
color: #333; | |
margin-left: ${(props) => props.marginLeft || 0}px; | |
margin-right: ${(props) => props.marginRight || 0}px; | |
font-family: "Noto Sans JP", sans-serif; | |
color: #777; | |
`; | |
const StatValue = styled.span` | |
color: white; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<Stat> | |
<div> | |
<TeamRank marginRight={10}>#{away.team_rank}</TeamRank> | |
<StatValue>{away.stat_value}</StatValue> | |
</div> | |
<StatName>{away.stat_name}</StatName> | |
<div> | |
<StatValue>{home.stat_value}</StatValue> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// other code omitted for brevity | |
const BarGroup = styled.div` | |
display: flex; | |
flex-direction: row; | |
align-items: center; | |
justify-content: space-between; | |
width: 100%; | |
`; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const Bar = styled.div` | |
position: relative; | |
height: 8px; | |
width: 49%; | |
background-color: #eeeeee; | |
border-radius: 50px; | |
margin-top: 2.5px; | |
`; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const StatRow = ({ stat }) => { | |
const { away, home } = stat; | |
return ( | |
<div> | |
<Stat> | |
<div> | |
<TeamRank marginRight={10}>#{away.team_rank}</TeamRank> | |
<StatValue>{away.stat_value}</StatValue> | |
</div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const Filler = styled.div` | |
background-color: ${(props) => props.color || "transparent"}; | |
width: ${(props) => props.width}%; | |
height: 100%; | |
border-radius: 50px; | |
`; |