selection.js 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. const genSelectionStyle = token => {
  2. const {
  3. componentCls,
  4. antCls,
  5. iconCls,
  6. fontSizeIcon,
  7. paddingXS,
  8. tableHeaderIconColor,
  9. tableHeaderIconColorHover
  10. } = token;
  11. return {
  12. [`${componentCls}-wrapper`]: {
  13. // ========================== Selections ==========================
  14. [`${componentCls}-selection-col`]: {
  15. width: token.tableSelectionColumnWidth
  16. },
  17. [`${componentCls}-bordered ${componentCls}-selection-col`]: {
  18. width: token.tableSelectionColumnWidth + paddingXS * 2
  19. },
  20. [`
  21. table tr th${componentCls}-selection-column,
  22. table tr td${componentCls}-selection-column
  23. `]: {
  24. paddingInlineEnd: token.paddingXS,
  25. paddingInlineStart: token.paddingXS,
  26. textAlign: 'center',
  27. [`${antCls}-radio-wrapper`]: {
  28. marginInlineEnd: 0
  29. }
  30. },
  31. [`table tr th${componentCls}-selection-column${componentCls}-cell-fix-left`]: {
  32. zIndex: token.zIndexTableFixed + 1
  33. },
  34. [`table tr th${componentCls}-selection-column::after`]: {
  35. backgroundColor: 'transparent !important'
  36. },
  37. [`${componentCls}-selection`]: {
  38. position: 'relative',
  39. display: 'inline-flex',
  40. flexDirection: 'column'
  41. },
  42. [`${componentCls}-selection-extra`]: {
  43. position: 'absolute',
  44. top: 0,
  45. zIndex: 1,
  46. cursor: 'pointer',
  47. transition: `all ${token.motionDurationSlow}`,
  48. marginInlineStart: '100%',
  49. paddingInlineStart: `${token.tablePaddingHorizontal / 4}px`,
  50. [iconCls]: {
  51. color: tableHeaderIconColor,
  52. fontSize: fontSizeIcon,
  53. verticalAlign: 'baseline',
  54. '&:hover': {
  55. color: tableHeaderIconColorHover
  56. }
  57. }
  58. }
  59. }
  60. };
  61. };
  62. export default genSelectionStyle;