Mercurial > personal > weather-server
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; +}