sticky.js 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  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 genStickyStyle = token => {
  8. const {
  9. componentCls,
  10. opacityLoading,
  11. tableScrollThumbBg,
  12. tableScrollThumbBgHover,
  13. tableScrollThumbSize,
  14. tableScrollBg,
  15. zIndexTableSticky,
  16. stickyScrollBarBorderRadius,
  17. lineWidth,
  18. lineType,
  19. tableBorderColor
  20. } = token;
  21. const tableBorder = `${(0, _cssinjs.unit)(lineWidth)} ${lineType} ${tableBorderColor}`;
  22. return {
  23. [`${componentCls}-wrapper`]: {
  24. [`${componentCls}-sticky`]: {
  25. '&-holder': {
  26. position: 'sticky',
  27. zIndex: zIndexTableSticky,
  28. background: token.colorBgContainer
  29. },
  30. '&-scroll': {
  31. position: 'sticky',
  32. bottom: 0,
  33. height: `${(0, _cssinjs.unit)(tableScrollThumbSize)} !important`,
  34. zIndex: zIndexTableSticky,
  35. display: 'flex',
  36. alignItems: 'center',
  37. background: tableScrollBg,
  38. borderTop: tableBorder,
  39. opacity: opacityLoading,
  40. '&:hover': {
  41. transformOrigin: 'center bottom'
  42. },
  43. // fake scrollbar style of sticky
  44. '&-bar': {
  45. height: tableScrollThumbSize,
  46. backgroundColor: tableScrollThumbBg,
  47. borderRadius: stickyScrollBarBorderRadius,
  48. transition: `all ${token.motionDurationSlow}, transform 0s`,
  49. position: 'absolute',
  50. bottom: 0,
  51. '&:hover, &-active': {
  52. backgroundColor: tableScrollThumbBgHover
  53. }
  54. }
  55. }
  56. }
  57. }
  58. };
  59. };
  60. var _default = exports.default = genStickyStyle;