apps-detail.css 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757
  1. .app-details2 {
  2. background-color: unset;
  3. }
  4. .app-details2 .details-top,
  5. .app-details2 .app-information,
  6. .app-details2 .tabs {
  7. background-color: #ffffff;
  8. }
  9. .app-details .details-bottom table th .th-line {
  10. border-left: unset;
  11. height: 23px;
  12. display: inline-block;
  13. padding-left: unset;
  14. color: rgba(21, 21, 21, 1);
  15. font-family: Source Han Sans SC;
  16. font-weight: 500;
  17. font-size: 14px;
  18. line-height: 23px;
  19. vertical-align: middle;
  20. }
  21. .app-details2 .d-table-wrap table td {
  22. padding: 0;
  23. }
  24. .app-details2 .d-table-wrap table td>div,
  25. .app-details2 .d-table-wrap table td>span,
  26. .app-details2 .d-table-wrap table td .test-download {
  27. padding: 0;
  28. font-family: Source Han Sans SC;
  29. font-weight: 500;
  30. font-size: 14px;
  31. line-height: 23px;
  32. vertical-align: middle;
  33. color: rgba(143, 149, 159, 1);
  34. }
  35. .app-details2 .copy.top-5 {
  36. color: rgba(33, 104, 251, 1);
  37. font-family: Source Han Sans SC;
  38. font-weight: 500;
  39. font-size: 13px;
  40. line-height: 23px;
  41. top: 0px;
  42. }
  43. .app-details2 .app-information .more-wrap img {
  44. width: 50px;
  45. height: 50px;
  46. position: absolute;
  47. left: 90px;
  48. top: -30px;
  49. transition: all 500ms;
  50. background-color: #fff;
  51. }
  52. .app-details2 .app-information .more-wrap img {
  53. width: 50px;
  54. height: 50px;
  55. position: absolute;
  56. left: 82px;
  57. top: -22px;
  58. transition: all 500ms;
  59. background-color: #fff;
  60. }
  61. /* 标签页样式 */
  62. .tabs {
  63. margin: 12px 0;
  64. padding: 10px 30px;
  65. }
  66. .tabs .nav-tabs {
  67. border-bottom: 0 solid #e5e5e5;
  68. }
  69. .tabs .nav-tabs>li>a {
  70. border: none;
  71. padding: 12px 2px;
  72. margin-right: 24px;
  73. border-radius: 0;
  74. color: rgba(143, 149, 159, 1);
  75. font-family: Source Han Sans SC;
  76. font-weight: 500;
  77. font-size: 15px;
  78. line-height: 20px;
  79. }
  80. .tabs .nav-tabs>li>a:hover {
  81. border: none;
  82. background-color: #ffffff;
  83. color: rgba(75, 132, 255, 1);
  84. }
  85. .tabs .nav-tabs>li.active>a,
  86. .tabs .nav-tabs>li.active>a:hover,
  87. .tabs .nav-tabs>li.active>a:focus {
  88. border: none;
  89. border-bottom: 2px solid rgba(75, 132, 255, 1);
  90. color: rgba(75, 132, 255, 1);
  91. font-weight: 700;
  92. }
  93. .tabs .tab-content {
  94. padding: 24px 0 0 0;
  95. }
  96. .tabs .tab-pane {
  97. min-height: 200px;
  98. }
  99. .app-details2 .table-list {
  100. padding: 0;
  101. }
  102. /* 设置区域样式 */
  103. .settings-section {
  104. margin-bottom: 30px;
  105. padding: 20px;
  106. background: #fff;
  107. border: 1px solid #e5e5e5;
  108. border-radius: 5px;
  109. }
  110. .section-title {
  111. margin: 0 0 20px 0;
  112. padding-bottom: 10px;
  113. border-bottom: 1px solid #e5e5e5;
  114. color: #333;
  115. font-size: 16px;
  116. font-weight: 600;
  117. }
  118. .section-title .iconfont {
  119. margin-right: 8px;
  120. color: #007AFF;
  121. }
  122. .form-group {
  123. margin-bottom: 15px;
  124. }
  125. .form-group .control-label {
  126. font-weight: 500;
  127. color: #555;
  128. margin-bottom: 5px;
  129. }
  130. .form-control-static {
  131. color: #333;
  132. padding: 8px 0;
  133. }
  134. .help-block {
  135. margin-top: 5px;
  136. color: #999;
  137. font-size: 12px;
  138. }
  139. .text-muted {
  140. color: #999;
  141. text-align: center;
  142. padding: 40px 0;
  143. }
  144. /* 通用icon样式 */
  145. .iconfont {
  146. background: url(/static/index/image/inner-nav/icon1.svg) no-repeat center center;
  147. background-size: 100% 100%;
  148. width: 23px;
  149. height: 23px;
  150. display: inline-block;
  151. vertical-align: middle;
  152. position: absolute;
  153. pointer-events: none;
  154. }
  155. .iconfont::before {
  156. content: '';
  157. }
  158. .icon-date {
  159. background-image: url(/static/index/image/my-app/icon-date.svg);
  160. margin-right: 0;
  161. top: 6px;
  162. right: 12px;
  163. }
  164. /* 通用表格设置 */
  165. .table {
  166. border: 1px solid #e5e5e5;
  167. }
  168. .table>tbody>tr>th {
  169. background: rgba(245, 246, 247, 1);
  170. height: 36px;
  171. color: rgba(143, 149, 159, 1);
  172. font-family: Source Han Sans SC;
  173. font-weight: 500;
  174. font-size: 14px;
  175. line-height: 18px;
  176. text-align: center;
  177. vertical-align: middle !important;
  178. }
  179. .table>tbody>tr>td {
  180. color: rgba(0, 0, 0, 1);
  181. box-sizing: border-box;
  182. padding: 0 15px !important;
  183. height: 50px;
  184. text-align: center;
  185. font-family: Source Han Sans SC;
  186. font-weight: 400;
  187. font-size: 14px;
  188. line-height: 13px;
  189. border-top: unset;
  190. border-bottom: 1px solid rgba(232, 234, 236, 1);
  191. vertical-align: middle !important;
  192. }
  193. .table>tfoot>tr>td {
  194. padding: 0 15px !important;
  195. vertical-align: middle !important;
  196. text-align: center;
  197. }
  198. .table>tbody>tr:hover>td {
  199. background-color: #ebf7ff;
  200. }
  201. .table>tbody>tr>td.angle-parent {
  202. color: rgba(75, 132, 255, 1);
  203. }
  204. .table>tbody>tr>td>a {
  205. color: rgba(33, 104, 251, 1);
  206. font-weight: 500;
  207. font-size: 14px;
  208. }
  209. .table>tbody>tr>td>a+a {
  210. margin-left: 14px;
  211. }
  212. /* 翻页 */
  213. .pagination {
  214. margin: 10px 0 10px;
  215. }
  216. .pagination>li>a,
  217. .pagination>li>span
  218. {
  219. color: rgba(33, 104, 251, 1);
  220. }
  221. .pagination>.active>a,
  222. .pagination>.active>a:focus,
  223. .pagination>.active>a:hover,
  224. .pagination>.active>span,
  225. .pagination>.active>span:focus,
  226. .pagination>.active>span:hover {
  227. background-color: rgba(33, 104, 251, 1);
  228. border-color: rgba(33, 104, 251, 1);
  229. }
  230. .pagination>li:first-child {
  231. display: inline-block;
  232. padding: 7px 12px;
  233. background-color: transparent!important;
  234. border: unset;
  235. color: rgba(33, 104, 251, 1);
  236. pointer-events: none;
  237. }
  238. /* 通用表单样式 */
  239. .form-group .control-label {
  240. padding: 0;
  241. margin-bottom: 0;
  242. text-align: right;
  243. color: rgba(0, 0, 0, 1);
  244. font-family: Source Han Sans SC;
  245. font-weight: 500;
  246. font-size: 14px;
  247. line-height: 30px;
  248. }
  249. .form-control {
  250. border: 1px solid rgba(232, 234, 236, 1);
  251. width: 512px;
  252. height: 34px;
  253. padding: 0 20px;
  254. font-family: Source Han Sans SC;
  255. font-weight: 400;
  256. font-size: 14px;
  257. vertical-align: middle;
  258. color: rgba(0, 0, 0, 1);
  259. }
  260. .form-control:focus {
  261. border-color: #157df1;
  262. outline: 0;
  263. box-shadow: 0 0 0 2px rgba(21, 125, 241, 0.2);
  264. }
  265. .btn-apps-save {
  266. background: rgba(33, 104, 251, 1);
  267. line-height: 34px;
  268. border-radius: 4px;
  269. padding: 0 20px;
  270. color: #ffffff;
  271. border: unset;
  272. }
  273. /* 应用版本 */
  274. .app-details-update .form-control {
  275. width: 450px;
  276. }
  277. /* 基本设置 - 表单样式 */
  278. .basic {
  279. /* padding: 20px 0; */
  280. }
  281. .basic .form-group {
  282. margin-bottom: 20px;
  283. }
  284. .basic .form-group .control-label {
  285. width: 65px;
  286. }
  287. .basic .form-group .control-label span {
  288. color: #ff4222;
  289. margin-right: 2px;
  290. }
  291. .basic .short-link .link {
  292. background: rgba(246, 248, 250, 1);
  293. width: 278px;
  294. height: 34px;
  295. line-height: 34px;
  296. padding-left: 20px;
  297. color: rgba(0, 0, 0, 1);
  298. font-size: 14px;
  299. }
  300. .basic .short-link .link-wrap {
  301. display: flex;
  302. width: 640px;
  303. }
  304. #url {
  305. width: 234px;
  306. }
  307. .form-group ul li .icon.icon-radio {
  308. background: url('/static/index/image/my-app/icon-radio-off.svg') no-repeat center;
  309. background-size: 100% 100%;
  310. width: 20px;
  311. height: 20px;
  312. margin-right: 12px;
  313. top: 0;
  314. }
  315. .form-group ul li .icon.icon-radio-checked {
  316. background-image: url('/static/index/image/my-app/icon-radio-on.svg');
  317. }
  318. /* 模态框样式 */
  319. .ms-modal .modal-sm {
  320. width: 320px;
  321. }
  322. .ms-modal .modal-dialog {
  323. margin-top: 100px;
  324. }
  325. .ms-modal .modal-body {
  326. padding: 30px;
  327. }
  328. .ms-modal .modal-content {
  329. border-radius: 8px;
  330. border: none;
  331. box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  332. }
  333. .auto-hide-modal .modal-content {
  334. background-color: transparent;
  335. box-shadow: none;
  336. border: none;
  337. }
  338. .auto-hide-modal .auto-hide {
  339. background-color: #666;
  340. padding: 20px 25px;
  341. border-radius: 5px;
  342. display: inline-block;
  343. color: #fff;
  344. text-align: center;
  345. }
  346. .auto-hide .mt5 {
  347. margin-top: 5px;
  348. font-size: 14px;
  349. }
  350. /* 响应式样式 */
  351. @media (max-width: 768px) {
  352. .basic .form-group .control-label {
  353. text-align: left;
  354. margin-bottom: 5px;
  355. }
  356. .basic .short-link .col-sm-6 {
  357. margin-bottom: 10px;
  358. }
  359. .ms-modal .modal-dialog {
  360. margin: 50px 15px 10px;
  361. }
  362. }
  363. /* 高级设置样式 */
  364. .senior .form-group {
  365. margin-bottom: 30px;
  366. }
  367. /* 单选按钮样式 */
  368. .senior .trust {
  369. list-style: none;
  370. padding: 0;
  371. margin: 0;
  372. }
  373. .senior .trust li {
  374. float: left;
  375. margin-right: 56px;
  376. cursor: pointer;
  377. padding: 8px 0;
  378. transition: all 0.3s ease;
  379. }
  380. .senior .trust li:hover {
  381. color: #157df1;
  382. }
  383. .senior .trust li.active {
  384. color: #157df1;
  385. }
  386. .senior .form-group .control-label {
  387. width: 84px;
  388. }
  389. /* 下载方式样式 */
  390. .senior .download-way {
  391. list-style: none;
  392. padding: 0;
  393. margin: 0;
  394. }
  395. .senior .download-way li {
  396. float: left;
  397. margin-right: 30px;
  398. cursor: pointer;
  399. padding: 10px 0;
  400. transition: all 0.3s ease;
  401. }
  402. .senior .download-way li:hover {
  403. color: #157df1;
  404. }
  405. .senior .download-way li.active {
  406. color: #157df1;
  407. }
  408. /* 表单控件样式 */
  409. .senior textarea.form-control {
  410. height: auto;
  411. min-height: 120px;
  412. resize: vertical;
  413. padding: 12px 20px;
  414. line-height: 1.5;
  415. }
  416. /* 条件显示元素 */
  417. #apppwd,
  418. .auth_code_dispense_url {
  419. transition: all 0.3s ease;
  420. }
  421. /* 响应式高级设置 */
  422. @media (max-width: 768px) {
  423. .senior .form-group .control-label {
  424. text-align: left;
  425. margin-bottom: 5px;
  426. }
  427. .senior .trust li,
  428. .senior .download-way li {
  429. float: none;
  430. margin-right: 0;
  431. margin-bottom: 10px;
  432. }
  433. .senior .download-way {
  434. margin-bottom: 20px;
  435. }
  436. }
  437. /* 模板设置样式 */
  438. .download-template .form-group {
  439. margin-bottom: 30px;
  440. }
  441. .download-template .form-group .control-label {
  442. width: 56px;
  443. }
  444. /* 模板语言设置样式 */
  445. .download-template .template-language {
  446. list-style: none;
  447. }
  448. .download-template .template-language li {
  449. float: left;
  450. margin-right: 56px;
  451. cursor: pointer;
  452. padding: 8px 0;
  453. }
  454. .download-template .template-language li:hover {
  455. color: #157df1;
  456. }
  457. .download-template .template-language li.active {
  458. color: #157df1;
  459. }
  460. .download-template .template-language li .icon-radio {
  461. background: url('/static/index/image/my-app/icon-radio-off.svg') no-repeat center;
  462. background-size: 100% 100%;
  463. width: 20px;
  464. height: 20px;
  465. margin-right: 12px;
  466. top: 0;
  467. }
  468. .download-template .template-language li .icon-radio-checked {
  469. background-image: url('/static/index/image/my-app/icon-radio-on.svg');
  470. }
  471. /* 模板选择样式 */
  472. .download-template .template-list {
  473. list-style: none;
  474. padding: 0;
  475. margin: 0;
  476. display: flex;
  477. flex-wrap: wrap;
  478. }
  479. .download-template .template-list li {
  480. position: relative;
  481. text-align: center;
  482. cursor: pointer;
  483. margin: 0 20px 20px 0;
  484. width: 120px;
  485. height: 151px;
  486. }
  487. .download-template .template-list li .t-checked {
  488. border: 2px solid rgba(43, 194, 101, 1);
  489. }
  490. .download-template .template-list li:hover,
  491. .download-template .template-list li.active {}
  492. .download-template .template-list li .t-checked::after {
  493. content: '';
  494. position: absolute;
  495. right: 0;
  496. bottom: 0;
  497. background-image: url('/static/index/image/my-app/icon-review.svg');
  498. background-size: 100% 100%;
  499. width: 25px;
  500. height: 25px;
  501. }
  502. .download-template .t-checked-wrap {
  503. position: relative;
  504. overflow: hidden;
  505. height: 100%;
  506. width: 100%;
  507. }
  508. .download-template .t-checked-wrap img {
  509. width: 100%;
  510. height: 100%;
  511. object-fit: cover;
  512. display: block;
  513. }
  514. .download-template .t-checked {
  515. position: absolute;
  516. top: 0;
  517. left: 0;
  518. right: 0;
  519. bottom: 0;
  520. display: none;
  521. align-items: center;
  522. justify-content: center;
  523. color: #fff;
  524. }
  525. .download-template .t-checked .icon-xuanzhong1 {
  526. font-size: 24px;
  527. }
  528. .download-template ul li .text {
  529. display: block;
  530. margin-top: 8px;
  531. color: #157df1;
  532. text-decoration: none;
  533. font-size: 14px;
  534. font-weight: 500;
  535. }
  536. .download-template ul li .text:hover {
  537. text-decoration: underline;
  538. }
  539. .download-template input[type="radio"] {
  540. display: none;
  541. }
  542. /* 响应式模板设置 */
  543. @media (max-width: 768px) {
  544. .download-template .form-group .control-label {
  545. text-align: left;
  546. margin-bottom: 5px;
  547. }
  548. .download-template .template-language li {
  549. float: none;
  550. margin-right: 0;
  551. margin-bottom: 10px;
  552. }
  553. .download-template ul {
  554. justify-content: center;
  555. }
  556. .download-template .t-checked-wrap img {
  557. width: 150px;
  558. height: 90px;
  559. }
  560. }
  561. /* 下载记录样式 */
  562. .download-details {
  563. background-color: #fff;
  564. padding: 0;
  565. min-height: 360px;
  566. }
  567. .download-details .date {
  568. float: left;
  569. width: 150px;
  570. position: relative;
  571. }
  572. .download-details .date1 {
  573. margin-right: 8px;
  574. }
  575. .download-details .date2 {
  576. margin-right: 24px;
  577. }
  578. .download-details .date input {
  579. position: relative;
  580. z-index: 1;
  581. background-color: transparent;
  582. cursor: pointer;
  583. }
  584. .download-details .d-top {
  585. margin-bottom: 15px;
  586. }
  587. .download-details .d-top .form-control {
  588. height: 34px;
  589. width: 149px;
  590. padding: 0 35px 0 20px;
  591. box-sizing: border-box;
  592. }
  593. .download-details .d-top .line {
  594. margin-right: 8px;
  595. color: #aaa;
  596. width: 16px;
  597. height: 18px;
  598. border-bottom: 1px solid rgba(143, 149, 159, 1);
  599. font-size: 0;
  600. }
  601. .download-details .d-top button {
  602. color: rgba(33, 104, 251, 1);
  603. font-family: Source Han Sans SC;
  604. font-weight: 500;
  605. font-size: 16px;
  606. text-align: center;
  607. vertical-align: middle;
  608. height: 34px;
  609. line-height: 32px;
  610. border-radius: 4px;
  611. border-width: 1px;
  612. padding: 0 20px;
  613. border: 1px solid rgba(33, 104, 251, 1)
  614. }
  615. .download-details .d-top button:hover {
  616. color: #ffffff;
  617. }
  618. .download-details .d-top .num {
  619. margin-left: 40px;
  620. color: rgba(21, 21, 21, 1);
  621. font-family: Source Han Sans SC;
  622. font-weight: 500;
  623. font-size: 14px;
  624. line-height: 34px;
  625. text-align: center;
  626. vertical-align: middle;
  627. }
  628. .download-details .d-top .num i {
  629. color: rgba(33, 104, 251, 1);
  630. }
  631. .download-details .no-content {
  632. text-align: center;
  633. margin-top: 100px;
  634. }
  635. .download-details .no-content img {
  636. width: 100px;
  637. height: 100px;
  638. margin-bottom: 20px;
  639. }