aboutsummaryrefslogtreecommitdiff
path: root/fe/src/app.css
diff options
context:
space:
mode:
Diffstat (limited to 'fe/src/app.css')
-rw-r--r--fe/src/app.css53
1 files changed, 17 insertions, 36 deletions
diff --git a/fe/src/app.css b/fe/src/app.css
index c24c713..be7d15c 100644
--- a/fe/src/app.css
+++ b/fe/src/app.css
@@ -5,48 +5,34 @@
5 5
6 color-scheme: light dark; 6 color-scheme: light dark;
7 color: rgba(255, 255, 255, 0.87); 7 color: rgba(255, 255, 255, 0.87);
8 background-color: #242424; 8 background-color: var(--background);
9 width: 100vw;
9 10
10 font-synthesis: none; 11 font-synthesis: none;
11 text-rendering: optimizeLegibility; 12 text-rendering: optimizeLegibility;
12 -webkit-font-smoothing: antialiased; 13 -webkit-font-smoothing: antialiased;
13 -moz-osx-font-smoothing: grayscale; 14 -moz-osx-font-smoothing: grayscale;
14 15
15 --submit: #28a745; 16 --background: #242424;
16} 17}
17 18
18a { 19@media (min-width: 916px) {
19 font-weight: 500; 20 :root {
20 color: #646cff; 21 width: unset;
21 text-decoration: inherit; 22 }
22}
23 23
24a:hover { 24 #content div.column:first-child {
25 color: #535bf2; 25 flex-direction: row;
26 height: 300px;
27 }
26} 28}
27 29
28body { 30body {
29 margin: 0; 31 margin: 0;
30 display: flex; 32 padding: 0 2em 2em;
31 place-items: center;
32 min-width: 320px;
33 min-height: 100vh;
34} 33}
35 34
36h1 {
37 font-size: 3.2em;
38 line-height: 1.1;
39}
40 35
41.card {
42 padding: 2em;
43}
44
45#app {
46 flex-grow: 2;
47 max-width: 1280px;
48 margin: 0 auto;
49}
50 36
51button { 37button {
52 border-radius: 8px; 38 border-radius: 8px;
@@ -56,6 +42,7 @@ button {
56 font-weight: 500; 42 font-weight: 500;
57 font-family: inherit; 43 font-family: inherit;
58 background-color: #1a1a1a; 44 background-color: #1a1a1a;
45 color: inherit;
59 cursor: pointer; 46 cursor: pointer;
60 transition: border-color 0.25s; 47 transition: border-color 0.25s;
61} 48}
@@ -64,10 +51,6 @@ button:hover {
64 border-color: #646cff; 51 border-color: #646cff;
65} 52}
66 53
67button:focus,
68button:focus-visible {
69 outline: 4px auto -webkit-focus-ring-color;
70}
71 54
72@media (prefers-color-scheme: light) { 55@media (prefers-color-scheme: light) {
73 :root { 56 :root {
@@ -84,12 +67,6 @@ button:focus-visible {
84 } 67 }
85} 68}
86 69
87@media (prefers-color-scheme: dark) {
88 :root {
89 color: #000;
90 }
91}
92
93.form { 70.form {
94 display: flex; 71 display: flex;
95 flex-direction: column; 72 flex-direction: column;
@@ -118,3 +95,7 @@ button:focus-visible {
118 background: var(--submit); 95 background: var(--submit);
119 color: #fff; 96 color: #fff;
120} 97}
98
99dialog {
100 top: 8em;
101}