Rauchmelder

This commit is contained in:
cupcakearmy
2019-03-05 01:21:52 +01:00
commit 958c051298
12 changed files with 349 additions and 0 deletions

42
src/App.styl Normal file
View File

@@ -0,0 +1,42 @@
@import url('https://fonts.googleapis.com/css?family=PT+Sans')
*
box-sizing border-box
html
body
#root
margin 0
padding 0
width 100vw
height 100vh
overflow hidden
font-family 'PT Sans', sans-serif
font-weight bold
#app
height: 100%
width: 100%
//background-color #eeffee
background linear-gradient(45deg, #111, #222)
color #fff
display flex
justify-content center
align-items center
text-align center
@media (min-width: 0px)
#text
font-size 3em
#title
font-size 2em
@media (min-width: 900px)
#text
font-size 4em
#title
font-size 3em
@media (min-width: 1200px)
#text
font-size 5em
#title
font-size 4em

31
src/App.tsx Normal file
View File

@@ -0,0 +1,31 @@
import moment from 'moment'
import React, { useEffect, useState } from 'react'
// @ts-ignore
const App: React.FC = () => {
const [refresh, setRefresh] = useState<number>(0)
const gloryTime = moment('2019-02-12').unix()
const now = Date.now() / 1000 | 0
const delta = moment.duration(now - gloryTime, 'seconds')
useEffect(()=> {
setTimeout(()=> setRefresh(refresh + 1), 1000)
}, [refresh])
return <div id="app">
<div>
<div id={'title'}>Rauchmelder 💨</div>
<br/>
<div id={'text'}>
{delta.humanize()}
<br/>
{delta.asSeconds()}
</div>
</div>
</div>
}
export default App

14
src/index.html Executable file
View File

@@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>💨</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<main id="root"></main>
</body>
</html>

7
src/index.tsx Executable file
View File

@@ -0,0 +1,7 @@
import React from 'react'
import ReactDOM from 'react-dom'
import './App.styl'
import App from './App'
ReactDOM.render(<App />, document.getElementById('root'))