zbin

zbin/assets/default.css
default.css
⎇
Raw
1@import "normalize.css";
2@import "sakura-vader.css";
3
4body {
5 display: flex;
6 align-items: center;
7 flex-direction: column;
8 min-height: 100vh;
9
10 padding: 3rem;
11 box-sizing: border-box;
12 max-width: 80rem;
13}
14
15a {
16 text-wrap: nowrap;
17}
18
19hr {
20 width: 100%;
21}
22
23h1 {
24 margin-bottom: 4rem;
25}
26
27form {
28 display: flex;
29 flex-direction: column;
30 gap: 0.5rem;
31 margin-bottom: 1.5rem;
32 min-width: 35rem;
33 width: 100%;
34
35 input {
36 flex-grow: 1;
37 }
38
39 input[type="checkbox"] {
40 flex-grow: 0;
41 margin-bottom: 0.5rem;
42 }
43
44 input[type="radio"] {
45 flex-grow: 0;
46 }
47
48 div {
49 display: flex;
50 flex-direction: row;
51 align-items: center;
52 gap: 1rem;
53 }
54}
55
56select {
57 overflow: auto;
58 flex-grow: 1;
59}
60
61img {
62 margin-bottom: 0;
63}
64
65#server-limits {
66 align-self: flex-start;
67
68 ul {
69 margin: 0.25rem 0 1rem;
70 }
71
72 li {
73 margin: 0;
74 }
75}
76
77.help-icon {
78 width: 2rem;
79 height: 2rem;
80 filter: invert();
81 margin-left: 0.5rem;
82}
83
84input[type="reset"] {
85 max-width: 25rem;
86 align-self: center;
87 order: -2;
88}
89
90/* The file input lives last in the DOM (so the multipart upload sends the other
91 fields first) but belongs right below the reset button visually. */
92#file {
93 order: -1;
94}
95
96dialog {
97 background-color: #120c0e;
98 color: #d9d8dc;
99 border-color: #eb99a1;
100
101 form {
102 display: flex;
103 flex-direction: column;
104 align-items: center;
105 }
106}
107