login-rtl.css 7.6 KB

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