index.html (1386B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name=viewport content="width=device-width"> 6 <title>RCVD</title> 7 <style> 8 * {box-sizing: border-box; margin: 0; padding: 0} 9 html, body { 10 text-align:center; 11 width: 100%; 12 height: 100%; 13 top: 0; 14 left: 0; 15 position: fixed; 16 background: #000; 17 color: cyan; 18 font-family: sans-serif; 19 font-size: 17px; 20 } 21 header {padding-top:5px} 22 h1 { 23 font-size: 17px; 24 font-weight: 600; 25 padding: 6px 0; 26 } 27 h2 { 28 font-size: 17px; 29 font-weight: 400; 30 padding: 2px 0; 31 color: yellow; 32 } 33 main.div { 34 font-size: 2rem; 35 } 36 #timeline {font-size:54px; padding-top: 1rem} 37 #dateline {font-size:26px; padding: 1rem 0} 38 #status {padding-top:5px} 39 #syncbtn {cursor:pointer} 40 footer { 41 bottom: 0; 42 height: 24px; 43 position: fixed; 44 color: yellow; 45 width: 100%; 46 font-weight:600; 47 } 48 </style> 49 </head> 50 <body> 51 <header> 52 <h1>RCVD</h1> 53 <h2>by Luxferre</h2> 54 </header> 55 <main> 56 <div id=timeline></div> 57 <div id=dateline></div> 58 <div id=status>Press both sync buttons</div> 59 </main> 60 <footer> 61 <span id=syncbtn>SYNC</span> 62 </footer> 63 <script src="rcvd.js"></script> 64 <script src=app.js></script> 65 </body> 66 </html>