aboutsummaryrefslogtreecommitdiff
path: root/static
diff options
context:
space:
mode:
Diffstat (limited to 'static')
-rw-r--r--static/style.css102
1 files changed, 102 insertions, 0 deletions
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..693eee9
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,102 @@
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
21html, body, footer {
22 background: var(--bg);
23 color: var(--text);
24 font-family: var(--sans-font);
25 justify-content: center;
26 align-items: center;
27 display: flex;
28}
29
30div.weather-box {
31 height: 100%;
32 align-items: center;
33 display: inline-flex;
34}
35
36div.daily-box {
37 text-align: center;
38 padding: 1em;
39 border: 0.5em solid var(--acent-bg);
40 border-radius: 5%;
41 box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);
42 box-sizing: border-box;
43 width: 20em;
44 height: 10em;
45 overflow-wrap: normal;
46 float: left;
47}
48
49div.hourly-box {
50 text-align: center;
51 padding: 1em;
52 border: 0.5em solid var(--acent-bg);
53 border-radius: 5%;
54 box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);
55 box-sizing: border-box;
56 width: 20em;
57 height: 10em;
58 overflow-wrap: normal;
59}
60
61
62/*=== Links */
63a {
64 color: var(--accent);
65}
66
67a:hover {
68 color: var(--accent);
69}
70
71input, select, textarea {
72 margin: 5px;
73 padding: 5px;
74 color: var(--text);
75 border: 1px solid var(--border);
76 border-radius: 6px;
77 border-color: var(--border);
78 background-color: var(--bg);
79 min-height: 25px;
80 line-height: 25px;
81 vertical-align: middle;
82}
83
84input:disabled, select:disabled {
85 color: #aaa;
86 border-color: var(--border);
87}
88
89button {
90 font-family: var(--sans-font);
91}
92
93button.as-link,
94button.as-link:hover,
95button.as-link:active {
96 background: transparent;
97 /* background-color: var(--bg);A*/
98}
99
100button.as-link[disabled] {
101 color: #ddd !important;
102}