|
0
|
1 a {
|
|
|
2 color: #472C7D;
|
|
|
3 }
|
|
|
4
|
|
|
5 a[button] {
|
|
|
6 display: inline-block;
|
|
|
7 text-decoration: none;
|
|
|
8 }
|
|
|
9
|
|
|
10 button,
|
|
|
11 [onclick],
|
|
|
12 [clickable],
|
|
|
13 input[type="radio"],
|
|
|
14 input[type="submit"] {
|
|
|
15 cursor: pointer;
|
|
|
16 }
|
|
|
17
|
|
|
18 [pulldown] {
|
|
|
19 position: relative;
|
|
|
20 }
|
|
|
21 [pulldown_menu] {
|
|
|
22 display: none;
|
|
|
23 z-index: 20;
|
|
|
24 position: absolute;
|
|
|
25 top: 50px;
|
|
|
26 border: 1px solid #DDDDDD;
|
|
|
27 text-align: left;
|
|
|
28 background-color: #ffffff;
|
|
|
29 border-radius: 12px;
|
|
|
30 }
|
|
|
31 [pulldown_menu] a {
|
|
|
32 display: block;
|
|
|
33 color: black;
|
|
|
34 padding-left: 32px;
|
|
|
35 padding-right: 32px;
|
|
|
36 white-space: nowrap;
|
|
|
37 text-decoration: none;
|
|
|
38 }
|
|
|
39 [pulldown_menu] a:hover {
|
|
|
40 text-decoration: underline;
|
|
|
41 }
|
|
|
42 [pulldown_menu] a {
|
|
|
43 font-size: 15px;
|
|
|
44 margin-top: 12px;
|
|
|
45 margin-bottom: 12px;
|
|
|
46 }
|
|
|
47
|
|
|
48 input[clipboard] {
|
|
|
49 position: absolute;
|
|
|
50 top: -1000px;
|
|
|
51 }
|
|
|
52
|
|
|
53 [pulldown_menu] span[copy] {
|
|
|
54 display: inline-block;
|
|
|
55 text-align: right;
|
|
|
56 min-width: 5em;
|
|
|
57 }
|
|
|
58
|
|
|
59 [pulldown_menu] span[copy=copied] {
|
|
|
60 color: lime;
|
|
|
61 }
|
|
|
62
|
|
|
63 div[header] {
|
|
|
64 display: flex;
|
|
|
65 padding: 20px 40px;
|
|
|
66 justify-content: space-between;
|
|
|
67 align-items: center;
|
|
|
68 background-color: #DBD5FF;
|
|
|
69 }
|
|
|
70 div[header] > a[left] {
|
|
|
71 font-size: 28px;
|
|
|
72 text-decoration: none;
|
|
|
73 color: black;
|
|
|
74 }
|
|
|
75 img[logo] {
|
|
|
76 height: 50px;
|
|
|
77 display: block;
|
|
|
78 }
|
|
|
79 @media (min-width: 757px) {
|
|
|
80 img[logo="small"] {
|
|
|
81 display: none;
|
|
|
82 }
|
|
|
83 }
|
|
|
84 @media (max-width: 756px) {
|
|
|
85 img[logo="big"] {
|
|
|
86 display: none;
|
|
|
87 }
|
|
|
88 }
|
|
|
89 div[header] [pulldown_menu] {
|
|
|
90 right: 0;
|
|
|
91 }
|
|
|
92 div[header] > span[right] img {
|
|
|
93 width: 50px;
|
|
|
94 height: 50px;
|
|
|
95 object-fit: cover;
|
|
|
96 border-radius: 50%;
|
|
|
97 }
|
|
|
98 div[header] > span[right][login] {
|
|
|
99 display: flex;
|
|
|
100 gap: 10px;
|
|
|
101 }
|
|
|
102 div[header] > span[right][login] a[button] {
|
|
|
103 padding: 18px 26px 20px 26px;
|
|
|
104 }
|
|
|
105 div[header] > span[right][login] a[login] {
|
|
|
106 color: black;
|
|
|
107 background-color: #EAEAEA;
|
|
|
108 }
|
|
|
109 div[header] > span[right][login] a[login]:hover {
|
|
|
110 background-color: #D1D1D1;
|
|
|
111 }
|
|
|
112 div[header] > span[right][login] a[register] {
|
|
|
113 color: white;
|
|
|
114 background-color: #4E4293;
|
|
|
115 }
|
|
|
116 div[header] > span[right][login] a[register]:hover {
|
|
|
117 background-color: #272A3B;
|
|
|
118 }
|
|
|
119
|
|
|
120 [page] {
|
|
|
121 padding-left: 40px;
|
|
|
122 padding-right: 40px;
|
|
|
123 }
|
|
|
124 [page] > * {
|
|
|
125 max-width: 600px;
|
|
|
126 margin-left: auto;
|
|
|
127 margin-right: auto;
|
|
|
128 }
|
|
|
129 [page] a[header] {
|
|
|
130 display: block;
|
|
|
131 color: black;
|
|
|
132 text-decoration: none;
|
|
|
133 padding-top: 20px;
|
|
|
134 margin-bottom: 100px;
|
|
|
135 font-size: 28px;
|
|
|
136 }
|
|
|
137 [page] h1 {
|
|
|
138 color: #4E4293;
|
|
|
139 }
|
|
|
140 [page] h1 + p {
|
|
|
141 color: #9E9E9E;
|
|
|
142 }
|
|
|
143 input[type="url"],
|
|
|
144 input[type="password"],
|
|
|
145 input[type="email"],
|
|
|
146 input[type="text"] {
|
|
|
147 display: block;
|
|
|
148 width: 100%;
|
|
|
149 border: none;
|
|
|
150 background-color: #E0E0E0;
|
|
|
151 padding: 12px;
|
|
|
152 font-size: 16px;
|
|
|
153 }
|
|
|
154 textarea {
|
|
|
155 display: block;
|
|
|
156 width: 100%;
|
|
|
157 background-color: #E0E0E0;
|
|
|
158 padding: 12px;
|
|
|
159 font-size: 16px;
|
|
|
160 font-family: inherit;
|
|
|
161 }
|
|
|
162 [page] input[type="url"]:not(:first-of-type),
|
|
|
163 [page] input[type="password"]:not(:first-of-type),
|
|
|
164 [page] div[password],
|
|
|
165 [page] input[type="email"]:not(:first-of-type),
|
|
|
166 [page] input[type="text"]:not(:first-of-type) {
|
|
|
167 margin-top: 32px;
|
|
|
168 }
|
|
|
169
|
|
|
170 [page],
|
|
|
171 [full] {
|
|
|
172 min-height: 100vh;
|
|
|
173 padding-bottom: 77px;
|
|
|
174 position: relative;
|
|
|
175 }
|
|
|
176 div[footer] {
|
|
|
177 padding: 20px 40px;
|
|
|
178 background-color: #DBD5FF;
|
|
|
179 color: #4E4293;
|
|
|
180 position: absolute;
|
|
|
181 bottom: 0;
|
|
|
182 width: 100%;
|
|
|
183 display: flex;
|
|
|
184 justify-content: space-between;
|
|
|
185 }
|
|
|
186
|
|
|
187 div[footer] img {
|
|
|
188 height: 40px;
|
|
|
189 display: inline-block;
|
|
|
190 }
|
|
|
191 div[footer] img[ios] {
|
|
|
192 padding-top: 4px;
|
|
|
193 padding-bottom: 4px;
|
|
|
194 }
|
|
|
195 [page] > div[footer] {
|
|
|
196 padding: 20px 0;
|
|
|
197 background-color: white;
|
|
|
198 position: initial;
|
|
|
199 }
|
|
|
200
|
|
|
201 div[error] {
|
|
|
202 color: firebrick;
|
|
|
203 }
|
|
|
204 div[error][flash] {
|
|
|
205 color: red;
|
|
|
206 }
|
|
|
207 div[error="success"] {
|
|
|
208 color: green;
|
|
|
209 }
|
|
|
210 div[error="success"][flash] {
|
|
|
211 color: lime;
|
|
|
212 }
|
|
|
213
|
|
|
214 div[password] {
|
|
|
215 position: relative;
|
|
|
216 }
|
|
|
217 div[password] input {
|
|
|
218 padding-right: 40px;
|
|
|
219 }
|
|
|
220 div[password] img {
|
|
|
221 position: absolute;
|
|
|
222 top: 11px;
|
|
|
223 right: 10px;
|
|
|
224 height: 22px;
|
|
|
225 opacity: .6;
|
|
|
226 cursor: pointer;
|
|
|
227 }
|
|
|
228 div[password] img[show] {
|
|
|
229 display: block;
|
|
|
230 }
|
|
|
231 div[password] img[hide] {
|
|
|
232 display: none;
|
|
|
233 }
|
|
|
234
|
|
|
235 button[big],
|
|
|
236 a[button][big] {
|
|
|
237 display: block;
|
|
|
238 width: 100%;
|
|
|
239 border-radius: 12px / 50%;
|
|
|
240 color: white;
|
|
|
241 background-color: #9181EE;
|
|
|
242 text-align: center;
|
|
|
243 padding: 12px;
|
|
|
244 border: none;
|
|
|
245 font: inherit;
|
|
|
246 }
|
|
|
247 [page] button[big],
|
|
|
248 [page] a[button][big] {
|
|
|
249 margin-top: 64px;
|
|
|
250 }
|
|
|
251 button[big]:hover,
|
|
|
252 a[button][big]:hover {
|
|
|
253 background-color: #4E4293;
|
|
|
254 }
|
|
|
255 @media (min-width: 800px) {
|
|
|
256 body:has([right_of_page]) [page] {
|
|
|
257 width: 60%;
|
|
|
258 }
|
|
|
259 body:has([right_of_page]) [right_of_page] {
|
|
|
260 display: block;
|
|
|
261 position: fixed;
|
|
|
262 top: 0;
|
|
|
263 right: 0;
|
|
|
264 bottom: 0;
|
|
|
265 left: 60%;
|
|
|
266 background-size: cover;
|
|
|
267 background-repeat: no-repeat;
|
|
|
268 background-position: center;
|
|
|
269 }
|
|
|
270 }
|
|
|
271
|
|
|
272 button[small] {
|
|
|
273 border-radius: 12px / 50%;
|
|
|
274 color: white;
|
|
|
275 background-color: #151721;
|
|
|
276 text-align: center;
|
|
|
277 padding-left: 12px;
|
|
|
278 padding-right: 12px;
|
|
|
279 padding-top: 6px;
|
|
|
280 padding-bottom: 6px;
|
|
|
281 border: none;
|
|
|
282 font: inherit;
|
|
|
283 }
|
|
|
284 button[small]:hover {
|
|
|
285 background-color: #272A3B;
|
|
|
286 }
|
|
|
287
|
|
|
288 input[type="file"] {
|
|
|
289 display: none;
|
|
|
290 }
|
|
|
291
|
|
|
292 p[top] {
|
|
|
293 max-width: 600px;
|
|
|
294 margin-left: auto;
|
|
|
295 margin-right: auto;
|
|
|
296 color: #808080;
|
|
|
297 }
|
|
|
298 @media (max-width: 700px) {
|
|
|
299 p[top] {
|
|
|
300 max-width: 90%;
|
|
|
301 }
|
|
|
302 }
|
