ininPsd.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738
  1. @charset "utf-8";html{background-color:#fff;}
  2. body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0}
  3. body,input,textarea,button,select,pre,xmp,tt,code,kbd,samp{line-height:1.5;font-family:'HYQiHei 55S',sans-serif}
  4. h1,h2,h3,h4,h5,h6,small,big,input,textarea,button,select{font-size:100%;outline: none;}
  5. h1,h2,h3,h4,h5,h6{font-family:'HYQiHei 65S',sans-serif}
  6. h1,h2,h3,h4,h5,h6,b,strong{font-weight:normal}
  7. address,cite,dfn,em,i,optgroup,var{font-style:normal}
  8. table{border-collapse:collapse;border-spacing:0;text-align:left}
  9. caption,th{text-align:inherit}
  10. ul,ol,menu{list-style:none}
  11. fieldset,img{border:0}
  12. img,object,input,textarea,button,select{vertical-align:middle}
  13. article,aside,footer,header,section,nav,figure,figcaption,hgroup,details,menu{display:block}
  14. audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
  15. blockquote:before,blockquote:after,q:before,q:after{content:"\0020"}
  16. textarea{overflow:auto;resize:vertical}
  17. input,textarea,button,select,a{outline:0 none;border: none;}
  18. input::-webkit-input-placeholder{color: #ddd;}
  19. button{cursor: pointer;background: transparent;}
  20. button[disabled=true],button[disabled='disabled']{opacity: 0.6;}
  21. button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}
  22. mark{background-color:transparent}
  23. a,ins,s,u,del{text-decoration:none}
  24. p,small{word-wrap: break-word; word-break: break-all;}
  25. sup,sub{vertical-align:baseline}
  26. html {height: 100%;width:100%;-webkit-tap-highlight-color: transparent;touch-action: pan-x pan-y;}
  27. body {font-family:'HYQiHei 55S',sans-serif;color:#000;-webkit-text-size-adjust: none;-webkit-font-smoothing:antialiased;}
  28. hr {height: .02rem;margin: .1rem 0;border: medium none;border-top: .02rem solid #cacaca;}
  29. a {color: #25a4bb;text-decoration: none;}
  30. .clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
  31. /* 隐藏 input[type="number"]箭头*/
  32. input::-webkit-outer-spin-button,
  33. input::-webkit-inner-spin-button
  34. {
  35. -webkit-appearance: none;
  36. }
  37. input[type="number"]{
  38. -moz-appearance: textfield;
  39. }
  40. /* */
  41. /*************************************************up reset css*************************************************************************************************/
  42. /* 字号适配*/
  43. .fz_32{ font-size: 32px;}
  44. .fz_28{ font-size: 28px;}
  45. .fz_24{ font-size: 22px;}
  46. .fz_23{ font-size: 23px;}
  47. .initPsd{
  48. position: relative;
  49. /* width: 45%;
  50. margin: 30px auto; */
  51. background: #fff;
  52. border-radius: 12px;
  53. padding: 30px;
  54. color: #333333;
  55. /* box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.32); */
  56. overflow: hidden;
  57. }
  58. .initPsd h3{
  59. text-align: center;
  60. height: 60px;
  61. line-height: 60px;
  62. margin: 60px;
  63. }
  64. .initPsd h5{
  65. height: 60px;
  66. line-height: 60px;
  67. padding:0px 30px;
  68. background-color: #f4f4f4;
  69. }
  70. .initPsd h6{
  71. height: 60px;
  72. line-height: 60px;
  73. }
  74. #restart-time{
  75. font-size: 36px;
  76. }
  77. .rows_restart{
  78. margin: 60px 40px 50px 40px;
  79. display: flex;
  80. justify-content: space-between;
  81. align-items: center;
  82. color: #ABABAB;
  83. font-size: 28px;
  84. }
  85. .initPsd .config, .setting{
  86. margin-top: 30px;
  87. border-radius: 12px;
  88. border: 1px solid #e4e4e4;
  89. }
  90. .restart_span{
  91. color: #333333;
  92. font-size: 28px;
  93. word-break: break-all;
  94. width: 100%;
  95. text-align: left;
  96. }
  97. .initPsd .rows{
  98. width: 100%;
  99. height: 60px;
  100. padding:0px 30px;
  101. line-height: 60px;
  102. font-size: 24px;
  103. display: flex;
  104. box-sizing: border-box;
  105. justify-content: space-between;
  106. align-items: center;
  107. border-bottom: 1px solid #e4e4e4;
  108. }
  109. .box_wrapper .input_wrapper{
  110. width: 100%;
  111. height: 56px;
  112. padding: 0 20px;
  113. box-sizing: border-box;
  114. border: 1px solid #e4e4e4;
  115. font-size: 24px;
  116. line-height: 32px;
  117. }
  118. .box_wrapper .input_error{
  119. display: none;
  120. color: #F95A56;
  121. font-size: 24px;
  122. line-height: 1.5;
  123. margin-top: 10px;
  124. width: 100%;
  125. text-align: left;
  126. }
  127. .box_wrapper .inputURL{
  128. width: 100%;
  129. height: 100%;
  130. text-align: left;
  131. }
  132. .initPsd .configAddr{
  133. height: 80px;
  134. line-height: 80px;
  135. }
  136. .initPsd button, .initPsd input{
  137. display: block;
  138. font-size: 24px;
  139. }
  140. .initPsd input{
  141. text-align: right;
  142. }
  143. .initPsd .btn{
  144. display: flex;
  145. justify-content: center;
  146. margin-top: 30px;
  147. }
  148. .initPsd .rows_restart button{
  149. height: 56px;
  150. line-height: 56px;
  151. border-radius: 50px;
  152. padding: 0px 41px;
  153. margin: 0;
  154. }
  155. .initPsd button{
  156. height: 56px;
  157. line-height: 56px;
  158. border-radius: 50px;
  159. padding: 0px 41px;
  160. margin: 15px 25px;
  161. }
  162. .initPsd .btn_wrapper{
  163. display: flex;
  164. justify-content: space-between;
  165. margin-top: 30px;
  166. }
  167. .btn_main{
  168. margin: 15px 0 !important;
  169. background-image: linear-gradient(269deg, #749FFF 1%, #4D7BFE 100%);
  170. color: #FFFFFF;
  171. width: 45%;
  172. }
  173. .btn_main_dis{
  174. margin: 15px 0 !important;
  175. background-image: linear-gradient(269deg, #749FFF 1%, #4D7BFE 100%);
  176. color: #FFFFFF;
  177. width: 45%;
  178. opacity: 0.3;
  179. }
  180. .btn-cancel{
  181. margin: 15px 0 !important;
  182. border: 1px solid #808080;
  183. width: 45%;
  184. }
  185. .btn-blue{
  186. background-image: linear-gradient(to bottom right, #4D7BFE, #749FFF);
  187. }
  188. .btn-gray{
  189. border: 1px solid #808080;
  190. }
  191. .config button{
  192. margin: 15px auto;
  193. }
  194. .modal-box{
  195. display: none;
  196. }
  197. .toast_box{
  198. display: none;
  199. position:fixed;
  200. top:0;
  201. right:0;
  202. bottom:0;
  203. left:0;
  204. text-align:center;
  205. }
  206. .toast_box::before{
  207. content:"";
  208. width:0;
  209. height:100%;
  210. display:inline-block;
  211. vertical-align:middle;
  212. }
  213. .modal_warpper{
  214. background: #FFFFFF;
  215. width: 720px;
  216. display:inline-block;
  217. vertical-align:middle;
  218. text-align:center;
  219. border-radius: 10px;
  220. }
  221. .toast_wrapper{
  222. background: rgba(0, 0, 0, 0.7);
  223. width: 560px;
  224. display:inline-block;
  225. vertical-align:middle;
  226. text-align:center;
  227. border-radius: 10px;
  228. }
  229. .box_wrapper{
  230. display: flex;
  231. flex-direction: column;
  232. align-items: center;
  233. margin-top: 60px;
  234. padding: 0 40px;
  235. }
  236. .toast_wrapper .btn_wrapper{
  237. color: #ffffff;
  238. display: flex;
  239. text-align: center;
  240. width: 100%;
  241. height: 60px;
  242. line-height: 60px;
  243. border-top: 1px solid #ffffff;
  244. font-size: 30px;
  245. margin-top: 20px;
  246. }
  247. .modal_title{
  248. font-size: 36px;
  249. line-height: 54px;
  250. width: 100%;
  251. text-align: left;
  252. margin-bottom: 30px;
  253. }
  254. .modal_warpper .btn_wrapper{
  255. margin: 30px 40px 50px 40px;
  256. display: flex;
  257. justify-content: space-between;
  258. }
  259. .btn_cancel{
  260. width: 280px;
  261. height: 80px;
  262. border-radius: 40px;
  263. border: 1px solid #ABABAB;
  264. font-size: 28px;
  265. display: inline-flex;
  266. align-items: center;
  267. justify-content: center;
  268. }
  269. .btn_confirm{
  270. width: 280px;
  271. height: 80px;
  272. border-radius: 40px;
  273. background-image: linear-gradient(to bottom right, #4D7BFE, #749FFF);
  274. font-size: 28px;
  275. color: #FFFFFF;
  276. display: inline-flex;
  277. align-items: center;
  278. justify-content: center;
  279. }
  280. .wran_icon{
  281. width: 72px;
  282. height: 72px;
  283. }
  284. #modalErrorBox,#ManuallyDownload,#boxRestart{
  285. background-color: rgba(0, 0, 0, 0.5);
  286. }
  287. #modalErrTips{
  288. color: #333333;
  289. font-size: 28px;
  290. line-height: 42px;
  291. word-break: break-all;
  292. width: 100%;
  293. text-align: left;
  294. }
  295. #toastErrTips{
  296. color: #FFFFFF;
  297. margin-top: 40px;
  298. font-size: 36px;
  299. line-height: 54px;
  300. }
  301. .modal{
  302. width: 45%;
  303. background: #fff;
  304. border-radius: 12px;
  305. padding: 30px;
  306. box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.32);
  307. position: absolute;
  308. top: 30%;
  309. left: 27%;
  310. display: flex;
  311. flex-direction: column;
  312. align-items: center;
  313. }
  314. .coverBg{
  315. width: 100%;
  316. height: 100%;
  317. position: absolute;
  318. top: 0px;
  319. left: 0px;
  320. background: rgba(255, 255, 255, 0);
  321. }
  322. .modal p{
  323. line-height: 1.5;
  324. }
  325. .modal img{
  326. margin: 10px 0px 20px 0px;
  327. }
  328. .modal button{
  329. margin: 30px 0px 0px 0px;
  330. }
  331. @media screen and (max-device-width: 650px) {
  332. .fz_32{ font-size: 20px;}
  333. .fz_28{ font-size: 18px;}
  334. .fz_24{ font-size: 16px;}
  335. .fz_23{ font-size: 15px;}
  336. .initPsd {
  337. padding:10px 20px;
  338. }
  339. .initPsd .config, .setting {
  340. margin-top: 10px;
  341. }
  342. .initPsd h3 {
  343. height: 25px;
  344. line-height: 25px;
  345. padding: 0px 10px;
  346. }
  347. .initPsd h5 {
  348. height: 40px;
  349. line-height: 40px;
  350. padding: 0px 10px;
  351. }
  352. .initPsd .rows {
  353. height: 40px;
  354. line-height: 40px;
  355. padding: 0px 10px;
  356. font-size: 16px;
  357. }
  358. .initPsd button, .initPsd input {
  359. font-size: 16px;
  360. }
  361. .initPsd button {
  362. height: 36px;
  363. line-height: 36px;
  364. padding: 0px 25px;
  365. margin: 10px 15px;
  366. }
  367. .config button {
  368. margin: 10px auto;
  369. }
  370. .modal {
  371. width: 40%;
  372. padding: 20px;
  373. top:25%;
  374. z-index: 99;
  375. }
  376. }
  377. /**************************************** errPage *******************************/
  378. nav{
  379. padding: 0px 40px;
  380. height: 120px;
  381. margin-bottom: 60px;
  382. display: flex;
  383. align-items: center;
  384. }
  385. nav ul{
  386. display: none;
  387. width: 100%;
  388. margin-left: 40px;
  389. justify-content: space-around;
  390. }
  391. nav ul li{
  392. display: flex;
  393. align-items: center;
  394. border-radius: 50px;
  395. background: #fff;
  396. padding: 15px 20px;
  397. box-sizing: border-box;
  398. box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  399. cursor: pointer;
  400. }
  401. nav ul li::before{
  402. display: inline-table;
  403. width: 25px;
  404. height: 25px;
  405. margin-right: 5px;
  406. content: '';
  407. }
  408. nav ul li:nth-child(1)::before{
  409. background: url('../images/config.png');
  410. background-size: cover;
  411. }
  412. nav ul li:nth-child(2)::before{
  413. background: url('../images/reset.png');
  414. background-size: cover;
  415. }
  416. nav ul li:nth-child(3)::before{
  417. background: url('../images/restart_a.png');
  418. background-size: cover;
  419. }
  420. nav ul li:nth-child(4)::before{
  421. background: url('../images/restart_c.png');
  422. background-size: cover;
  423. }
  424. nav ul li:nth-child(5)::before{
  425. background: url('../images/off.png');
  426. background-size: cover;
  427. }
  428. nav ul li:nth-child(6)::before{
  429. background: url('../images/min.png');
  430. background-size: cover;
  431. }
  432. .imgDiv{
  433. text-align: center;
  434. }
  435. .errPage p{
  436. text-align: center;
  437. margin: 8px 0px;
  438. }
  439. .errPage .modal-box p{
  440. max-height: 60px;
  441. overflow: auto;
  442. /* padding: 0 30px; */
  443. }
  444. .errPage .logo{
  445. width: 32%;
  446. }
  447. .errPage .coverBg {
  448. background: rgba(0, 0, 0, 0.5);
  449. }
  450. .errPage .modal{
  451. padding: 40px 30px;
  452. z-index: 99;
  453. }
  454. .errPage .modal h3{
  455. width: 100%;
  456. text-align: left;
  457. margin-bottom: 30px;
  458. }
  459. .errPage label{
  460. width: 35%;
  461. }
  462. .errPage .btns{
  463. display: flex;
  464. width: 85%;
  465. justify-content: space-between;
  466. }
  467. .errPage .modal button{
  468. width: 200px;
  469. height: 45px;
  470. line-height: 45px;
  471. border-radius: 20px;
  472. }
  473. #RestartTxt{
  474. margin-bottom: 20px;
  475. }
  476. #urlConfigAddr,#urlAccessAddr{
  477. word-break: break-word;
  478. line-height: 1;
  479. }
  480. #SuspensionTxt{
  481. /* max-height: 60px;
  482. overflow: auto; */
  483. margin-bottom: 15px;
  484. padding: 0 30px;
  485. font-size: 28px;
  486. }
  487. #PromptTxt{
  488. padding: 0 30px;
  489. }
  490. #PromptTxt::-webkit-scrollbar,
  491. #errTips::-webkit-scrollbar{
  492. display: none;
  493. }
  494. .boxDownload h3{
  495. text-align: left;
  496. }
  497. @media screen and (min-device-width: 1920px) {
  498. #toastErrTips{
  499. color: #FFFFFF;
  500. margin-top: 40px;
  501. font-size: 40px;
  502. line-height: 60px;
  503. }
  504. #modalErrTips{
  505. color: #333333;
  506. font-size: 28px;
  507. line-height: 42px;
  508. text-align: left;
  509. width: 100%;
  510. }
  511. .modal_title{
  512. font-size: 40px;
  513. line-height: 60px;
  514. text-align: left;
  515. width: 100%;
  516. margin-bottom: 30px;
  517. }
  518. .btn_cancel{
  519. width: 300px;
  520. height: 80px;
  521. border-radius: 40px;
  522. border: 1px solid #ABABAB;
  523. font-size: 32px;
  524. display: inline-flex;
  525. align-items: center;
  526. justify-content: center;
  527. }
  528. .btn_confirm{
  529. width: 300px;
  530. height: 80px;
  531. border-radius: 40px;
  532. background-image: linear-gradient(to bottom right, #4D7BFE, #749FFF);
  533. font-size: 32px;
  534. color: #FFFFFF;
  535. display: inline-flex;
  536. align-items: center;
  537. justify-content: center;
  538. }
  539. .errPage .modal{
  540. width: 30%;
  541. left: 33%;
  542. }
  543. }
  544. /******************************* errPage *******************************/
  545. .iframeDiv{
  546. display: none;
  547. position: absolute;
  548. top: 0px;
  549. left: 0px;
  550. width: 100%;
  551. height: 100%;
  552. background: #fff;
  553. }
  554. .iframeDiv .initPsd {
  555. padding: 20px 30px 30px 30px;
  556. }
  557. .errPage .initPsd{
  558. width: 100%;
  559. height: 900px;
  560. position: fixed;
  561. top: 100px;
  562. left: 0;
  563. }
  564. .errPage .boxDownload .initPsd{
  565. top: 260px;
  566. }
  567. .exitTips{
  568. display: none;
  569. }
  570. .exitTips .box{
  571. width: 30%;
  572. height: 150px;
  573. line-height: 150px;
  574. border-radius: 6px;
  575. font-size: 18px;
  576. background-color: #f4f4f4;
  577. z-index: 9999;
  578. position: absolute;
  579. left: 35%;
  580. top: 50%;
  581. transform: translateY(-150px);
  582. text-align: center;
  583. }
  584. .terminal-time{
  585. display: flex;
  586. justify-content: center;
  587. margin-bottom: 15px;
  588. }
  589. #ErrTime{
  590. margin-left: 25px;
  591. }
  592. #resetPsd, #minimize,#downLoadConfig{
  593. display: none;
  594. }
  595. .configAddr
  596. {
  597. color: #999;
  598. }
  599. #RestartTxt{
  600. display: none;
  601. }
  602. .cardStoreIsBusy{
  603. padding-left: 5%;
  604. display: none;
  605. }
  606. .cardStoreIsBusy p{
  607. font-size: 20px;
  608. text-align: left;
  609. color: #888;
  610. }
  611. .cardStoreIsBusy h1{
  612. font-size: 36px;
  613. }
  614. /********************设备密钥初始化中··· ******************/
  615. .result-wrap{
  616. display: none;
  617. width: 50%;
  618. padding: 20px;
  619. }
  620. .result-item{
  621. display: flex;
  622. justify-content: space-between;
  623. align-items: center;
  624. height: 50px;
  625. line-height: 50px;
  626. font-size: 20px;
  627. }
  628. .result-item label{
  629. color: #999
  630. }
  631. .logo-img{
  632. width: 22.7%;
  633. padding-left: 40px;
  634. margin-top: 32px;
  635. }
  636. .iframe-box p{
  637. color: #b3b1b1;
  638. font-size: 28px;
  639. }
  640. .btn-link{
  641. color: #4D7BFE;
  642. position: fixed;
  643. bottom: 30px;
  644. left: 30px;
  645. }
  646. @media screen and (max-width:1300px) {
  647. .errPage .logo{
  648. width: 30%;
  649. }
  650. nav{
  651. margin-bottom: 90px;
  652. }
  653. nav ul li{
  654. padding: 15px 20px;
  655. }
  656. nav ul li::before {
  657. width: 20px;
  658. height: 20px;
  659. }
  660. .fz_24 {
  661. font-size: 18px;
  662. }
  663. .errPage .initPsd{
  664. width: 100%;
  665. height: 100%;
  666. }
  667. .initPsd .rows{
  668. font-size: 18px;
  669. }
  670. #urlConfigAddr{
  671. font-size: 16px;
  672. }
  673. #toastErrTips{
  674. color: #FFFFFF;
  675. margin-top: 40px;
  676. font-size: 36px;
  677. line-height: 54px;
  678. }
  679. .result-wrap{
  680. width: 50%;
  681. }
  682. }