filler

index.jsx

const StatRow = ({ stat }) => {
  const { away, home } = stat;

  return (
    <div>
      <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>
          <TeamRank marginLeft={10}>#{home.team_rank}</TeamRank>
        </div>
      </Stat>

      <BarGroup>
        <Bar>
          <Filler
            color="#F5B947"
            width={75}
          />
        </Bar>

        <Bar>
          <Filler
            color="#EE7F31"
            width={50}
          />
        </Bar>
      </BarGroup>
    </div>
  );
};