Use toString.padStart instead of toLocaleString for dual digit display.

feature/webpack
Icedream 2017-08-26 00:34:00 +02:00
parent 392cda25ea
commit d7a42d03f7
Signed by: icedream
GPG Key ID: 1573F6D8EFE4D0CF
1 changed files with 4 additions and 16 deletions

View File

@ -62,34 +62,22 @@ export default class Countdown extends React.Component {
<div className={style.countdown}>
<ProgressCircle size={size} max={3} progress={days} stroke="rgb(76,114,163)">
<DigitBlock suffix="d">
{Math.floor(days).toLocaleString(locale, {
minimumIntegerDigits,
useGrouping,
})}
{Math.floor(days).toString().padStart(2, '0')}
</DigitBlock>
</ProgressCircle>
<ProgressCircle size={size} max={24} progress={hours} stroke="rgb(60, 144, 60)">
<DigitBlock suffix="h">
{Math.floor(hours).toLocaleString(locale, {
minimumIntegerDigits,
useGrouping,
})}
{Math.floor(hours).toString().padStart(2, '0')}
</DigitBlock>
</ProgressCircle>
<ProgressCircle size={size} max={60} progress={minutes} stroke="rgb(160, 154, 40)">
<DigitBlock suffix="m">
{Math.floor(minutes).toLocaleString(locale, {
minimumIntegerDigits,
useGrouping,
})}
{Math.floor(minutes).toString().padStart(2, '0')}
</DigitBlock>
</ProgressCircle>
<ProgressCircle size={size} max={60} progress={seconds} stroke="rgb(193,63,88)">
<DigitBlock suffix="s">
{Math.floor(seconds).toLocaleString(locale, {
minimumIntegerDigits,
useGrouping,
})}
{Math.floor(seconds).toString().padStart(2, '0')}
</DigitBlock>
</ProgressCircle>
</div>