index.css 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769
  1. /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
  2. /* stylelint-disable no-duplicate-selectors */
  3. .ant-steps {
  4. box-sizing: border-box;
  5. margin: 0;
  6. padding: 0;
  7. color: rgba(0, 0, 0, 0.85);
  8. font-size: 14px;
  9. font-variant: tabular-nums;
  10. line-height: 1.5715;
  11. list-style: none;
  12. font-feature-settings: 'tnum';
  13. display: flex;
  14. width: 100%;
  15. font-size: 0;
  16. text-align: initial;
  17. }
  18. .ant-steps-item {
  19. position: relative;
  20. display: inline-block;
  21. flex: 1;
  22. overflow: hidden;
  23. vertical-align: top;
  24. }
  25. .ant-steps-item-container {
  26. outline: none;
  27. }
  28. .ant-steps-item:last-child {
  29. flex: none;
  30. }
  31. .ant-steps-item:last-child > .ant-steps-item-container > .ant-steps-item-tail,
  32. .ant-steps-item:last-child > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  33. display: none;
  34. }
  35. .ant-steps-item-icon,
  36. .ant-steps-item-content {
  37. display: inline-block;
  38. vertical-align: top;
  39. }
  40. .ant-steps-item-icon {
  41. width: 32px;
  42. height: 32px;
  43. margin: 0 8px 0 0;
  44. font-size: 16px;
  45. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  46. line-height: 32px;
  47. text-align: center;
  48. border: 1px solid rgba(0, 0, 0, 0.25);
  49. border-radius: 32px;
  50. transition: background-color 0.3s, border-color 0.3s;
  51. }
  52. .ant-steps-item-icon .ant-steps-icon {
  53. position: relative;
  54. top: -0.5px;
  55. color: #1890ff;
  56. line-height: 1;
  57. }
  58. .ant-steps-item-tail {
  59. position: absolute;
  60. top: 12px;
  61. left: 0;
  62. width: 100%;
  63. padding: 0 10px;
  64. }
  65. .ant-steps-item-tail::after {
  66. display: inline-block;
  67. width: 100%;
  68. height: 1px;
  69. background: #f0f0f0;
  70. border-radius: 1px;
  71. transition: background 0.3s;
  72. content: '';
  73. }
  74. .ant-steps-item-title {
  75. position: relative;
  76. display: inline-block;
  77. padding-right: 16px;
  78. color: rgba(0, 0, 0, 0.85);
  79. font-size: 16px;
  80. line-height: 32px;
  81. }
  82. .ant-steps-item-title::after {
  83. position: absolute;
  84. top: 16px;
  85. left: 100%;
  86. display: block;
  87. width: 9999px;
  88. height: 1px;
  89. background: #f0f0f0;
  90. content: '';
  91. }
  92. .ant-steps-item-subtitle {
  93. display: inline;
  94. margin-left: 8px;
  95. color: rgba(0, 0, 0, 0.45);
  96. font-weight: normal;
  97. font-size: 14px;
  98. }
  99. .ant-steps-item-description {
  100. color: rgba(0, 0, 0, 0.45);
  101. font-size: 14px;
  102. }
  103. .ant-steps-item-wait .ant-steps-item-icon {
  104. background-color: #fff;
  105. border-color: rgba(0, 0, 0, 0.25);
  106. }
  107. .ant-steps-item-wait .ant-steps-item-icon > .ant-steps-icon {
  108. color: rgba(0, 0, 0, 0.25);
  109. }
  110. .ant-steps-item-wait .ant-steps-item-icon > .ant-steps-icon .ant-steps-icon-dot {
  111. background: rgba(0, 0, 0, 0.25);
  112. }
  113. .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
  114. color: rgba(0, 0, 0, 0.45);
  115. }
  116. .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  117. background-color: #f0f0f0;
  118. }
  119. .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-description {
  120. color: rgba(0, 0, 0, 0.45);
  121. }
  122. .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-tail::after {
  123. background-color: #f0f0f0;
  124. }
  125. .ant-steps-item-process .ant-steps-item-icon {
  126. background-color: #fff;
  127. border-color: #1890ff;
  128. }
  129. .ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon {
  130. color: #1890ff;
  131. }
  132. .ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon .ant-steps-icon-dot {
  133. background: #1890ff;
  134. }
  135. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
  136. color: rgba(0, 0, 0, 0.85);
  137. }
  138. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  139. background-color: #f0f0f0;
  140. }
  141. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-description {
  142. color: rgba(0, 0, 0, 0.85);
  143. }
  144. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-tail::after {
  145. background-color: #f0f0f0;
  146. }
  147. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-icon {
  148. background: #1890ff;
  149. }
  150. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-icon .ant-steps-icon {
  151. color: #fff;
  152. }
  153. .ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-title {
  154. font-weight: 500;
  155. }
  156. .ant-steps-item-finish .ant-steps-item-icon {
  157. background-color: #fff;
  158. border-color: #1890ff;
  159. }
  160. .ant-steps-item-finish .ant-steps-item-icon > .ant-steps-icon {
  161. color: #1890ff;
  162. }
  163. .ant-steps-item-finish .ant-steps-item-icon > .ant-steps-icon .ant-steps-icon-dot {
  164. background: #1890ff;
  165. }
  166. .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
  167. color: rgba(0, 0, 0, 0.85);
  168. }
  169. .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  170. background-color: #1890ff;
  171. }
  172. .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-description {
  173. color: rgba(0, 0, 0, 0.45);
  174. }
  175. .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-tail::after {
  176. background-color: #1890ff;
  177. }
  178. .ant-steps-item-error .ant-steps-item-icon {
  179. background-color: #fff;
  180. border-color: #ff4d4f;
  181. }
  182. .ant-steps-item-error .ant-steps-item-icon > .ant-steps-icon {
  183. color: #ff4d4f;
  184. }
  185. .ant-steps-item-error .ant-steps-item-icon > .ant-steps-icon .ant-steps-icon-dot {
  186. background: #ff4d4f;
  187. }
  188. .ant-steps-item-error > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
  189. color: #ff4d4f;
  190. }
  191. .ant-steps-item-error > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  192. background-color: #f0f0f0;
  193. }
  194. .ant-steps-item-error > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-description {
  195. color: #ff4d4f;
  196. }
  197. .ant-steps-item-error > .ant-steps-item-container > .ant-steps-item-tail::after {
  198. background-color: #f0f0f0;
  199. }
  200. .ant-steps-item.ant-steps-next-error .ant-steps-item-title::after {
  201. background: #ff4d4f;
  202. }
  203. .ant-steps-item-disabled {
  204. cursor: not-allowed;
  205. }
  206. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button'] {
  207. cursor: pointer;
  208. }
  209. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button'] .ant-steps-item-title,
  210. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button'] .ant-steps-item-subtitle,
  211. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button'] .ant-steps-item-description,
  212. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button'] .ant-steps-item-icon .ant-steps-icon {
  213. transition: color 0.3s;
  214. }
  215. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button']:hover .ant-steps-item-title,
  216. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button']:hover .ant-steps-item-subtitle,
  217. .ant-steps .ant-steps-item:not(.ant-steps-item-active) > .ant-steps-item-container[role='button']:hover .ant-steps-item-description {
  218. color: #1890ff;
  219. }
  220. .ant-steps .ant-steps-item:not(.ant-steps-item-active):not(.ant-steps-item-process) > .ant-steps-item-container[role='button']:hover .ant-steps-item-icon {
  221. border-color: #1890ff;
  222. }
  223. .ant-steps .ant-steps-item:not(.ant-steps-item-active):not(.ant-steps-item-process) > .ant-steps-item-container[role='button']:hover .ant-steps-item-icon .ant-steps-icon {
  224. color: #1890ff;
  225. }
  226. .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
  227. padding-left: 16px;
  228. white-space: nowrap;
  229. }
  230. .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:first-child {
  231. padding-left: 0;
  232. }
  233. .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:last-child .ant-steps-item-title {
  234. padding-right: 0;
  235. }
  236. .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item-tail {
  237. display: none;
  238. }
  239. .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item-description {
  240. max-width: 140px;
  241. white-space: normal;
  242. }
  243. .ant-steps-item-custom > .ant-steps-item-container > .ant-steps-item-icon {
  244. height: auto;
  245. background: none;
  246. border: 0;
  247. }
  248. .ant-steps-item-custom > .ant-steps-item-container > .ant-steps-item-icon > .ant-steps-icon {
  249. top: 0px;
  250. left: 0.5px;
  251. width: 32px;
  252. height: 32px;
  253. font-size: 24px;
  254. line-height: 32px;
  255. }
  256. .ant-steps-item-custom.ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon {
  257. color: #1890ff;
  258. }
  259. .ant-steps:not(.ant-steps-vertical) .ant-steps-item-custom .ant-steps-item-icon {
  260. width: auto;
  261. background: none;
  262. }
  263. .ant-steps-small.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
  264. padding-left: 12px;
  265. }
  266. .ant-steps-small.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:first-child {
  267. padding-left: 0;
  268. }
  269. .ant-steps-small .ant-steps-item-icon {
  270. width: 24px;
  271. height: 24px;
  272. margin: 0 8px 0 0;
  273. font-size: 12px;
  274. line-height: 24px;
  275. text-align: center;
  276. border-radius: 24px;
  277. }
  278. .ant-steps-small .ant-steps-item-title {
  279. padding-right: 12px;
  280. font-size: 14px;
  281. line-height: 24px;
  282. }
  283. .ant-steps-small .ant-steps-item-title::after {
  284. top: 12px;
  285. }
  286. .ant-steps-small .ant-steps-item-description {
  287. color: rgba(0, 0, 0, 0.45);
  288. font-size: 14px;
  289. }
  290. .ant-steps-small .ant-steps-item-tail {
  291. top: 8px;
  292. }
  293. .ant-steps-small .ant-steps-item-custom .ant-steps-item-icon {
  294. width: inherit;
  295. height: inherit;
  296. line-height: inherit;
  297. background: none;
  298. border: 0;
  299. border-radius: 0;
  300. }
  301. .ant-steps-small .ant-steps-item-custom .ant-steps-item-icon > .ant-steps-icon {
  302. font-size: 24px;
  303. line-height: 24px;
  304. transform: none;
  305. }
  306. .ant-steps-vertical {
  307. display: flex;
  308. flex-direction: column;
  309. }
  310. .ant-steps-vertical > .ant-steps-item {
  311. display: block;
  312. flex: 1 0 auto;
  313. padding-left: 0;
  314. overflow: visible;
  315. }
  316. .ant-steps-vertical > .ant-steps-item .ant-steps-item-icon {
  317. float: left;
  318. margin-right: 16px;
  319. }
  320. .ant-steps-vertical > .ant-steps-item .ant-steps-item-content {
  321. display: block;
  322. min-height: 48px;
  323. overflow: hidden;
  324. }
  325. .ant-steps-vertical > .ant-steps-item .ant-steps-item-title {
  326. line-height: 32px;
  327. }
  328. .ant-steps-vertical > .ant-steps-item .ant-steps-item-description {
  329. padding-bottom: 12px;
  330. }
  331. .ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  332. position: absolute;
  333. top: 0;
  334. left: 15px;
  335. width: 1px;
  336. height: 100%;
  337. padding: 38px 0 6px;
  338. }
  339. .ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail::after {
  340. width: 1px;
  341. height: 100%;
  342. }
  343. .ant-steps-vertical > .ant-steps-item:not(:last-child) > .ant-steps-item-container > .ant-steps-item-tail {
  344. display: block;
  345. }
  346. .ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after {
  347. display: none;
  348. }
  349. .ant-steps-vertical.ant-steps-small .ant-steps-item-container .ant-steps-item-tail {
  350. position: absolute;
  351. top: 0;
  352. left: 11px;
  353. padding: 30px 0 6px;
  354. }
  355. .ant-steps-vertical.ant-steps-small .ant-steps-item-container .ant-steps-item-title {
  356. line-height: 24px;
  357. }
  358. .ant-steps-label-vertical .ant-steps-item {
  359. overflow: visible;
  360. }
  361. .ant-steps-label-vertical .ant-steps-item-tail {
  362. margin-left: 58px;
  363. padding: 3.5px 24px;
  364. }
  365. .ant-steps-label-vertical .ant-steps-item-content {
  366. display: block;
  367. width: 116px;
  368. margin-top: 8px;
  369. text-align: center;
  370. }
  371. .ant-steps-label-vertical .ant-steps-item-icon {
  372. display: inline-block;
  373. margin-left: 42px;
  374. }
  375. .ant-steps-label-vertical .ant-steps-item-title {
  376. padding-right: 0;
  377. padding-left: 0;
  378. }
  379. .ant-steps-label-vertical .ant-steps-item-title::after {
  380. display: none;
  381. }
  382. .ant-steps-label-vertical .ant-steps-item-subtitle {
  383. display: block;
  384. margin-bottom: 4px;
  385. margin-left: 0;
  386. line-height: 1.5715;
  387. }
  388. .ant-steps-label-vertical.ant-steps-small:not(.ant-steps-dot) .ant-steps-item-icon {
  389. margin-left: 46px;
  390. }
  391. .ant-steps-dot .ant-steps-item-title,
  392. .ant-steps-dot.ant-steps-small .ant-steps-item-title {
  393. line-height: 1.5715;
  394. }
  395. .ant-steps-dot .ant-steps-item-tail,
  396. .ant-steps-dot.ant-steps-small .ant-steps-item-tail {
  397. top: 2px;
  398. width: 100%;
  399. margin: 0 0 0 70px;
  400. padding: 0;
  401. }
  402. .ant-steps-dot .ant-steps-item-tail::after,
  403. .ant-steps-dot.ant-steps-small .ant-steps-item-tail::after {
  404. width: calc(100% - 20px);
  405. height: 3px;
  406. margin-left: 12px;
  407. }
  408. .ant-steps-dot .ant-steps-item:first-child .ant-steps-icon-dot,
  409. .ant-steps-dot.ant-steps-small .ant-steps-item:first-child .ant-steps-icon-dot {
  410. left: 2px;
  411. }
  412. .ant-steps-dot .ant-steps-item-icon,
  413. .ant-steps-dot.ant-steps-small .ant-steps-item-icon {
  414. width: 8px;
  415. height: 8px;
  416. margin-left: 67px;
  417. padding-right: 0;
  418. line-height: 8px;
  419. background: transparent;
  420. border: 0;
  421. }
  422. .ant-steps-dot .ant-steps-item-icon .ant-steps-icon-dot,
  423. .ant-steps-dot.ant-steps-small .ant-steps-item-icon .ant-steps-icon-dot {
  424. position: relative;
  425. float: left;
  426. width: 100%;
  427. height: 100%;
  428. border-radius: 100px;
  429. transition: all 0.3s;
  430. /* expand hover area */
  431. }
  432. .ant-steps-dot .ant-steps-item-icon .ant-steps-icon-dot::after,
  433. .ant-steps-dot.ant-steps-small .ant-steps-item-icon .ant-steps-icon-dot::after {
  434. position: absolute;
  435. top: -12px;
  436. left: -26px;
  437. width: 60px;
  438. height: 32px;
  439. background: rgba(0, 0, 0, 0.001);
  440. content: '';
  441. }
  442. .ant-steps-dot .ant-steps-item-content,
  443. .ant-steps-dot.ant-steps-small .ant-steps-item-content {
  444. width: 140px;
  445. }
  446. .ant-steps-dot .ant-steps-item-process .ant-steps-item-icon,
  447. .ant-steps-dot.ant-steps-small .ant-steps-item-process .ant-steps-item-icon {
  448. position: relative;
  449. top: -1px;
  450. width: 10px;
  451. height: 10px;
  452. line-height: 10px;
  453. background: none;
  454. }
  455. .ant-steps-dot .ant-steps-item-process .ant-steps-icon:first-child .ant-steps-icon-dot,
  456. .ant-steps-dot.ant-steps-small .ant-steps-item-process .ant-steps-icon:first-child .ant-steps-icon-dot {
  457. left: 0;
  458. }
  459. .ant-steps-vertical.ant-steps-dot .ant-steps-item-icon {
  460. margin-top: 13px;
  461. margin-left: 0;
  462. background: none;
  463. }
  464. .ant-steps-vertical.ant-steps-dot .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  465. top: 6.5px;
  466. left: -9px;
  467. margin: 0;
  468. padding: 22px 0 4px;
  469. }
  470. .ant-steps-vertical.ant-steps-dot.ant-steps-small .ant-steps-item-icon {
  471. margin-top: 10px;
  472. }
  473. .ant-steps-vertical.ant-steps-dot.ant-steps-small .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  474. top: 3.5px;
  475. }
  476. .ant-steps-vertical.ant-steps-dot .ant-steps-item:first-child .ant-steps-icon-dot {
  477. left: 0;
  478. }
  479. .ant-steps-vertical.ant-steps-dot .ant-steps-item-content {
  480. width: inherit;
  481. }
  482. .ant-steps-vertical.ant-steps-dot .ant-steps-item-process .ant-steps-item-container .ant-steps-item-icon .ant-steps-icon-dot {
  483. top: -1px;
  484. left: -1px;
  485. }
  486. .ant-steps-navigation {
  487. padding-top: 12px;
  488. }
  489. .ant-steps-navigation.ant-steps-small .ant-steps-item-container {
  490. margin-left: -12px;
  491. }
  492. .ant-steps-navigation .ant-steps-item {
  493. overflow: visible;
  494. text-align: center;
  495. }
  496. .ant-steps-navigation .ant-steps-item-container {
  497. display: inline-block;
  498. height: 100%;
  499. margin-left: -16px;
  500. padding-bottom: 12px;
  501. text-align: left;
  502. transition: opacity 0.3s;
  503. }
  504. .ant-steps-navigation .ant-steps-item-container .ant-steps-item-content {
  505. max-width: auto;
  506. }
  507. .ant-steps-navigation .ant-steps-item-container .ant-steps-item-title {
  508. max-width: 100%;
  509. padding-right: 0;
  510. overflow: hidden;
  511. white-space: nowrap;
  512. text-overflow: ellipsis;
  513. }
  514. .ant-steps-navigation .ant-steps-item-container .ant-steps-item-title::after {
  515. display: none;
  516. }
  517. .ant-steps-navigation .ant-steps-item:not(.ant-steps-item-active) .ant-steps-item-container[role='button'] {
  518. cursor: pointer;
  519. }
  520. .ant-steps-navigation .ant-steps-item:not(.ant-steps-item-active) .ant-steps-item-container[role='button']:hover {
  521. opacity: 0.85;
  522. }
  523. .ant-steps-navigation .ant-steps-item:last-child {
  524. flex: 1;
  525. }
  526. .ant-steps-navigation .ant-steps-item:last-child::after {
  527. display: none;
  528. }
  529. .ant-steps-navigation .ant-steps-item::after {
  530. position: absolute;
  531. top: 50%;
  532. left: 100%;
  533. display: inline-block;
  534. width: 12px;
  535. height: 12px;
  536. margin-top: -14px;
  537. margin-left: -2px;
  538. border: 1px solid rgba(0, 0, 0, 0.25);
  539. border-bottom: none;
  540. border-left: none;
  541. transform: rotate(45deg);
  542. content: '';
  543. }
  544. .ant-steps-navigation .ant-steps-item::before {
  545. position: absolute;
  546. bottom: 0;
  547. left: 50%;
  548. display: inline-block;
  549. width: 0;
  550. height: 2px;
  551. background-color: #1890ff;
  552. transition: width 0.3s, left 0.3s;
  553. transition-timing-function: ease-out;
  554. content: '';
  555. }
  556. .ant-steps-navigation .ant-steps-item.ant-steps-item-active::before {
  557. left: 0;
  558. width: 100%;
  559. }
  560. .ant-steps-navigation.ant-steps-vertical > .ant-steps-item {
  561. margin-right: 0 !important;
  562. }
  563. .ant-steps-navigation.ant-steps-vertical > .ant-steps-item::before {
  564. display: none;
  565. }
  566. .ant-steps-navigation.ant-steps-vertical > .ant-steps-item.ant-steps-item-active::before {
  567. top: 0;
  568. right: 0;
  569. left: unset;
  570. display: block;
  571. width: 3px;
  572. height: calc(100% - 24px);
  573. }
  574. .ant-steps-navigation.ant-steps-vertical > .ant-steps-item::after {
  575. position: relative;
  576. top: -2px;
  577. left: 50%;
  578. display: block;
  579. width: 8px;
  580. height: 8px;
  581. margin-bottom: 8px;
  582. text-align: center;
  583. transform: rotate(135deg);
  584. }
  585. .ant-steps-navigation.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  586. visibility: hidden;
  587. }
  588. .ant-steps-navigation.ant-steps-horizontal > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  589. visibility: hidden;
  590. }
  591. .ant-steps-rtl {
  592. direction: rtl;
  593. }
  594. .ant-steps.ant-steps-rtl .ant-steps-item-icon {
  595. margin-right: 0;
  596. margin-left: 8px;
  597. }
  598. .ant-steps-rtl .ant-steps-item-tail {
  599. right: 0;
  600. left: auto;
  601. }
  602. .ant-steps-rtl .ant-steps-item-title {
  603. padding-right: 0;
  604. padding-left: 16px;
  605. }
  606. .ant-steps-rtl .ant-steps-item-title .ant-steps-item-subtitle {
  607. float: left;
  608. margin-right: 8px;
  609. margin-left: 0;
  610. }
  611. .ant-steps-rtl .ant-steps-item-title::after {
  612. right: 100%;
  613. left: auto;
  614. }
  615. .ant-steps-rtl.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
  616. padding-right: 16px;
  617. padding-left: 0;
  618. }
  619. .ant-steps-rtl.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:first-child {
  620. padding-right: 0;
  621. }
  622. .ant-steps-rtl.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:last-child .ant-steps-item-title {
  623. padding-left: 0;
  624. }
  625. .ant-steps-rtl .ant-steps-item-custom .ant-steps-item-icon > .ant-steps-icon {
  626. right: 0.5px;
  627. left: auto;
  628. }
  629. .ant-steps-rtl.ant-steps-navigation.ant-steps-small .ant-steps-item-container {
  630. margin-right: -12px;
  631. margin-left: 0;
  632. }
  633. .ant-steps-rtl.ant-steps-navigation .ant-steps-item-container {
  634. margin-right: -16px;
  635. margin-left: 0;
  636. text-align: right;
  637. }
  638. .ant-steps-rtl.ant-steps-navigation .ant-steps-item-container .ant-steps-item-title {
  639. padding-left: 0;
  640. }
  641. .ant-steps-rtl.ant-steps-navigation .ant-steps-item::after {
  642. right: 100%;
  643. left: auto;
  644. margin-right: -2px;
  645. margin-left: 0;
  646. transform: rotate(225deg);
  647. }
  648. .ant-steps-rtl.ant-steps-small.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
  649. padding-right: 12px;
  650. padding-left: 0;
  651. }
  652. .ant-steps-rtl.ant-steps-small.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item:first-child {
  653. padding-right: 0;
  654. }
  655. .ant-steps-rtl.ant-steps-small .ant-steps-item-title {
  656. padding-right: 0;
  657. padding-left: 12px;
  658. }
  659. .ant-steps-rtl.ant-steps-vertical > .ant-steps-item .ant-steps-item-icon {
  660. float: right;
  661. margin-right: 0;
  662. margin-left: 16px;
  663. }
  664. .ant-steps-rtl.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  665. right: 16px;
  666. left: auto;
  667. }
  668. .ant-steps-rtl.ant-steps-vertical.ant-steps-small .ant-steps-item-container .ant-steps-item-tail {
  669. right: 12px;
  670. left: auto;
  671. }
  672. .ant-steps-rtl.ant-steps-label-vertical .ant-steps-item-title {
  673. padding-left: 0;
  674. }
  675. .ant-steps-rtl.ant-steps-dot .ant-steps-item-tail,
  676. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item-tail {
  677. margin: 0 70px 0 0;
  678. }
  679. .ant-steps-rtl.ant-steps-dot .ant-steps-item-tail::after,
  680. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item-tail::after {
  681. margin-right: 12px;
  682. margin-left: 0;
  683. }
  684. .ant-steps-rtl.ant-steps-dot .ant-steps-item:first-child .ant-steps-icon-dot,
  685. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item:first-child .ant-steps-icon-dot {
  686. right: 2px;
  687. left: auto;
  688. }
  689. .ant-steps-rtl.ant-steps-dot .ant-steps-item-icon,
  690. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item-icon {
  691. margin-right: 67px;
  692. margin-left: 0;
  693. }
  694. .ant-steps-dot .ant-steps-item-icon .ant-steps-icon-dot,
  695. .ant-steps-dot.ant-steps-small .ant-steps-item-icon .ant-steps-icon-dot {
  696. /* expand hover area */
  697. }
  698. .ant-steps-rtl.ant-steps-dot .ant-steps-item-icon .ant-steps-icon-dot,
  699. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item-icon .ant-steps-icon-dot {
  700. float: right;
  701. }
  702. .ant-steps-rtl.ant-steps-dot .ant-steps-item-icon .ant-steps-icon-dot::after,
  703. .ant-steps-rtl.ant-steps-dot.ant-steps-small .ant-steps-item-icon .ant-steps-icon-dot::after {
  704. right: -26px;
  705. left: auto;
  706. }
  707. .ant-steps-rtl.ant-steps-vertical.ant-steps-dot .ant-steps-item-icon {
  708. margin-right: 0;
  709. margin-left: 16px;
  710. }
  711. .ant-steps-rtl.ant-steps-vertical.ant-steps-dot .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  712. right: -9px;
  713. left: auto;
  714. }
  715. .ant-steps-rtl.ant-steps-vertical.ant-steps-dot .ant-steps-item:first-child .ant-steps-icon-dot {
  716. right: 0;
  717. left: auto;
  718. }
  719. .ant-steps-rtl.ant-steps-vertical.ant-steps-dot .ant-steps-item-process .ant-steps-icon-dot {
  720. right: -2px;
  721. left: auto;
  722. }
  723. .ant-steps-rtl.ant-steps-with-progress.ant-steps-vertical > .ant-steps-item {
  724. padding-right: 4px;
  725. }
  726. .ant-steps-rtl.ant-steps-with-progress.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  727. right: 19px;
  728. }
  729. .ant-steps-rtl.ant-steps-with-progress.ant-steps-small.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  730. right: 15px;
  731. }
  732. .ant-steps-rtl.ant-steps-with-progress.ant-steps-horizontal.ant-steps-label-horizontal .ant-steps-item:first-child {
  733. padding-right: 4px;
  734. padding-left: 0;
  735. }
  736. .ant-steps-rtl.ant-steps-with-progress.ant-steps-horizontal.ant-steps-label-horizontal .ant-steps-item:first-child.ant-steps-item-active {
  737. padding-right: 4px;
  738. }
  739. .ant-steps-with-progress .ant-steps-item {
  740. padding-top: 4px;
  741. }
  742. .ant-steps-with-progress .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  743. top: 4px;
  744. left: 19px;
  745. }
  746. .ant-steps-with-progress.ant-steps-horizontal .ant-steps-item:first-child,
  747. .ant-steps-with-progress.ant-steps-small.ant-steps-horizontal .ant-steps-item:first-child {
  748. padding-bottom: 4px;
  749. padding-left: 4px;
  750. }
  751. .ant-steps-with-progress.ant-steps-small > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail {
  752. left: 15px;
  753. }
  754. .ant-steps-with-progress.ant-steps-vertical .ant-steps-item {
  755. padding-left: 4px;
  756. }
  757. .ant-steps-with-progress.ant-steps-label-vertical .ant-steps-item .ant-steps-item-tail {
  758. top: 14px !important;
  759. }
  760. .ant-steps-with-progress .ant-steps-item-icon {
  761. position: relative;
  762. }
  763. .ant-steps-with-progress .ant-steps-item-icon .ant-progress {
  764. position: absolute;
  765. top: -5px;
  766. right: -5px;
  767. bottom: -5px;
  768. left: -5px;
  769. }