| author | ymh <ymh.work@gmail.com> |
| Tue, 15 Dec 2020 13:49:49 +0100 | |
| changeset 16 | a86126ab1dd4 |
| parent 9 | 177826044cd9 |
| child 18 | be944660c56a |
| permissions | -rw-r--r-- |
| 5 | 1 |
html, |
2 |
body { |
|
3 |
height: 100%; |
|
4 |
margin: 0; |
|
5 |
padding: 0; |
|
6 |
} |
|
7 |
||
8 |
body { |
|
9 |
background: #f1f1f1; |
|
10 |
min-width: 0; |
|
11 |
color: #444; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
12 |
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
| 5 | 13 |
font-size: 13px; |
| 16 | 14 |
line-height: 1.4; |
| 5 | 15 |
} |
16 |
||
17 |
a { |
|
18 |
color: #0073aa; |
|
19 |
transition-property: border, background, color; |
|
20 |
transition-duration: .05s; |
|
21 |
transition-timing-function: ease-in-out; |
|
22 |
} |
|
23 |
||
24 |
a { |
|
25 |
outline: 0; |
|
26 |
} |
|
27 |
||
28 |
a:hover, |
|
29 |
a:active { |
|
| 16 | 30 |
color: #006799; |
| 5 | 31 |
} |
32 |
||
33 |
a:focus { |
|
34 |
color: #124964; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
35 |
box-shadow: |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
36 |
0 0 0 1px #5b9dd9, |
| 9 | 37 |
0 0 2px 1px rgba(30, 140, 190, 0.8); |
| 5 | 38 |
} |
39 |
||
40 |
p { |
|
41 |
line-height: 1.5; |
|
42 |
} |
|
43 |
||
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
44 |
.login .message, |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
45 |
.login .success, |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
46 |
.login #login_error { |
| 5 | 47 |
border-left: 4px solid #00a0d2; |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
48 |
padding: 12px; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
49 |
margin-left: 0; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
50 |
margin-bottom: 20px; |
| 5 | 51 |
background-color: #fff; |
| 9 | 52 |
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); |
| 5 | 53 |
} |
54 |
||
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
55 |
.login .success { |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
56 |
border-left-color: #46b450; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
57 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
58 |
|
| 5 | 59 |
.login #login_error { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
60 |
border-left-color: #dc3232; |
| 5 | 61 |
} |
62 |
||
63 |
#loginform p.submit, |
|
64 |
.login-action-lostpassword p.submit { |
|
65 |
border: none; |
|
66 |
margin: -10px 0 20px; /* May want to revisit this */ |
|
67 |
} |
|
68 |
||
69 |
.login * { |
|
70 |
margin: 0; |
|
71 |
padding: 0; |
|
72 |
} |
|
73 |
||
| 9 | 74 |
.login .input::-ms-clear { |
75 |
display: none; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
76 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
77 |
|
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
78 |
.login .pw-weak { |
| 9 | 79 |
margin-bottom: 15px; |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
80 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
81 |
|
| 16 | 82 |
.login .button.wp-hide-pw { |
| 9 | 83 |
background: transparent; |
84 |
border: 1px solid transparent; |
|
85 |
box-shadow: none; |
|
86 |
font-size: 14px; |
|
87 |
line-height: 2; |
|
| 16 | 88 |
width: 2.5rem; |
89 |
height: 2.5rem; |
|
90 |
min-width: 40px; |
|
91 |
min-height: 40px; |
|
| 9 | 92 |
margin: 0; |
93 |
padding: 5px 9px; |
|
94 |
position: absolute; |
|
95 |
right: 0; |
|
96 |
top: 0; |
|
97 |
} |
|
98 |
||
| 16 | 99 |
.login .button.wp-hide-pw:hover { |
| 9 | 100 |
background: transparent; |
101 |
} |
|
102 |
||
| 16 | 103 |
.login .button.wp-hide-pw:focus { |
| 9 | 104 |
background: transparent; |
| 16 | 105 |
border-color: #007cba; |
106 |
box-shadow: 0 0 0 1px #007cba; |
|
107 |
/* Only visible in Windows High Contrast mode */ |
|
108 |
outline: 2px solid transparent; |
|
| 9 | 109 |
} |
110 |
||
| 16 | 111 |
.login .button.wp-hide-pw:active { |
| 9 | 112 |
background: transparent; |
113 |
box-shadow: none; |
|
114 |
transform: none; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
115 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
116 |
|
| 16 | 117 |
.login .button.wp-hide-pw .dashicons { |
118 |
width: 1.25rem; |
|
119 |
height: 1.25rem; |
|
120 |
top: 0.25rem; |
|
121 |
} |
|
122 |
||
123 |
.login .wp-pwd { |
|
124 |
position: relative; |
|
125 |
} |
|
126 |
||
127 |
.no-js .hide-if-no-js { |
|
128 |
display: none; |
|
129 |
} |
|
130 |
||
| 5 | 131 |
.login form { |
132 |
margin-top: 20px; |
|
133 |
margin-left: 0; |
|
134 |
padding: 26px 24px 46px; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
135 |
font-weight: 400; |
| 5 | 136 |
overflow: hidden; |
137 |
background: #fff; |
|
| 16 | 138 |
border: 1px solid #ccd0d4; |
139 |
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04); |
|
140 |
} |
|
141 |
||
142 |
.login form.shake { |
|
143 |
animation: shake 0.2s cubic-bezier(.19,.49,.38,.79) both; |
|
144 |
animation-iteration-count: 3; |
|
145 |
transform: translateX(0); |
|
146 |
} |
|
147 |
||
148 |
@keyframes shake { |
|
149 |
25% { |
|
150 |
transform: translateX(-20px); |
|
151 |
} |
|
152 |
75% { |
|
153 |
transform: translateX(20px); |
|
154 |
} |
|
155 |
100% { |
|
156 |
transform: translateX(0); |
|
157 |
} |
|
158 |
} |
|
159 |
||
160 |
@media (prefers-reduced-motion: reduce) { |
|
161 |
.login form.shake { |
|
162 |
animation: none; |
|
163 |
transform: none; |
|
164 |
} |
|
165 |
} |
|
166 |
||
167 |
.login-action-confirm_admin_email #login { |
|
168 |
width: 60vw; |
|
169 |
max-width: 650px; |
|
170 |
margin-top: -2vh; |
|
171 |
} |
|
172 |
||
173 |
@media screen and (max-width: 782px) { |
|
174 |
.login-action-confirm_admin_email #login { |
|
175 |
box-sizing: border-box; |
|
176 |
margin-top: 0; |
|
177 |
padding-left: 4vw; |
|
178 |
padding-right: 4vw; |
|
179 |
width: 100vw; |
|
180 |
} |
|
| 5 | 181 |
} |
182 |
||
183 |
.login form .forgetmenot { |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
184 |
font-weight: 400; |
| 5 | 185 |
float: left; |
186 |
margin-bottom: 0; |
|
187 |
} |
|
188 |
||
189 |
.login .button-primary { |
|
190 |
float: right; |
|
191 |
} |
|
192 |
||
| 16 | 193 |
.login .admin-email-confirm-form .submit { |
194 |
text-align: center; |
|
195 |
} |
|
196 |
||
197 |
.admin-email__later { |
|
198 |
text-align: left; |
|
199 |
} |
|
200 |
||
201 |
.login form p.admin-email__details { |
|
202 |
margin: 1.1em 0; |
|
203 |
} |
|
204 |
||
205 |
.login h1.admin-email__heading { |
|
206 |
border-bottom: 1px rgb(241, 241, 241) solid; |
|
207 |
color: rgb(95, 95, 95); |
|
208 |
font-weight: normal; |
|
209 |
padding-bottom: 0.5em; |
|
210 |
text-align: left; |
|
211 |
} |
|
212 |
||
213 |
.admin-email__actions div { |
|
214 |
padding-top: 1.5em; |
|
215 |
} |
|
216 |
||
217 |
.login .admin-email__actions .button-primary { |
|
218 |
float: none; |
|
219 |
margin-left: 0.25em; |
|
220 |
margin-right: 0.25em; |
|
221 |
} |
|
222 |
||
| 5 | 223 |
#login form p { |
224 |
margin-bottom: 0; |
|
225 |
} |
|
226 |
||
227 |
#login form p.submit { |
|
228 |
margin: 0; |
|
229 |
padding: 0; |
|
230 |
} |
|
231 |
||
232 |
.login label { |
|
233 |
font-size: 14px; |
|
| 16 | 234 |
line-height: 1.5; |
235 |
display: inline-block; |
|
236 |
margin-bottom: 3px; |
|
| 5 | 237 |
} |
238 |
||
| 16 | 239 |
.login .forgetmenot label, |
240 |
.login .pw-weak label { |
|
241 |
line-height: 1.5; |
|
242 |
vertical-align: baseline; |
|
| 5 | 243 |
} |
244 |
||
245 |
.login h1 { |
|
246 |
text-align: center; |
|
247 |
} |
|
248 |
||
249 |
.login h1 a { |
|
250 |
background-image: url(../images/w-logo-blue.png?ver=20131202); |
|
251 |
background-image: none, url(../images/wordpress-logo.svg?ver=20131107); |
|
252 |
background-size: 84px; |
|
253 |
background-position: center top; |
|
254 |
background-repeat: no-repeat; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
255 |
color: #444; |
| 5 | 256 |
height: 84px; |
257 |
font-size: 20px; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
258 |
font-weight: 400; |
| 16 | 259 |
line-height: 1.3; |
| 5 | 260 |
margin: 0 auto 25px; |
261 |
padding: 0; |
|
262 |
text-decoration: none; |
|
263 |
width: 84px; |
|
264 |
text-indent: -9999px; |
|
265 |
outline: none; |
|
266 |
overflow: hidden; |
|
267 |
display: block; |
|
268 |
} |
|
269 |
||
270 |
#login { |
|
271 |
width: 320px; |
|
272 |
padding: 8% 0 0; |
|
273 |
margin: auto; |
|
274 |
} |
|
275 |
||
276 |
.login #nav, |
|
277 |
.login #backtoblog { |
|
278 |
font-size: 13px; |
|
279 |
padding: 0 24px 0; |
|
280 |
} |
|
281 |
||
282 |
.login #nav { |
|
283 |
margin: 24px 0 0 0; |
|
284 |
} |
|
285 |
||
286 |
#backtoblog { |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
287 |
margin: 16px 0; |
| 5 | 288 |
} |
289 |
||
290 |
.login #nav a, |
|
291 |
.login #backtoblog a { |
|
292 |
text-decoration: none; |
|
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
293 |
color: #555d66; |
| 5 | 294 |
} |
295 |
||
296 |
.login #nav a:hover, |
|
297 |
.login #backtoblog a:hover, |
|
298 |
.login h1 a:hover { |
|
| 16 | 299 |
color: #006799; |
| 5 | 300 |
} |
301 |
||
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
302 |
.login #nav a:focus, |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
303 |
.login #backtoblog a:focus, |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
304 |
.login h1 a:focus { |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
305 |
color: #124964; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
306 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
307 |
|
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
308 |
.login .privacy-policy-page-link { |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
309 |
text-align: center; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
310 |
width: 100%; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
311 |
margin: 5em 0 2em; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
312 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
313 |
|
| 5 | 314 |
.login form .input, |
| 16 | 315 |
.login input[type="text"], |
316 |
.login input[type="password"] { |
|
| 5 | 317 |
font-size: 24px; |
| 16 | 318 |
line-height: 1.33333333; /* 32px */ |
| 5 | 319 |
width: 100%; |
| 16 | 320 |
border-width: 0.0625rem; |
321 |
padding: 0.1875rem 0.3125rem; /* 3px 5px */ |
|
322 |
margin: 0 6px 16px 0; |
|
323 |
min-height: 40px; |
|
324 |
max-height: none; |
|
| 5 | 325 |
} |
326 |
||
| 16 | 327 |
.js.login input.password-input, |
328 |
.js.login-action-rp form .input, |
|
329 |
.js.login-action-rp input[type="text"] { |
|
330 |
padding-right: 2.5rem; |
|
| 9 | 331 |
} |
332 |
||
| 5 | 333 |
.login form .input, |
334 |
.login input[type="text"], |
|
335 |
.login form input[type="checkbox"] { |
|
336 |
background: #fbfbfb; |
|
337 |
} |
|
338 |
||
| 16 | 339 |
.js.login-action-rp input[type="text"], |
340 |
.js.login-action-rp input[type="password"] { |
|
341 |
margin-bottom: 0; |
|
| 5 | 342 |
} |
343 |
||
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
344 |
.login #pass-strength-result { |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
345 |
font-weight: 600; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
346 |
margin: -1px 5px 16px 0; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
347 |
padding: 6px 5px; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
348 |
text-align: center; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
349 |
width: 100%; |
| 5 | 350 |
} |
351 |
||
352 |
body.interim-login { |
|
353 |
height: auto; |
|
354 |
} |
|
355 |
||
356 |
.interim-login #login { |
|
357 |
padding: 0; |
|
358 |
margin: 5px auto 20px; |
|
359 |
} |
|
360 |
||
361 |
.interim-login.login h1 a { |
|
362 |
width: auto; |
|
363 |
} |
|
364 |
||
365 |
.interim-login #login_error, |
|
366 |
.interim-login.login .message { |
|
367 |
margin: 0 0 16px; |
|
368 |
} |
|
369 |
||
370 |
.interim-login.login form { |
|
371 |
margin: 0; |
|
372 |
} |
|
373 |
||
| 16 | 374 |
/* Hide visually but not from screen readers */ |
375 |
.screen-reader-text, |
|
376 |
.screen-reader-text span { |
|
377 |
border: 0; |
|
378 |
clip: rect(1px, 1px, 1px, 1px); |
|
379 |
-webkit-clip-path: inset(50%); |
|
380 |
clip-path: inset(50%); |
|
381 |
height: 1px; |
|
382 |
margin: -1px; |
|
383 |
overflow: hidden; |
|
384 |
padding: 0; |
|
385 |
position: absolute; |
|
386 |
width: 1px; |
|
387 |
word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */ |
|
388 |
} |
|
389 |
||
390 |
/* Hide the Edge "reveal password" native button */ |
|
391 |
input::-ms-reveal { |
|
392 |
display: none; |
|
393 |
} |
|
394 |
||
| 5 | 395 |
@-ms-viewport { |
396 |
width: device-width; |
|
397 |
} |
|
398 |
||
| 9 | 399 |
@media screen and (max-height: 550px) { |
|
7
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
400 |
#login { |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
401 |
padding: 20px 0; |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
402 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
403 |
} |
|
cf61fcea0001
resynchronize code repo with production
ymh <ymh.work@gmail.com>
parents:
5
diff
changeset
|
404 |
|
| 16 | 405 |
|
| 9 | 406 |
@media screen and (max-width: 782px) { |
| 5 | 407 |
.interim-login input[type=checkbox] { |
| 16 | 408 |
width: 1rem; |
409 |
height: 1rem; |
|
| 5 | 410 |
} |
411 |
||
412 |
.interim-login input[type=checkbox]:checked:before { |
|
| 16 | 413 |
width: 1.3125rem; |
414 |
height: 1.3125rem; |
|
415 |
margin: -0.1875rem 0 0 -0.25rem; |
|
| 5 | 416 |
} |
417 |
} |