dragger.js 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = void 0;
  6. var _cssinjs = require("@ant-design/cssinjs");
  7. const genDraggerStyle = token => {
  8. const {
  9. componentCls,
  10. iconCls
  11. } = token;
  12. return {
  13. [`${componentCls}-wrapper`]: {
  14. [`${componentCls}-drag`]: {
  15. position: 'relative',
  16. width: '100%',
  17. height: '100%',
  18. textAlign: 'center',
  19. background: token.colorFillAlter,
  20. border: `${(0, _cssinjs.unit)(token.lineWidth)} dashed ${token.colorBorder}`,
  21. borderRadius: token.borderRadiusLG,
  22. cursor: 'pointer',
  23. transition: `border-color ${token.motionDurationSlow}`,
  24. [componentCls]: {
  25. padding: token.padding
  26. },
  27. [`${componentCls}-btn`]: {
  28. display: 'table',
  29. width: '100%',
  30. height: '100%',
  31. outline: 'none',
  32. borderRadius: token.borderRadiusLG,
  33. '&:focus-visible': {
  34. outline: `${(0, _cssinjs.unit)(token.lineWidthFocus)} solid ${token.colorPrimaryBorder}`
  35. }
  36. },
  37. [`${componentCls}-drag-container`]: {
  38. display: 'table-cell',
  39. verticalAlign: 'middle'
  40. },
  41. [`
  42. &:not(${componentCls}-disabled):hover,
  43. &-hover:not(${componentCls}-disabled)
  44. `]: {
  45. borderColor: token.colorPrimaryHover
  46. },
  47. [`p${componentCls}-drag-icon`]: {
  48. marginBottom: token.margin,
  49. [iconCls]: {
  50. color: token.colorPrimary,
  51. fontSize: token.uploadThumbnailSize
  52. }
  53. },
  54. [`p${componentCls}-text`]: {
  55. margin: `0 0 ${(0, _cssinjs.unit)(token.marginXXS)}`,
  56. color: token.colorTextHeading,
  57. fontSize: token.fontSizeLG
  58. },
  59. [`p${componentCls}-hint`]: {
  60. color: token.colorTextDescription,
  61. fontSize: token.fontSize
  62. },
  63. // ===================== Disabled =====================
  64. [`&${componentCls}-disabled`]: {
  65. [`p${componentCls}-drag-icon ${iconCls},
  66. p${componentCls}-text,
  67. p${componentCls}-hint
  68. `]: {
  69. color: token.colorTextDisabled
  70. }
  71. }
  72. }
  73. }
  74. };
  75. };
  76. var _default = exports.default = genDraggerStyle;