diff options
Diffstat (limited to 'static/style.css')
-rw-r--r-- | static/style.css | 155 |
1 files changed, 0 insertions, 155 deletions
diff --git a/static/style.css b/static/style.css deleted file mode 100644 index d6983a6..0000000 --- a/static/style.css +++ /dev/null | |||
@@ -1,155 +0,0 @@ | |||
1 | @charset "UTF-8"; | ||
2 | |||
3 | :root { | ||
4 | /* Set sans-serif & mono fonts */ | ||
5 | --sans-font: Inter, Lato,Helvetica,"IBM Plex Sans","Roboto","Nimbus Sans L","Noto Sans", "Segoe UI",Arial,Helvetica,"Helvetica Neue",sans-serif; | ||
6 | --mono-font: "mononoki Nerd Font","IBM Plex Mono","Roboto Mono","Ubuntu Mono","Fira Code","Overpass Mono", Monaco,"Droid Sans Mono",monospace; | ||
7 | --bg: #242933; | ||
8 | --accent-bg: rgb(46, 52, 64); | ||
9 | --text: #eceff4; | ||
10 | --text-light: #d8dee9; | ||
11 | --border: #88c0d0; | ||
12 | --accent: #81a1c1; | ||
13 | --accent-light: #bf616a; | ||
14 | --code: #ebcb8b; | ||
15 | --alert: #a3be8c; | ||
16 | --alert-bg: #8fbcbb; | ||
17 | --code-bg: #2e3440; | ||
18 | } | ||
19 | |||
20 | |||
21 | html, body, .container { | ||
22 | background: var(--bg); | ||
23 | color: var(--text); | ||
24 | font-family: var(--sans-font); | ||
25 | box-sizing: border-box; | ||
26 | height: 100%; | ||
27 | width: 100%; | ||
28 | font-size: 12pt; | ||
29 | } | ||
30 | |||
31 | .content { | ||
32 | display: flex; | ||
33 | align-items: center; | ||
34 | align-content: flex-start; | ||
35 | flex-flow: row wrap; | ||
36 | margin: 2%; | ||
37 | border-radius: 15px; | ||
38 | height: 100%; | ||
39 | justify-content: center; | ||
40 | border: 3px solid var(--accent); | ||
41 | } | ||
42 | |||
43 | div.searchbar { | ||
44 | display: flex; | ||
45 | align-items: left; | ||
46 | justify-content: left; | ||
47 | margin-left: 5px; | ||
48 | width: 100%; | ||
49 | margin-top: 1%; | ||
50 | } | ||
51 | |||
52 | div.current { | ||
53 | display: flex; | ||
54 | flex-flow: column wrap; | ||
55 | height: 15%; | ||
56 | flex-shrink: 1; | ||
57 | } | ||
58 | |||
59 | div.current-icon { | ||
60 | width: 100%; | ||
61 | height: 100%; | ||
62 | } | ||
63 | |||
64 | img.weather-icon { | ||
65 | display: inline-block; | ||
66 | } | ||
67 | |||
68 | div.current-temp { | ||
69 | display: inline-block; | ||
70 | font-size: 18pt; | ||
71 | text-align: left; | ||
72 | width: 100% | ||
73 | } | ||
74 | |||
75 | div.current-weather { | ||
76 | display: inline-block; | ||
77 | width: 100%; | ||
78 | font-size: 16pt; | ||
79 | margin-bottom: 5px; | ||
80 | text-align: left; | ||
81 | } | ||
82 | |||
83 | div.current-wind { | ||
84 | display: inline-block; | ||
85 | width: 100%; | ||
86 | font-size: 14pt; | ||
87 | text-align: left; | ||
88 | } | ||
89 | |||
90 | div.current-sunrise, div.current-sunset { | ||
91 | display: inline-block; | ||
92 | width: 100%; | ||
93 | font-size: 14pt; | ||
94 | } | ||
95 | |||
96 | div.forecast-header { | ||
97 | width: 100%; | ||
98 | display: flex; | ||
99 | flex-grow: 0; | ||
100 | flex-shrink: 1; | ||
101 | max-height: 10%; | ||
102 | } | ||
103 | h2.forecast-header { | ||
104 | margin-left: 5px; | ||
105 | margin-right: 5px; | ||
106 | border-bottom: 1px solid; | ||
107 | width: 100% | ||
108 | } | ||
109 | |||
110 | .daily, .hourly { | ||
111 | display: flex; | ||
112 | flex-flow: row nowrap; | ||
113 | align-items: center; | ||
114 | overflow-x: scroll; | ||
115 | overflow-y: hidden; | ||
116 | white-space: nowrap; | ||
117 | width: 100%; | ||
118 | |||
119 | } | ||
120 | |||
121 | .hourly-box, .daily-box { | ||
122 | display: flex; | ||
123 | flex-flow: column wrap; | ||
124 | flex-grow: 1; | ||
125 | justify-content: center; | ||
126 | align-items: flex-start; | ||
127 | |||
128 | padding: 1em; | ||
129 | overflow-wrap: normal; | ||
130 | min-width: 15%; | ||
131 | white-space: normal; | ||
132 | margin: 5px; | ||
133 | } | ||
134 | |||
135 | input, select, textarea { | ||
136 | margin: 5px; | ||
137 | padding: 5px; | ||
138 | color: var(--text); | ||
139 | border: 1px solid var(--border); | ||
140 | border-radius: 6px; | ||
141 | border-color: var(--border); | ||
142 | background-color: var(--bg); | ||
143 | min-height: 25px; | ||
144 | line-height: 25px; | ||
145 | vertical-align: middle; | ||
146 | } | ||
147 | |||
148 | input:disabled, select:disabled { | ||
149 | color: #aaa; | ||
150 | border-color: var(--border); | ||
151 | } | ||
152 | |||
153 | button { | ||
154 | font-family: var(--sans-font); | ||
155 | } | ||