login.css 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427
  1. /* clear float */
  2. .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  3. .clearfix { display: block; }
  4. /* common */
  5. html { overflow:hidden; background-color: #000;}
  6. body { overflow:hidden;background-position: center;background-size: cover;}
  7. .login #login_error, .login .message {
  8. /*position: absolute;
  9. top: -70px;*/
  10. left: 0;
  11. top: 0;
  12. position: fixed;
  13. margin-bottom: 0 !important;
  14. background: rgba(255, 255, 255, 0.45);
  15. }
  16. #login h1 a {
  17. font-family:"Microsoft Yahei";
  18. font-weight:bold;
  19. text-indent:0px;
  20. font-size:0px;
  21. height:60px;
  22. width: 100%;
  23. line-height:88px;
  24. line-height:180%;
  25. text-align:center; color:#FFF;
  26. /*text-shadow:1px 1px 0px #000;*/
  27. margin-bottom:10px;
  28. margin-top: 25px;
  29. background-image:url(https://s.nmxc.ltd/sakurairo_vision/@2.5/series/login_logo.webp);
  30. background-position: center bottom !important;
  31. background-size: contain;
  32. padding-top: 20px;
  33. box-shadow: none;
  34. }
  35. input:-webkit-autofill {
  36. -webkit-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0) inset;
  37. box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0) inset;
  38. color: #676767 !important
  39. }
  40. #login {
  41. font:14px/1.4 "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
  42. position:absolute;
  43. background: #FFF9;
  44. border-radius: 12px;
  45. top:47%;
  46. left:50%;
  47. width:350px;
  48. padding:0px !important;
  49. margin:-235px 0px 0px -175px !important;
  50. background-position: center 48%;
  51. backdrop-filter: blur(5px);
  52. -webkit-backdrop-filter: blur(5px);
  53. }
  54. #login form {
  55. padding:10px 0px;
  56. background: none;
  57. box-shadow: none;
  58. margin-top: 10px;
  59. border: none;
  60. }
  61. #login form p,#login form .user-pass-wrap {
  62. font-family:"Microsoft Yahei";
  63. position:relative;
  64. padding:0px 35px;
  65. }
  66. #login a {
  67. /*text-shadow:1px 1px 0px #000;*/
  68. color:#000 !important;
  69. font-family:"Microsoft Yahei";
  70. }
  71. #login_error a {
  72. color:#000 !important;
  73. /*text-shadow:1px 1px 0px #FFF;*/
  74. }
  75. #login form label {
  76. color:#333;
  77. color: #585858;
  78. }
  79. #login form .input {
  80. border:1px solid #EAEAEA;
  81. border-radius:0px;
  82. background:none;
  83. padding:5px 15px;
  84. color:#444;
  85. font-weight:normal;
  86. font-size:16px;
  87. background:#FFF;
  88. font-family:"Microsoft Yahei";
  89. box-shadow: 0 0 0px 1000px white inset;
  90. height: 46px;
  91. border-radius: 12px;
  92. margin-top: 10px;
  93. }
  94. #login form .input:active {
  95. box-shadow:0 0 0px 1000px white inset;
  96. color: #676767 !important;
  97. }
  98. #login form .input:focus {
  99. box-shadow:0 0 0px 1000px white inset;
  100. color: #676767 !important;
  101. border: 1px solid #FF5656;
  102. }
  103. .login .button.wp-hide-pw{
  104. height: 46px;
  105. outline: none;
  106. box-shadow: none;
  107. border: none;
  108. opacity: .8;
  109. }
  110. .login .button.wp-hide-pw .dashicons{
  111. right: 1rem;
  112. top: 0.2rem;
  113. }
  114. #login .form-send .bot {
  115. width:100%;
  116. border-bottom:1px solid #ccc;
  117. }
  118. #login form .forgetmenot {
  119. float:none;
  120. }
  121. #login form p.submit {
  122. padding:0px 35px !important;
  123. }
  124. #login .submit .button {
  125. width:50%;
  126. margin-top: 10%;
  127. margin-bottom: 5%;
  128. margin-left: 25%;
  129. margin-right: 25%;
  130. border:none;
  131. float:none;
  132. border-radius:12px;
  133. height:45px;
  134. font-size:16px;
  135. text-align:center;
  136. color:#FFF;
  137. /*background:#505050;*/
  138. font-weight:normal;
  139. cursor:pointer;
  140. box-shadow: none;
  141. text-shadow: none;
  142. }
  143. .login #nav , #backtoblog {
  144. /*display:none*/
  145. color: #585858 !important;
  146. }
  147. .login #backtoblog {
  148. display:none
  149. }
  150. .login #nav {
  151. margin: 0;
  152. margin-bottom: 15px;
  153. margin-left: 2.5%;
  154. text-align: center;
  155. }
  156. .login .ds-login{
  157. margin-left: 38px;
  158. }
  159. .login form input[type=checkbox] {
  160. background: #FFFFFF;
  161. box-shadow: none;
  162. width:20px;
  163. height:20px;
  164. border-radius: 2px;
  165. }
  166. input[type=checkbox]:checked:before {
  167. margin: -2px 0 0 -2px;
  168. }
  169. /* loading */
  170. .loading { position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:99; overflow:hidden; background:#000; }
  171. .loading img { position:absolute; top:50%; left:50%; width:58px; height:10px; margin:-5px 0px 0px -29px; }
  172. /* auto hide */
  173. .login #login_error {
  174. position: absolute;
  175. border-radius: 6px;
  176. width: 322px
  177. }
  178. .login .message {
  179. border-radius: 6px;
  180. -moz-animation: cssAnimation 0s ease-in 5s forwards;
  181. /* Firefox */
  182. -webkit-animation: cssAnimation 0s ease-in 5s forwards;
  183. /* Safari and Chrome */
  184. -o-animation: cssAnimation 0s ease-in 5s forwards;
  185. /* Opera */
  186. animation: cssAnimation 0s ease-in 5s forwards;
  187. -webkit-animation-fill-mode: forwards;
  188. animation-fill-mode: forwards;
  189. }
  190. @keyframes cssAnimation {
  191. to {
  192. padding: 0;
  193. width:0;
  194. height:0;
  195. overflow:hidden;
  196. }
  197. }
  198. @-webkit-keyframes cssAnimation {
  199. to {
  200. padding: 0;
  201. width:0;
  202. height:0;
  203. visibility:hidden;
  204. }
  205. }
  206. /*reset password page*/
  207. .password-input-wrapper {
  208. width: 100%;
  209. margin-top: 10px;
  210. }
  211. .password-input {
  212. margin-top: 0 !important;
  213. }
  214. .button-secondary {
  215. padding-top: 10px !important;
  216. padding-left: 40px !important;
  217. }
  218. /*验证*/
  219. #slider {
  220. margin: 0 auto;
  221. /*width: 300px;*/
  222. height: 46px;
  223. position: relative;
  224. border-radius: 3px;
  225. background-color: #eee;
  226. overflow: hidden;
  227. text-align: center;
  228. border-radius: 12px;
  229. user-select: none;
  230. -moz-user-select: none;
  231. -webkit-user-select: none;
  232. }
  233. #slider_bg {
  234. position: absolute;
  235. left: 0;
  236. top: 0;
  237. height: 100%;
  238. /*background-color: #444;*/
  239. z-index: 1;
  240. border-radius: 3px 0 0 3px;
  241. background: #FF5656; /* fallback for old browsers */
  242. background: -webkit-linear-gradient(to left, #FFC371, #FF5656); /* Chrome 10-25, Safari 5.1-6 */
  243. background: linear-gradient(to left, #FFC371, #FF5656); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  244. }
  245. #label {
  246. width: 50px;
  247. position: absolute;
  248. left: 0;
  249. top: 0;
  250. height: 44px;
  251. line-height: 35px;
  252. border: 1px solid #f1f1f1;
  253. background: #fff;
  254. z-index: 3;
  255. cursor: move;
  256. /*color: #505050;*/
  257. font-size: 38px;
  258. font-weight: 900;
  259. border-radius: 12px;
  260. }
  261. #labelTip {
  262. position: absolute;
  263. left: 0;
  264. width: 100%;
  265. height: 100%;
  266. font-size: 13px;
  267. font-family: 'Microsoft Yahei', serif;
  268. font-style: oblique;
  269. color: #FFF;
  270. border-radius: 12px;
  271. /*background-color: #505050;*/
  272. line-height: 46px;
  273. text-align: center;
  274. z-index: 2;
  275. }
  276. #verification-slider{
  277. margin: 1em;
  278. padding: 0px 21px;
  279. }
  280. #verification-ok{
  281. color: #777 !important;
  282. margin: auto;
  283. margin-top: 0 !important;
  284. text-align: center;
  285. }
  286. .clear {
  287. display:none
  288. }
  289. .login form .forgetmenot label {
  290. font-size: 14px !important;
  291. }
  292. #rememberme {
  293. float: right;
  294. margin-top: 0px;
  295. }
  296. .forgetmenot input[type=checkbox] {
  297. height: 0;
  298. width: 0;
  299. visibility: hidden;
  300. }
  301. .forgetmenot label {
  302. cursor: pointer;
  303. text-indent: -999.9px;
  304. width: 21.0px;
  305. height: 11.0px;
  306. background: grey;
  307. display: block;
  308. border-radius: 10.0px;
  309. position: relative;
  310. }
  311. .forgetmenot label:after {
  312. content: '';
  313. position: absolute;
  314. top: 1px;
  315. left: 1px;
  316. width: 9.0px;
  317. height: 9.0px;
  318. background: #fff;
  319. border-radius: 9.0px;
  320. transition: 0.3s;
  321. }
  322. /*.forgetmenot input:checked + label {
  323. background: #505050;
  324. }*/
  325. .forgetmenot input:checked + label:after {
  326. left: calc(100% - 1px);
  327. transform: translateX(-100%);
  328. }
  329. .forgetmenot label:active:after {
  330. width: 13.0px;
  331. }
  332. .pw-weak {
  333. text-align: center
  334. }
  335. .login .privacy-policy-page-link {
  336. margin: 1em 0 1em !important;
  337. }
  338. .login label {
  339. font-size: 14px;
  340. font-weight: 600;
  341. line-height: 1.5;
  342. display: inline-block;
  343. margin-bottom: 3px;
  344. }
  345. .vaptchaContainer{
  346. width: 280px;
  347. height: 46px;
  348. margin: auto;
  349. margin-bottom: 16px;
  350. }
  351. .vaptcha-init-main {
  352. display: table;
  353. width: 100%;
  354. height: 100%;
  355. background-color: #eeeeee;
  356. border-radius: 20px;
  357. }
  358. .vaptcha-init-loading {
  359. display: table-cell;
  360. vertical-align: middle;
  361. text-align: center;
  362. }
  363. .vaptcha-init-loading > a {
  364. display: inline-block;
  365. width: 18px;
  366. height: 18px;
  367. border: none;
  368. }
  369. .vaptcha-init-loading .vaptcha-text {
  370. font-family: sans-serif;
  371. font-size: 12px;
  372. color: #cccccc;
  373. vertical-align: middle;
  374. }
  375. .vp-basic-btn
  376. {
  377. border-radius: 12px !important;
  378. }