From eaecb1838f9b7055364172edd84bc5fa71f2dcd5 Mon Sep 17 00:00:00 2001
From: jreichmann <34141868+jreichmann@users.noreply.github.com>
Date: Fri, 18 May 2018 13:29:25 +0200
Subject: [PATCH] Added working datetime display, embedded wttr.in
---
index.html | 10 ++++++++--
index.js | 17 +++++++++++++++++
layout.css | 19 +++++++++++++++++--
3 files changed, 42 insertions(+), 4 deletions(-)
create mode 100644 index.js
diff --git a/index.html b/index.html
index f2aff4b..98641fd 100644
--- a/index.html
+++ b/index.html
@@ -1,9 +1,15 @@
+ News
+
+
+
- 2018-04-12 12:34:56.345h UTC+1
-
+
+ 2018-04-12 12:34:56.345h UTC+1
+
+ 
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..6f7297f
--- /dev/null
+++ b/index.js
@@ -0,0 +1,17 @@
+function startDateTimeDisplay() {
+
+ const displayNode = document.querySelector('#datetime span')
+ let dateTime = new Date()
+
+ const updateDateTime = () => {
+ displayNode.innerHTML = dateTime.toString()
+ dateTime = new Date()
+ window.requestAnimationFrame(updateDateTime)
+ }
+
+ window.requestAnimationFrame(updateDateTime)
+}
+
+window.onload = () => {
+ startDateTimeDisplay()
+}
diff --git a/layout.css b/layout.css
index 7eb5110..fab3b16 100644
--- a/layout.css
+++ b/layout.css
@@ -5,7 +5,22 @@ html, body {
margin: 0;
}
-#datetime, #weather {
- width: 100%;
+#weather {
+ display: block;
margin: auto;
+ height: 60vh;
+}
+
+#datetime {
+ display: block;
+ width: 100%;
+ height: 15vh;
+ text-align: center;
+ line-height: 15vh;
+}
+#datetime span {
+ display: inline-block;
+ vertical-align: middle;
+ line-height: 8vh;
+ font-size: 8vh;
}