0
|
1 @import url("https://fonts.googleapis.com/css2?family=Acme&family=Oswald&display=swap");
|
17
|
2
|
0
|
3 html,
|
17
|
4 #grid {
|
0
|
5 width: 800px;
|
|
6 height: 480px;
|
1
|
7 overflow: hidden;
|
0
|
8 }
|
17
|
9
|
0
|
10 html {
|
|
11 background: gray;
|
|
12 }
|
17
|
13
|
0
|
14 body {
|
|
15 background: black;
|
|
16 color: #f8f8f2;
|
|
17 margin: 0;
|
|
18 font-size: 25px;
|
|
19 font-family: "Oswald", sans-serif;
|
17
|
20 }
|
|
21
|
|
22 #grid {
|
|
23 display: grid;
|
18
|
24 grid-template-rows: 54px 165px 1fr;
|
17
|
25 grid-template-columns: 1.7fr 1fr 80px;
|
0
|
26 }
|
17
|
27
|
18
|
28 .debug #grid > * {
|
17
|
29 outline: 1px rgb(68, 68, 68) solid;
|
|
30 }
|
|
31
|
|
32 fd-week-guide {
|
|
33 grid-area: 1/1/1/3;
|
0
|
34 }
|
17
|
35
|
|
36 fd-clock {
|
|
37 grid-area: 1/3/1/3;
|
13
|
38 }
|
17
|
39
|
|
40 fd-upcoming-events {
|
|
41 grid-area: 2/1/3/1;
|
|
42 }
|
|
43
|
13
|
44 fd-countdown {
|
18
|
45 grid-area: 2/2/2/4;
|
13
|
46 }
|
17
|
47
|
16
|
48 fd-electricity {
|
17
|
49 grid-area: 3/2/3/4;
|
18
|
50 }
|