style changes

This commit is contained in:
cv
2021-04-06 13:09:58 +02:00
parent 0868920400
commit e20d9d91ae
6 changed files with 85 additions and 67 deletions
@@ -5,14 +5,13 @@ function display(seconds) {
const hours = seconds / 3600;
const minutes = (seconds % 3600) / 60;
if (hours < 1) return [minutes, seconds % 60].map(format).join(':');
else return [hours, minutes, seconds % 60].map(format).join(':');
return [hours, minutes, seconds % 60].map(format).join(':');
}
export default function Countdown({ time, small }) {
return (
<div className={small ? styles.countdownClockSmall : styles.countdownClock}>
{time === null ? '- -:- -' : display(time * 60)}
{time === null ? '-- : -- : --' : display(time)}
</div>
);
}
@@ -1,21 +1,26 @@
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;800&display=swap');
.countdownClock {
/* Common */
.countdownClock,
.countdownClockSmall {
font-family: 'Open Sans', sans-serif;
line-height: 0.9;
}
/* Viewers */
.countdownClock {
font-size: 18vw;
margin-top: 6vh;
margin-bottom: 5vh;
text-align: center;
letter-spacing: 0.125em;
line-height: 0.9;
}
/* Editor */
.countdownClockSmall {
font-family: 'Open Sans', sans-serif;
font-size: 6em;
font-size: 4em;
text-align: center;
letter-spacing: 0.1em;
line-height: 0.9;
font-weight: 600;
color: #333;
}