comparison 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
comparison
equal deleted inserted replaced
7:4c25d5bb3534 8:d54155a199d8
1 html, body {
2 margin: 0;
3 padding: 0;
4 display: flex;
5 flex-flow: column nowrap;
6 width: 100%;
7 height: 100%;
8
9 font-family: Roboto, sans-serif;
10 }
11
12 h1 {
13 /* Reset. */
14 margin: 0;
15 padding: 0;
16 font: inherit;
17
18 flex: none;
19 background: #263238;
20 color: white;
21 height: 48px;
22 padding: 0 24px;
23 font-size: 24px;
24
25 display: flex;
26 flex-direction: column;
27 justify-content: center;
28 }
29
30 h1 span {
31 display: block;
32 }
33
34 p {
35 margin: 0;
36 padding: 0;
37 font: inherit;
38 flex: auto;
39 position: relative;
40 display: flex;
41 flex-direction: column;
42 align-items: baseline;
43 padding: 24px;
44 }
45
46 p.important .key {
47 display: block;
48 opacity: 75%;
49 font-size: 18px;
50 }
51
52 p.important .value {
53 margin-top: 0;
54 font-size: 150px;
55 display: flex;
56 flex-flow: row nowrap;
57 }
58
59 p.important .value .unit {
60 font-size: 33%;
61 font-weight: bold;
62 opacity: 66%;
63 padding-top: 0.4em;
64 }
65
66 #temp {
67 background: #0d47a1;
68 color: white;
69 }
70
71 #dewpoint {
72 background: #5472d3;
73 color: white;
74 }
75
76 #timestamp {
77 flex: none;
78 background: #263238;
79 color: white;
80 height: 48px;
81 padding: 0 24px;
82
83 display: flex;
84 flex-direction: column;
85 justify-content: center;
86 }
87
88 #timestamp > span {
89 display: block;
90 }