diff weather_server/static/style.css @ 8:d54155a199d8

Improve template; add stylesheet.
author Paul Fisher <paul@pfish.zone>
date Sun, 29 Sep 2019 20:32:48 -0400
parents
children 6d59f038a58b
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/weather_server/static/style.css	Sun Sep 29 20:32:48 2019 -0400
@@ -0,0 +1,90 @@
+html, body {
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-flow: column nowrap;
+    width: 100%;
+    height: 100%;
+
+    font-family: Roboto, sans-serif;
+}
+
+h1 {
+    /* Reset. */
+    margin: 0;
+    padding: 0;
+    font: inherit;
+
+    flex: none;
+    background: #263238;
+    color: white;
+    height: 48px;
+    padding: 0 24px;
+    font-size: 24px;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+h1 span {
+    display: block;
+}
+
+p {
+    margin: 0;
+    padding: 0;
+    font: inherit;
+    flex: auto;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: baseline;
+    padding: 24px;
+}
+
+p.important .key {
+    display: block;
+    opacity: 75%;
+    font-size: 18px;
+}
+
+p.important .value {
+    margin-top: 0;
+    font-size: 150px;
+    display: flex;
+    flex-flow: row nowrap;
+}
+
+p.important .value .unit {
+    font-size: 33%;
+    font-weight: bold;
+    opacity: 66%;
+    padding-top: 0.4em;
+}
+
+#temp {
+    background: #0d47a1;
+    color: white;
+}
+
+#dewpoint {
+    background: #5472d3;
+    color: white;
+}
+
+#timestamp {
+    flex: none;
+    background: #263238;
+    color: white;
+    height: 48px;
+    padding: 0 24px;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+#timestamp > span {
+    display: block;
+}