index.css 9.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435
  1. /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
  2. /* stylelint-disable no-duplicate-selectors */
  3. /* stylelint-disable */
  4. /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
  5. .ant-badge {
  6. box-sizing: border-box;
  7. margin: 0;
  8. padding: 0;
  9. color: rgba(0, 0, 0, 0.85);
  10. font-size: 14px;
  11. font-variant: tabular-nums;
  12. line-height: 1.5715;
  13. list-style: none;
  14. font-feature-settings: 'tnum';
  15. position: relative;
  16. display: inline-block;
  17. line-height: 1;
  18. }
  19. .ant-badge-count {
  20. z-index: auto;
  21. min-width: 20px;
  22. height: 20px;
  23. padding: 0 6px;
  24. color: #fff;
  25. font-weight: normal;
  26. font-size: 12px;
  27. line-height: 20px;
  28. white-space: nowrap;
  29. text-align: center;
  30. background: #ff4d4f;
  31. border-radius: 10px;
  32. box-shadow: 0 0 0 1px #fff;
  33. }
  34. .ant-badge-count a,
  35. .ant-badge-count a:hover {
  36. color: #fff;
  37. }
  38. .ant-badge-count-sm {
  39. min-width: 14px;
  40. height: 14px;
  41. padding: 0;
  42. font-size: 12px;
  43. line-height: 14px;
  44. border-radius: 7px;
  45. }
  46. .ant-badge-multiple-words {
  47. padding: 0 8px;
  48. }
  49. .ant-badge-dot {
  50. z-index: auto;
  51. width: 6px;
  52. min-width: 6px;
  53. height: 6px;
  54. background: #ff4d4f;
  55. border-radius: 100%;
  56. box-shadow: 0 0 0 1px #fff;
  57. }
  58. .ant-badge-dot.ant-scroll-number {
  59. transition: background 1.5s;
  60. }
  61. .ant-badge-count,
  62. .ant-badge-dot,
  63. .ant-badge .ant-scroll-number-custom-component {
  64. position: absolute;
  65. top: 0;
  66. right: 0;
  67. transform: translate(50%, -50%);
  68. transform-origin: 100% 0%;
  69. }
  70. .ant-badge-count.anticon-spin,
  71. .ant-badge-dot.anticon-spin,
  72. .ant-badge .ant-scroll-number-custom-component.anticon-spin {
  73. animation: antBadgeLoadingCircle 1s infinite linear;
  74. }
  75. .ant-badge-status {
  76. line-height: inherit;
  77. vertical-align: baseline;
  78. }
  79. .ant-badge-status-dot {
  80. position: relative;
  81. top: -1px;
  82. display: inline-block;
  83. width: 6px;
  84. height: 6px;
  85. vertical-align: middle;
  86. border-radius: 50%;
  87. }
  88. .ant-badge-status-success {
  89. background-color: #52c41a;
  90. }
  91. .ant-badge-status-processing {
  92. position: relative;
  93. background-color: #1890ff;
  94. }
  95. .ant-badge-status-processing::after {
  96. position: absolute;
  97. top: 0;
  98. left: 0;
  99. width: 100%;
  100. height: 100%;
  101. border: 1px solid #1890ff;
  102. border-radius: 50%;
  103. animation: antStatusProcessing 1.2s infinite ease-in-out;
  104. content: '';
  105. }
  106. .ant-badge-status-default {
  107. background-color: #d9d9d9;
  108. }
  109. .ant-badge-status-error {
  110. background-color: #ff4d4f;
  111. }
  112. .ant-badge-status-warning {
  113. background-color: #faad14;
  114. }
  115. .ant-badge-status-pink {
  116. background: #eb2f96;
  117. }
  118. .ant-badge-status-magenta {
  119. background: #eb2f96;
  120. }
  121. .ant-badge-status-red {
  122. background: #f5222d;
  123. }
  124. .ant-badge-status-volcano {
  125. background: #fa541c;
  126. }
  127. .ant-badge-status-orange {
  128. background: #fa8c16;
  129. }
  130. .ant-badge-status-yellow {
  131. background: #fadb14;
  132. }
  133. .ant-badge-status-gold {
  134. background: #faad14;
  135. }
  136. .ant-badge-status-cyan {
  137. background: #13c2c2;
  138. }
  139. .ant-badge-status-lime {
  140. background: #a0d911;
  141. }
  142. .ant-badge-status-green {
  143. background: #52c41a;
  144. }
  145. .ant-badge-status-blue {
  146. background: #1890ff;
  147. }
  148. .ant-badge-status-geekblue {
  149. background: #2f54eb;
  150. }
  151. .ant-badge-status-purple {
  152. background: #722ed1;
  153. }
  154. .ant-badge-status-text {
  155. margin-left: 8px;
  156. color: rgba(0, 0, 0, 0.85);
  157. font-size: 14px;
  158. }
  159. .ant-badge-zoom-appear,
  160. .ant-badge-zoom-enter {
  161. animation: antZoomBadgeIn 0.3s cubic-bezier(0.12, 0.4, 0.29, 1.46);
  162. animation-fill-mode: both;
  163. }
  164. .ant-badge-zoom-leave {
  165. animation: antZoomBadgeOut 0.3s cubic-bezier(0.71, -0.46, 0.88, 0.6);
  166. animation-fill-mode: both;
  167. }
  168. .ant-badge-not-a-wrapper .ant-badge-zoom-appear,
  169. .ant-badge-not-a-wrapper .ant-badge-zoom-enter {
  170. animation: antNoWrapperZoomBadgeIn 0.3s cubic-bezier(0.12, 0.4, 0.29, 1.46);
  171. }
  172. .ant-badge-not-a-wrapper .ant-badge-zoom-leave {
  173. animation: antNoWrapperZoomBadgeOut 0.3s cubic-bezier(0.71, -0.46, 0.88, 0.6);
  174. }
  175. .ant-badge-not-a-wrapper:not(.ant-badge-status) {
  176. vertical-align: middle;
  177. }
  178. .ant-badge-not-a-wrapper .ant-scroll-number-custom-component,
  179. .ant-badge-not-a-wrapper .ant-badge-count {
  180. transform: none;
  181. }
  182. .ant-badge-not-a-wrapper .ant-scroll-number-custom-component,
  183. .ant-badge-not-a-wrapper .ant-scroll-number {
  184. position: relative;
  185. top: auto;
  186. display: block;
  187. transform-origin: 50% 50%;
  188. }
  189. @keyframes antStatusProcessing {
  190. 0% {
  191. transform: scale(0.8);
  192. opacity: 0.5;
  193. }
  194. 100% {
  195. transform: scale(2.4);
  196. opacity: 0;
  197. }
  198. }
  199. .ant-scroll-number {
  200. overflow: hidden;
  201. direction: ltr;
  202. }
  203. .ant-scroll-number-only {
  204. position: relative;
  205. display: inline-block;
  206. height: 20px;
  207. transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  208. /* stylelint-disable property-no-vendor-prefix */
  209. -webkit-transform-style: preserve-3d;
  210. -webkit-backface-visibility: hidden;
  211. /* stylelint-enable property-no-vendor-prefix */
  212. }
  213. .ant-scroll-number-only > p.ant-scroll-number-only-unit {
  214. height: 20px;
  215. margin: 0;
  216. /* stylelint-disable property-no-vendor-prefix */
  217. -webkit-transform-style: preserve-3d;
  218. -webkit-backface-visibility: hidden;
  219. /* stylelint-enable property-no-vendor-prefix */
  220. }
  221. .ant-scroll-number-symbol {
  222. vertical-align: top;
  223. }
  224. @keyframes antZoomBadgeIn {
  225. 0% {
  226. transform: scale(0) translate(50%, -50%);
  227. opacity: 0;
  228. }
  229. 100% {
  230. transform: scale(1) translate(50%, -50%);
  231. }
  232. }
  233. @keyframes antZoomBadgeOut {
  234. 0% {
  235. transform: scale(1) translate(50%, -50%);
  236. }
  237. 100% {
  238. transform: scale(0) translate(50%, -50%);
  239. opacity: 0;
  240. }
  241. }
  242. @keyframes antNoWrapperZoomBadgeIn {
  243. 0% {
  244. transform: scale(0);
  245. opacity: 0;
  246. }
  247. 100% {
  248. transform: scale(1);
  249. }
  250. }
  251. @keyframes antNoWrapperZoomBadgeOut {
  252. 0% {
  253. transform: scale(1);
  254. }
  255. 100% {
  256. transform: scale(0);
  257. opacity: 0;
  258. }
  259. }
  260. @keyframes antBadgeLoadingCircle {
  261. 0% {
  262. transform-origin: 50%;
  263. }
  264. 100% {
  265. transform: translate(50%, -50%) rotate(360deg);
  266. transform-origin: 50%;
  267. }
  268. }
  269. .ant-ribbon-wrapper {
  270. position: relative;
  271. }
  272. .ant-ribbon {
  273. box-sizing: border-box;
  274. margin: 0;
  275. padding: 0;
  276. color: rgba(0, 0, 0, 0.85);
  277. font-size: 14px;
  278. font-variant: tabular-nums;
  279. line-height: 1.5715;
  280. list-style: none;
  281. font-feature-settings: 'tnum';
  282. position: absolute;
  283. top: 8px;
  284. height: 22px;
  285. padding: 0 8px;
  286. color: #fff;
  287. line-height: 22px;
  288. white-space: nowrap;
  289. background-color: #1890ff;
  290. border-radius: 2px;
  291. }
  292. .ant-ribbon-text {
  293. color: #fff;
  294. }
  295. .ant-ribbon-corner {
  296. position: absolute;
  297. top: 100%;
  298. width: 8px;
  299. height: 8px;
  300. color: currentcolor;
  301. border: 4px solid;
  302. transform: scaleY(0.75);
  303. transform-origin: top;
  304. }
  305. .ant-ribbon-corner::after {
  306. position: absolute;
  307. top: -4px;
  308. left: -4px;
  309. width: inherit;
  310. height: inherit;
  311. color: rgba(0, 0, 0, 0.25);
  312. border: inherit;
  313. content: '';
  314. }
  315. .ant-ribbon-color-pink {
  316. color: #eb2f96;
  317. background: #eb2f96;
  318. }
  319. .ant-ribbon-color-magenta {
  320. color: #eb2f96;
  321. background: #eb2f96;
  322. }
  323. .ant-ribbon-color-red {
  324. color: #f5222d;
  325. background: #f5222d;
  326. }
  327. .ant-ribbon-color-volcano {
  328. color: #fa541c;
  329. background: #fa541c;
  330. }
  331. .ant-ribbon-color-orange {
  332. color: #fa8c16;
  333. background: #fa8c16;
  334. }
  335. .ant-ribbon-color-yellow {
  336. color: #fadb14;
  337. background: #fadb14;
  338. }
  339. .ant-ribbon-color-gold {
  340. color: #faad14;
  341. background: #faad14;
  342. }
  343. .ant-ribbon-color-cyan {
  344. color: #13c2c2;
  345. background: #13c2c2;
  346. }
  347. .ant-ribbon-color-lime {
  348. color: #a0d911;
  349. background: #a0d911;
  350. }
  351. .ant-ribbon-color-green {
  352. color: #52c41a;
  353. background: #52c41a;
  354. }
  355. .ant-ribbon-color-blue {
  356. color: #1890ff;
  357. background: #1890ff;
  358. }
  359. .ant-ribbon-color-geekblue {
  360. color: #2f54eb;
  361. background: #2f54eb;
  362. }
  363. .ant-ribbon-color-purple {
  364. color: #722ed1;
  365. background: #722ed1;
  366. }
  367. .ant-ribbon.ant-ribbon-placement-end {
  368. right: -8px;
  369. border-bottom-right-radius: 0;
  370. }
  371. .ant-ribbon.ant-ribbon-placement-end .ant-ribbon-corner {
  372. right: 0;
  373. border-color: currentcolor transparent transparent currentcolor;
  374. }
  375. .ant-ribbon.ant-ribbon-placement-start {
  376. left: -8px;
  377. border-bottom-left-radius: 0;
  378. }
  379. .ant-ribbon.ant-ribbon-placement-start .ant-ribbon-corner {
  380. left: 0;
  381. border-color: currentcolor currentcolor transparent transparent;
  382. }
  383. .ant-badge-rtl {
  384. direction: rtl;
  385. }
  386. .ant-badge-rtl .ant-badge:not(.ant-badge-not-a-wrapper) .ant-badge-count,
  387. .ant-badge-rtl .ant-badge:not(.ant-badge-not-a-wrapper) .ant-badge-dot,
  388. .ant-badge-rtl .ant-badge:not(.ant-badge-not-a-wrapper) .ant-scroll-number-custom-component {
  389. right: auto;
  390. left: 0;
  391. direction: ltr;
  392. transform: translate(-50%, -50%);
  393. transform-origin: 0% 0%;
  394. }
  395. .ant-badge-rtl.ant-badge:not(.ant-badge-not-a-wrapper) .ant-scroll-number-custom-component {
  396. right: auto;
  397. left: 0;
  398. transform: translate(-50%, -50%);
  399. transform-origin: 0% 0%;
  400. }
  401. .ant-badge-rtl .ant-badge-status-text {
  402. margin-right: 8px;
  403. margin-left: 0;
  404. }
  405. .ant-ribbon-rtl {
  406. direction: rtl;
  407. }
  408. .ant-ribbon-rtl.ant-ribbon-placement-end {
  409. right: unset;
  410. left: -8px;
  411. border-bottom-right-radius: 2px;
  412. border-bottom-left-radius: 0;
  413. }
  414. .ant-ribbon-rtl.ant-ribbon-placement-end .ant-ribbon-corner {
  415. right: unset;
  416. left: 0;
  417. border-color: currentcolor currentcolor transparent transparent;
  418. }
  419. .ant-ribbon-rtl.ant-ribbon-placement-end .ant-ribbon-corner::after {
  420. border-color: currentcolor currentcolor transparent transparent;
  421. }
  422. .ant-ribbon-rtl.ant-ribbon-placement-start {
  423. right: -8px;
  424. left: unset;
  425. border-bottom-right-radius: 0;
  426. border-bottom-left-radius: 2px;
  427. }
  428. .ant-ribbon-rtl.ant-ribbon-placement-start .ant-ribbon-corner {
  429. right: 0;
  430. left: unset;
  431. border-color: currentcolor transparent transparent currentcolor;
  432. }
  433. .ant-ribbon-rtl.ant-ribbon-placement-start .ant-ribbon-corner::after {
  434. border-color: currentcolor transparent transparent currentcolor;
  435. }