rsnext/examples/with-unstated/components/Clock.js
Joe Haddad 18a9c7e371
Improve linting rules to catch more errors (#9374)
* Update `packages/`

* Update examples

* Update tests

* Update bench

* Update top level files

* Fix build

* trigger
2019-11-10 19:24:53 -08:00

28 lines
613 B
JavaScript

export default ({
clock: {
state: { lastUpdate, light },
},
}) => {
return (
<div className={light ? 'light' : ''}>
{format(new Date(lastUpdate))}
<style jsx>{`
div {
padding: 15px;
display: inline-block;
color: #82fa58;
font: 50px menlo, monaco, monospace;
background-color: #000;
}
.light {
background-color: #999;
}
`}</style>
</div>
)
}
const format = t =>
`${pad(t.getUTCHours())}:${pad(t.getUTCMinutes())}:${pad(t.getUTCSeconds())}`
const pad = n => (n < 10 ? `0${n}` : n)