dcatplus.css 22 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171
  1. .sidebar .badge{
  2. padding:.25em .4em !important;
  3. font-size:10px !important;
  4. top:9px !important;
  5. }
  6. .alert a {
  7. color: unset !important;
  8. font-weight: bold;
  9. font-style: italic;
  10. }
  11. .main-menu .navbar-header{
  12. padding: 0px;
  13. border-bottom: 1px solid #dddddd52;
  14. }
  15. .lake-form-field-iconimg .lake-form-media-img-show {
  16. width: 100px !important;
  17. border: 0px !important;
  18. padding-bottom: 2px !important;
  19. }
  20. .lake-form-field-iconimg .lake-form-media-preview-item {
  21. margin-left: 10px !important;
  22. }
  23. .lake-form-field-iconimg .lake-form-media-row-col .lake-form-media-row-img {
  24. width: 30px;
  25. height: 30px !important;
  26. font-size: 22px !important;
  27. }
  28. .lake-form-field-iconimg img {
  29. width: 24px;
  30. height: 24px;
  31. }
  32. .lake-form-field-iconimg input {
  33. width: 120px !important;
  34. }
  35. .lake-form-field-iconimg .input-group {
  36. width: 260px !important;
  37. }
  38. .main-sidebar, .main-sidebar:before{
  39. width:220px;
  40. }
  41. .sidebar-collapse .main-sidebar,.sidebar-collapse .main-sidebar:before {
  42. margin-left: -220px
  43. }
  44. .sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused,.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .brand-link,.sidebar-mini.sidebar-collapse .main-sidebar:hover,.sidebar-mini.sidebar-collapse .main-sidebar:hover .brand-link {
  45. width: 220px
  46. }
  47. .sidebar-mini.sidebar-collapse.layout-fixed .main-sidebar:hover .brand-link {
  48. width: 220px
  49. }
  50. body:not(.sidebar-mini-md) .content-wrapper, body:not(.sidebar-mini-md) .main-footer, body:not(.sidebar-mini-md) .main-header{
  51. margin-left:220px;
  52. }
  53. .header-navbar.fixed-top{
  54. left: 220px;
  55. }
  56. .f14{
  57. font-size: 14px;
  58. }
  59. .f16{
  60. font-size: 16px;
  61. }
  62. .f18{
  63. font-size: 18px;
  64. }
  65. .f20{
  66. font-size: 20px;
  67. }
  68. .f22{
  69. font-size: 22px;
  70. }
  71. .fieldset-box fieldset{
  72. margin:0px;
  73. border-radius:.75rem;
  74. border: 1px solid #dddddd;
  75. padding:15px;
  76. }
  77. .fieldset-box legend{
  78. margin:0px;
  79. font-size:16px;
  80. font-weight: 500;
  81. margin-left: 10px;
  82. padding-left:10px;
  83. padding-right:10px;
  84. width: auto !important;
  85. background-color: #ffffff;
  86. }
  87. .mb-0{
  88. margin-bottom: 0 !important;
  89. }
  90. .media-list .media{
  91. border-bottom: 1px solid #ebebeb;
  92. padding: 10px 0px;
  93. }
  94. .text-line{
  95. display: -webkit-box;
  96. -webkit-box-orient: vertical;
  97. overflow: hidden;
  98. }
  99. .toast-header{
  100. display: -ms-flexbox;
  101. display: flex;
  102. -ms-flex-align: center;
  103. align-items: center;
  104. padding: .25rem .75rem;
  105. color: #6c757d;
  106. background-color: rgba(255, 255, 255, .85);
  107. background-clip: padding-box;
  108. border-bottom: 1px solid rgba(0, 0, 0, .05);
  109. border-top-left-radius: calc(.25rem - 1px);
  110. border-top-right-radius: calc(.25rem - 1px);
  111. }
  112. .accordion .card{
  113. margin-bottom:0px;
  114. }
  115. .accordion h2{
  116. font-size: 16px;
  117. }
  118. .accordion .card-header {
  119. padding: .75rem 1.25rem;
  120. margin-bottom: 0px !important;
  121. background-color: rgba(0, 0, 0, .03);
  122. border-bottom: 1px solid rgba(0, 0, 0, .125);
  123. }
  124. .layout-fixed .main-sidebar-custom{
  125. height: -webkit-fill-available;
  126. }
  127. .elevation-4{
  128. box-shadow: 0 14px 28px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .22) !important;
  129. }
  130. .shadow {
  131. box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
  132. }
  133. .shadow-x{
  134. box-shadow: 0 0 1px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.2)
  135. }
  136. .shadow-lg {
  137. box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
  138. }
  139. .display-1 {
  140. font-size: calc(1.625rem + 4.5vw);
  141. font-weight: 300;
  142. line-height: 1.2
  143. }
  144. @media (min-width: 1200px) {
  145. .display-1 {
  146. font-size:5rem
  147. }
  148. }
  149. .display-2 {
  150. font-size: calc(1.575rem + 3.9vw);
  151. font-weight: 300;
  152. line-height: 1.2
  153. }
  154. @media (min-width: 1200px) {
  155. .display-2 {
  156. font-size:4.5rem
  157. }
  158. }
  159. .display-3 {
  160. font-size: calc(1.525rem + 3.3vw);
  161. font-weight: 300;
  162. line-height: 1.2
  163. }
  164. @media (min-width: 1200px) {
  165. .display-3 {
  166. font-size:4rem
  167. }
  168. }
  169. .display-4 {
  170. font-size: calc(1.475rem + 2.7vw);
  171. font-weight: 300;
  172. line-height: 1.2
  173. }
  174. @media (min-width: 1200px) {
  175. .display-4 {
  176. font-size:3.5rem
  177. }
  178. }
  179. .display-5 {
  180. font-size: calc(1.425rem + 2.1vw);
  181. font-weight: 300;
  182. line-height: 1.2;
  183. }
  184. @media (min-width: 1200px) {
  185. .display-5 {
  186. font-size:3rem;
  187. }
  188. }
  189. .display-6 {
  190. font-size: calc(1.375rem + 1.5vw);
  191. font-weight: 300;
  192. line-height: 1.2
  193. }
  194. @media (min-width: 1200px) {
  195. .display-6 {
  196. font-size:2.5rem
  197. }
  198. }
  199. .ribbon {
  200. position: absolute;
  201. top: .75rem;
  202. right: -.25rem;
  203. z-index: 1;
  204. padding: .25rem .75rem;
  205. font-size: .625rem;
  206. font-weight: 600;
  207. line-height: 1.5rem;
  208. color: #fff;
  209. text-align: center;
  210. text-transform: uppercase;
  211. background: #206bc4;
  212. border-color: #206bc4;
  213. display: inline-flex;
  214. align-items: center;
  215. justify-content: center;
  216. min-height: 2rem;
  217. min-width: 2rem
  218. }
  219. .ribbon:before {
  220. position: absolute;
  221. right: 0;
  222. bottom: 100%;
  223. width: 0;
  224. height: 0;
  225. content: "";
  226. filter: brightness(70%);
  227. border: .125rem solid;
  228. border-color: inherit;
  229. border-top-color: transparent;
  230. border-right-color: transparent
  231. }
  232. .ribbon.bg-blue {
  233. border-color: #206bc4
  234. }
  235. .ribbon.bg-blue-lt {
  236. border-color: #3478c9!important
  237. }
  238. .ribbon.bg-azure {
  239. border-color: #4299e1
  240. }
  241. .ribbon.bg-azure-lt {
  242. border-color: #53a2e4!important
  243. }
  244. .ribbon.bg-indigo {
  245. border-color: #4263eb
  246. }
  247. .ribbon.bg-indigo-lt {
  248. border-color: #5371ed!important
  249. }
  250. .ribbon.bg-purple {
  251. border-color: #ae3ec9
  252. }
  253. .ribbon.bg-purple-lt {
  254. border-color: #b54fce!important
  255. }
  256. .ribbon.bg-pink {
  257. border-color: #d6336c
  258. }
  259. .ribbon.bg-pink-lt {
  260. border-color: #da4579!important
  261. }
  262. .ribbon.bg-red {
  263. border-color: #d63939
  264. }
  265. .ribbon.bg-red-lt {
  266. border-color: #da4b4b!important
  267. }
  268. .ribbon.bg-orange {
  269. border-color: #f76707
  270. }
  271. .ribbon.bg-orange-lt {
  272. border-color: #f8751d!important
  273. }
  274. .ribbon.bg-yellow {
  275. border-color: #f59f00
  276. }
  277. .ribbon.bg-yellow-lt {
  278. border-color: #f6a817!important
  279. }
  280. .ribbon.bg-lime {
  281. border-color: #74b816
  282. }
  283. .ribbon.bg-lime-lt {
  284. border-color: #81be2b!important
  285. }
  286. .ribbon.bg-green {
  287. border-color: #2fb344
  288. }
  289. .ribbon.bg-green-lt {
  290. border-color: #42ba55!important
  291. }
  292. .ribbon.bg-teal {
  293. border-color: #0ca678
  294. }
  295. .ribbon.bg-teal-lt {
  296. border-color: #22ae84!important
  297. }
  298. .ribbon.bg-cyan {
  299. border-color: #17a2b8
  300. }
  301. .ribbon.bg-cyan-lt {
  302. border-color: #2caabe!important
  303. }
  304. .ribbon .icon {
  305. width: 1.25rem;
  306. height: 1.25rem;
  307. font-size: 1.25rem
  308. }
  309. .ribbon-top {
  310. top: -.25rem;
  311. right: .75rem;
  312. width: 2rem;
  313. padding: .5rem 0
  314. }
  315. .ribbon-top:before {
  316. top: 0;
  317. right: 100%;
  318. bottom: auto;
  319. border-color: inherit;
  320. border-top-color: transparent;
  321. border-left-color: transparent
  322. }
  323. .ribbon-top.ribbon-start {
  324. right: auto;
  325. left: .75rem
  326. }
  327. .ribbon-top.ribbon-start:before {
  328. top: 0;
  329. right: 100%;
  330. left: auto
  331. }
  332. .ribbon-start {
  333. right: auto;
  334. left: -.25rem
  335. }
  336. .ribbon-start:before {
  337. top: auto;
  338. bottom: 100%;
  339. left: 0;
  340. border-color: inherit;
  341. border-top-color: transparent;
  342. border-left-color: transparent
  343. }
  344. .ribbon-bottom {
  345. top: auto;
  346. bottom: .75rem
  347. }
  348. .ribbon-bookmark {
  349. padding-left: .25rem
  350. }
  351. .ribbon-bookmark:after {
  352. position: absolute;
  353. top: 0;
  354. right: 100%;
  355. display: block;
  356. width: 0;
  357. height: 0;
  358. content: "";
  359. border: 1rem solid;
  360. border-color: inherit;
  361. border-right-width: 0;
  362. border-left-color: transparent;
  363. border-left-width: .5rem
  364. }
  365. .ribbon-bookmark.ribbon-left {
  366. padding-right: .5rem;
  367. padding-left: .5rem
  368. }
  369. .ribbon-bookmark.ribbon-left:after {
  370. right: auto;
  371. left: 100%;
  372. border-right-color: transparent;
  373. border-right-width: .5rem;
  374. border-left-width: 0
  375. }
  376. .ribbon-bookmark.ribbon-top {
  377. padding-right: 0;
  378. padding-bottom: .25rem;
  379. padding-left: 0
  380. }
  381. .ribbon-bookmark.ribbon-top:after {
  382. top: 100%;
  383. right: 0;
  384. left: 0;
  385. border-color: inherit;
  386. border-width: 1rem;
  387. border-top-width: 0;
  388. border-bottom-color: transparent;
  389. border-bottom-width: .5rem
  390. }
  391. .waterfall-flow .avatar {
  392. --tblr-avatar-size: 2.5rem;
  393. position: relative;
  394. width: var(--tblr-avatar-size);
  395. height: var(--tblr-avatar-size);
  396. font-size: calc(var(--tblr-avatar-size)/ 2.8571429);
  397. font-weight: 500;
  398. display: inline-flex;
  399. align-items: center;
  400. justify-content: center;
  401. color: #656d77;
  402. text-align: center;
  403. text-transform: uppercase;
  404. vertical-align: bottom;
  405. -webkit-user-select: none;
  406. -moz-user-select: none;
  407. -ms-user-select: none;
  408. user-select: none;
  409. background: #f0f2f6 no-repeat center/cover;
  410. border-radius: 4px;
  411. border:0px;
  412. }
  413. .waterfall-flow .avatar svg {
  414. width: calc(var(--tblr-avatar-size)/ 1.6666667);
  415. height: calc(var(--tblr-avatar-size)/ 1.6666667)
  416. }
  417. .waterfall-flow .avatar .badge {
  418. position: absolute;
  419. right: 0;
  420. bottom: 0;
  421. border-radius: 100rem;
  422. box-shadow: 0 0 0 2px #fff
  423. }
  424. .waterfall-flow a.avatar {
  425. cursor: pointer
  426. }
  427. .waterfall-flow .avatar-rounded {
  428. border-radius: 100rem
  429. }
  430. .waterfall-flow .avatar-xs {
  431. --tblr-avatar-size: 1.25rem
  432. }
  433. .waterfall-flow .avatar-xs .badge:empty {
  434. width: .3125rem;
  435. height: .3125rem
  436. }
  437. .waterfall-flow .avatar-sm {
  438. --tblr-avatar-size: 2rem
  439. }
  440. .avatar-sm .badge:empty {
  441. width: .5rem;
  442. height: .5rem
  443. }
  444. .avatar-md {
  445. --tblr-avatar-size: 3.75rem
  446. }
  447. .avatar-md .badge:empty {
  448. width: .9375rem;
  449. height: .9375rem
  450. }
  451. .avatar-lg {
  452. --tblr-avatar-size: 5rem
  453. }
  454. .avatar-lg .badge:empty {
  455. width: 1.25rem;
  456. height: 1.25rem
  457. }
  458. .avatar-xl {
  459. --tblr-avatar-size: 7rem
  460. }
  461. .avatar-xl .badge:empty {
  462. width: 1.75rem;
  463. height: 1.75rem
  464. }
  465. .avatar-2xl {
  466. --tblr-avatar-size: 11rem
  467. }
  468. .avatar-2xl .badge:empty {
  469. width: 2.75rem;
  470. height: 2.75rem
  471. }
  472. .avatar-list {
  473. display: inline-flex;
  474. padding: 0;
  475. margin: 0 0 -.5rem;
  476. flex-wrap: wrap
  477. }
  478. .avatar-list .avatar {
  479. margin-bottom: .5rem
  480. }
  481. .avatar-list .avatar:not(:last-child) {
  482. margin-right: .5rem
  483. }
  484. .avatar-list a.avatar:hover {
  485. z-index: 1
  486. }
  487. .avatar-list-stacked .avatar {
  488. margin-right: -.5rem!important;
  489. box-shadow: 0 0 0 2px #fff
  490. }
  491. .card-footer .avatar-list-stacked .avatar {
  492. box-shadow: 0 0 0 2px #fff
  493. }
  494. .avatar-upload {
  495. width: 4rem;
  496. height: 4rem;
  497. border: 1px dashed #e6e8e9;
  498. background: #fff;
  499. flex-direction: column;
  500. transition: .3s color,.3s background-color
  501. }
  502. .avatar-upload svg {
  503. width: 1.5rem;
  504. height: 1.5rem;
  505. stroke-width: 1
  506. }
  507. .avatar-upload:hover {
  508. border-color: #206bc4;
  509. color: #206bc4;
  510. text-decoration: none
  511. }
  512. .avatar-upload-text {
  513. font-size: .625rem;
  514. line-height: 1;
  515. margin-top: .25rem
  516. }
  517. .me-0 {
  518. margin-right: 0!important
  519. }
  520. .me-1 {
  521. margin-right: .25rem!important
  522. }
  523. .me-2 {
  524. margin-right: .5rem!important
  525. }
  526. .me-3 {
  527. margin-right: 1rem!important
  528. }
  529. .me-4 {
  530. margin-right: 2rem!important
  531. }
  532. .me-5 {
  533. margin-right: 4rem!important
  534. }
  535. .me-auto {
  536. margin-right: auto!important
  537. }
  538. .rounded {
  539. border-radius: 4px!important
  540. }
  541. .rounded-0 {
  542. border-radius: 0!important
  543. }
  544. .rounded-1 {
  545. border-radius: 2px!important
  546. }
  547. .rounded-2 {
  548. border-radius: 4px!important
  549. }
  550. .rounded-3 {
  551. border-radius: 8px!important
  552. }
  553. .rounded-circle {
  554. border-radius: 50%!important
  555. }
  556. .rounded-pill {
  557. border-radius: 100rem!important
  558. }
  559. /*updemoimg*/
  560. .indoor_pic_box .queueList,.indoor_pic_box .web-uploader{
  561. width: 100% !important;
  562. }
  563. .el-image img{
  564. width: 100%;
  565. height: 100%;
  566. }
  567. .upload-img-demo{
  568. margin-left: 20px;
  569. display: inline-block;
  570. }
  571. .form-upload-img-demo{
  572. width: 200px;
  573. height: 200px;
  574. border-radius: 4px;
  575. margin: 0 8px;
  576. position: relative;
  577. overflow: hidden;
  578. display: -webkit-box;
  579. display: -ms-flexbox;
  580. display: flex;
  581. -webkit-box-pack: center;
  582. -ms-flex-pack: center;
  583. justify-content: center;
  584. -webkit-box-align: center;
  585. -ms-flex-align: center;
  586. align-items: center;
  587. }
  588. .form-upload-img-demo-wrap{
  589. position: absolute;
  590. background-color: rgba(0,0,0,.5);
  591. top: 0;
  592. bottom: 0;
  593. left: 0;
  594. right: 0;
  595. color: #fff;
  596. text-align: center;
  597. line-height: 64px;
  598. cursor: pointer;
  599. pointer-events: none;
  600. font-size:16px;
  601. }
  602. .el-image {
  603. position: relative;
  604. display: inline-block;
  605. overflow: hidden;
  606. }
  607. .el-image__preview{
  608. cursor: pointer;
  609. }
  610. .el-image__inner{
  611. vertical-align: top;
  612. }
  613. /* end updemoimg*/
  614. /*setp form*/
  615. .sw-toolbar-bottom {
  616. margin-top: 20px;
  617. margin-left: 5px;
  618. }
  619. .dcat-step-box {
  620. margin: 0 auto;
  621. }
  622. .dcat-step {
  623. box-sizing: border-box;
  624. padding: 0;
  625. color: rgba(0, 0, 0, 0.65);
  626. /*font-variant: tabular-nums;*/
  627. line-height: 1.5;
  628. list-style: none;
  629. /*font-feature-settings: "tnum";*/
  630. display: flex;
  631. width: 100%;
  632. font-size: 0;
  633. margin: 0 auto 30px;
  634. }
  635. .dcat-step-item {
  636. position: relative;
  637. display: inline-block;
  638. flex: 1 1;
  639. overflow: hidden;
  640. vertical-align: top;
  641. }
  642. .dcat-step-item-container {
  643. outline: 0;
  644. border: 0 !important;
  645. }
  646. .dcat-step-item:last-child {
  647. flex: none;
  648. }
  649. .dcat-step-item:last-child > .dcat-step-item-container > .dcat-step-content > .dcat-step-title:after,
  650. .dcat-step-item:last-child > .dcat-step-item-container > .dcat-step-line {
  651. display: none;
  652. }
  653. .dcat-step-content,
  654. .dcat-step-icons {
  655. display: inline-block;
  656. vertical-align: top;
  657. }
  658. .dcat-step-icons {
  659. width: 32px;
  660. height: 32px;
  661. margin-right: 8px;
  662. font-size: 16px;
  663. line-height: 32px;
  664. text-align: center;
  665. border: 1px solid rgba(0, 0, 0, 0.25);
  666. border-radius: 32px;
  667. transition: background-color 0.3s, border-color 0.3s;
  668. }
  669. .dcat-step-icons > .dcat-step-icon {
  670. position: relative;
  671. top: -1px;
  672. color: rgba(0, 0, 0, 0.25);
  673. line-height: 1;
  674. }
  675. .dcat-step-line {
  676. position: absolute;
  677. top: 12px;
  678. left: 0;
  679. width: 100%;
  680. padding: 0 10px;
  681. }
  682. .dcat-step-line:after {
  683. display: inline-block;
  684. width: 100%;
  685. height: 1px;
  686. background: #e8e8e8;
  687. border-radius: 1px;
  688. transition: background 0.3s;
  689. content: "";
  690. }
  691. .dcat-step-title {
  692. position: relative;
  693. display: inline-block;
  694. padding-right: 16px;
  695. color: rgba(0, 0, 0, 0.65);
  696. font-size: 16px;
  697. line-height: 32px;
  698. }
  699. .dcat-step-title:after {
  700. position: absolute;
  701. top: 16px;
  702. left: 100%;
  703. display: block;
  704. width: 9999px;
  705. height: 1px;
  706. background: #e8e8e8;
  707. content: "";
  708. }
  709. .dcat-step-desc {
  710. color: rgba(0, 0, 0, 0.45);
  711. font-size: 14px;
  712. }
  713. .active .dcat-step-icons {
  714. background-color: #fff;
  715. }
  716. .active > .dcat-step-item-container > .dcat-step-content > .dcat-step-title {
  717. color: rgba(0, 0, 0, 0.85);
  718. }
  719. .active > .dcat-step-item-container > .dcat-step-content > .dcat-step-title:after {
  720. background-color: #e8e8e8;
  721. }
  722. .active > .dcat-step-item-container > .dcat-step-content > .dcat-step-desc {
  723. color: rgba(0, 0, 0, 0.65);
  724. }
  725. .active > .dcat-step-item-container > .dcat-step-line:after {
  726. background-color: #e8e8e8;
  727. }
  728. .active .dcat-step-icons > .dcat-step-icon {
  729. color: #fff;
  730. }
  731. .active .dcat-step-title {
  732. font-weight: 500;
  733. }
  734. .done .dcat-step-icons {
  735. background-color: #fff;
  736. }
  737. .done > .dcat-step-item-container > .dcat-step-content > .dcat-step-title {
  738. color: rgba(0, 0, 0, 0.65);
  739. }
  740. .done > .dcat-step-item-container > .dcat-step-content > .dcat-step-desc {
  741. color: rgba(0, 0, 0, 0.45);
  742. }
  743. .danger .dcat-step-icons {
  744. background-color: #fff;
  745. border-color: #bd4147;
  746. }
  747. .danger .dcat-step-icons > .dcat-step-icon {
  748. color: #bd4147;
  749. }
  750. .danger .dcat-step-icons > .dcat-step-icon .dcat-step-icon-dot {
  751. background: #bd4147;
  752. }
  753. .danger > .dcat-step-item-container > .dcat-step-content > .dcat-step-title {
  754. color: #bd4147;
  755. }
  756. .danger > .dcat-step-item-container > .dcat-step-content > .dcat-step-title:after {
  757. background-color: #e8e8e8;
  758. }
  759. .danger > .dcat-step-item-container > .dcat-step-content > .dcat-step-desc {
  760. color: #bd4147;
  761. }
  762. .danger > .dcat-step-item-container > .dcat-step-line:after {
  763. background-color: #e8e8e8;
  764. }
  765. .dcat-step-item.dcat-step-next-error .dcat-step-title:after {
  766. background: #bd4147;
  767. }
  768. .dcat-step .dcat-step-item:not(.active) > .dcat-step-item-container[role=button] {
  769. cursor: pointer;
  770. }
  771. .dcat-step .dcat-step-item:not(.active) > .dcat-step-item-container[role=button] .dcat-step-desc,
  772. .dcat-step .dcat-step-item:not(.active) > .dcat-step-item-container[role=button] .dcat-step-icons .dcat-step-icon,
  773. .dcat-step .dcat-step-item:not(.active) > .dcat-step-item-container[role=button] .dcat-step-title {
  774. transition: color 0.3s;
  775. }
  776. .dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-item {
  777. margin-right: 16px;
  778. white-space: nowrap;
  779. }
  780. .dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-item:last-child {
  781. margin-right: 0;
  782. }
  783. .dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-item:last-child .dcat-step-title {
  784. padding-right: 0;
  785. }
  786. .dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-line {
  787. display: none;
  788. }
  789. .dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-desc {
  790. max-width: 140px;
  791. white-space: normal;
  792. }
  793. .dcat-step-sm.dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-item {
  794. margin-right: 12px;
  795. }
  796. .dcat-step-sm.dcat-step-horizontal:not(.dcat-step-label-vertical) .dcat-step-item:last-child {
  797. margin-right: 0;
  798. }
  799. .dcat-step-sm .dcat-step-icons {
  800. width: 24px;
  801. height: 24px;
  802. font-size: 12px;
  803. line-height: 24px;
  804. text-align: center;
  805. border-radius: 24px;
  806. }
  807. .dcat-step-sm .dcat-step-title {
  808. padding-right: 12px;
  809. font-size: 14px;
  810. line-height: 24px;
  811. }
  812. .dcat-step-sm .dcat-step-title:after {
  813. top: 12px;
  814. }
  815. .dcat-step-sm .dcat-step-desc {
  816. color: rgba(0, 0, 0, 0.45);
  817. font-size: 14px;
  818. }
  819. .dcat-step-sm .dcat-step-line {
  820. top: 8px;
  821. }
  822. @media (max-width: 540px) {
  823. .dcat-step-horizontal.dcat-step-label-horizontal {
  824. display: block;
  825. }
  826. .dcat-step-box .nav-tabs > li {
  827. float: none;
  828. }
  829. .dcat-step-box .nav-tabs > li > a {
  830. padding: 0;
  831. }
  832. .dcat-step-horizontal.dcat-step-label-horizontal .dcat-step-item {
  833. display: block;
  834. overflow: visible;
  835. }
  836. .dcat-step-horizontal.dcat-step-label-horizontal .dcat-step-icons {
  837. float: left;
  838. margin-right: 16px;
  839. }
  840. .dcat-step-horizontal.dcat-step-label-horizontal .dcat-step-content {
  841. display: block;
  842. overflow: hidden;
  843. }
  844. .dcat-step-horizontal.dcat-step-label-horizontal .dcat-step-title {
  845. line-height: 32px;
  846. }
  847. .dcat-step-horizontal.dcat-step-label-horizontal .dcat-step-desc {
  848. padding-bottom: 12px;
  849. }
  850. .dcat-step-horizontal.dcat-step-label-horizontal > .dcat-step-item > .dcat-step-item-container > .dcat-step-line {
  851. position: absolute;
  852. top: 0;
  853. left: 16px;
  854. width: 1px;
  855. height: 100%;
  856. padding: 38px 0 6px;
  857. }
  858. .dcat-step-horizontal.dcat-step-label-horizontal > .dcat-step-item > .dcat-step-item-container > .dcat-step-line:after {
  859. width: 1px;
  860. height: 100%;
  861. }
  862. .dcat-step-horizontal.dcat-step-label-horizontal > .dcat-step-item:not(:last-child) > .dcat-step-item-container > .dcat-step-line {
  863. display: none;
  864. }
  865. .dcat-step-horizontal.dcat-step-label-horizontal > .dcat-step-item > .dcat-step-item-container > .dcat-step-content > .dcat-step-title:after {
  866. display: none;
  867. }
  868. .dcat-step-horizontal.dcat-step-label-horizontal.dcat-step-sm .dcat-step-item-container .dcat-step-title {
  869. line-height: 24px;
  870. }
  871. }
  872. .dcat-step-label-vertical .dcat-step-item {
  873. overflow: visible;
  874. }
  875. .dcat-step-label-vertical .dcat-step-line {
  876. margin-left: 51px;
  877. padding: 3.5px 24px;
  878. left: 18px;
  879. top: 23px;
  880. }
  881. .dcat-step-label-vertical .dcat-step-content {
  882. display: block;
  883. width: 104px;
  884. margin-top: 8px;
  885. text-align: center;
  886. }
  887. .dcat-step-label-vertical .dcat-step-icons {
  888. display: inline-block;
  889. margin-left: 36px;
  890. }
  891. .dcat-step-label-vertical .dcat-step-title {
  892. padding-right: 0;
  893. }
  894. .dcat-step-label-vertical .dcat-step-title:after {
  895. display: none;
  896. }
  897. .dcat-step-label-vertical.dcat-step-sm:not(.dcat-step-dot) .dcat-step-icons {
  898. margin-left: 40px;
  899. }
  900. .dcat-step-dot .dcat-step-title,
  901. .dcat-step-dot.dcat-step-sm .dcat-step-title {
  902. line-height: 1.5;
  903. }
  904. .dcat-step-dot .dcat-step-line,
  905. .dcat-step-dot.dcat-step-sm .dcat-step-line {
  906. top: 2px;
  907. width: 100%;
  908. margin: 0 0 0 70px;
  909. padding: 0;
  910. }
  911. .dcat-step-dot .dcat-step-line:after,
  912. .dcat-step-dot.dcat-step-sm .dcat-step-line:after {
  913. width: calc(100% - 20px);
  914. height: 3px;
  915. margin-left: 12px;
  916. }
  917. .dcat-step-dot .dcat-step-item:first-child .dcat-step-icon-dot,
  918. .dcat-step-dot.dcat-step-sm .dcat-step-item:first-child .dcat-step-icon-dot {
  919. left: 2px;
  920. }
  921. .dcat-step-dot .dcat-step-icons,
  922. .dcat-step-dot.dcat-step-sm .dcat-step-icons {
  923. width: 8px;
  924. height: 8px;
  925. margin-left: 67px;
  926. padding-right: 0;
  927. line-height: 8px;
  928. background: 0 0;
  929. border: 0;
  930. }
  931. .dcat-step-dot .dcat-step-icons .dcat-step-icon-dot,
  932. .dcat-step-dot.dcat-step-sm .dcat-step-icons .dcat-step-icon-dot {
  933. position: relative;
  934. float: left;
  935. width: 100%;
  936. height: 100%;
  937. border-radius: 100px;
  938. transition: all 0.3s;
  939. }
  940. .dcat-step-dot .dcat-step-icons .dcat-step-icon-dot:after,
  941. .dcat-step-dot.dcat-step-sm .dcat-step-icons .dcat-step-icon-dot:after {
  942. position: absolute;
  943. top: -12px;
  944. left: -26px;
  945. width: 60px;
  946. height: 32px;
  947. background: rgba(0, 0, 0, 0.001);
  948. content: "";
  949. }
  950. .dcat-step-dot .dcat-step-content,
  951. .dcat-step-dot.dcat-step-sm .dcat-step-content {
  952. width: 140px;
  953. }
  954. .dcat-step-dot .active .dcat-step-icons,
  955. .dcat-step-dot.dcat-step-sm .active .dcat-step-icons {
  956. width: 10px;
  957. height: 10px;
  958. line-height: 10px;
  959. }
  960. .dcat-step-dot .active .dcat-step-icons .dcat-step-icon-dot,
  961. .dcat-step-dot.dcat-step-sm .active .dcat-step-icons .dcat-step-icon-dot {
  962. top: -1px;
  963. }
  964. .dcat-step-item a {
  965. font-weight: normal !important;
  966. }
  967. /* end setp form*/
  968. .nav-item .nav-link {
  969. display: flex;
  970. align-items: center;
  971. }
  972. .nav-item .nav-link .badge, .label{
  973. margin-left: .5rem;margin-bottom: 0px;
  974. }
  975. .main-menu .navbar-header .navbar-brand img {
  976. display: inline-block;
  977. /*max-width: 45px;*/
  978. max-width: 160px;
  979. max-height: 80px;
  980. margin-top: -1px
  981. }
  982. .box-body img {
  983. max-width: 100%;
  984. }
  985. .web-uploader .filelist li .imgWrap {
  986. display: flex; /* 使用Flexbox布局 */
  987. justify-content: center; /* 水平居中 */
  988. align-items: center; /* 垂直居中 */
  989. }