antd/es/table/style/sorter.js

An enterprise-class UI design language and React components implementation

import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

var genSorterStyle = function genSorterStyle(token) {
  var _$concat2;

  var componentCls = token.componentCls,
      marginXXS = token.marginXXS,
      fontSizeIcon = token.fontSizeIcon,
      tableHeaderIconColor = token.tableHeaderIconColor,
      tableHeaderIconColorHover = token.tableHeaderIconColorHover;
  return _defineProperty({}, "".concat(componentCls, "-wrapper"), (_$concat2 = {}, _defineProperty(_$concat2, "".concat(componentCls, "-thead th").concat(componentCls, "-column-has-sorters"), _defineProperty({
    outline: 'none',
    cursor: 'pointer',
    transition: "all ".concat(token.motionDurationSlow),
    '&:hover': {
      background: token.tableHeaderSortHoverBg,
      '&::before': {
        backgroundColor: 'transparent !important'
      }
    },
    '&:focus-visible': {
      color: token.colorPrimary
    }
  }, "\n          &".concat(componentCls, "-cell-fix-left:hover,\n          &").concat(componentCls, "-cell-fix-right:hover\n        "), {
    background: token.tableFixedHeaderSortActiveBg
  })), _defineProperty(_$concat2, "".concat(componentCls, "-thead th").concat(componentCls, "-column-sort"), {
    background: token.tableHeaderSortBg,
    '&::before': {
      backgroundColor: 'transparent !important'
    }
  }), _defineProperty(_$concat2, "td".concat(componentCls, "-column-sort"), {
    background: token.tableBodySortBg
  }), _defineProperty(_$concat2, "".concat(componentCls, "-column-title"), {
    position: 'relative',
    zIndex: 1,
    flex: 1
  }), _defineProperty(_$concat2, "".concat(componentCls, "-column-sorters"), {
    display: 'flex',
    flex: 'auto',
    alignItems: 'center',
    justifyContent: 'space-between',
    '&::after': {
      position: 'absolute',
      inset: 0,
      width: '100%',
      height: '100%',
      content: '""'
    }
  }), _defineProperty(_$concat2, "".concat(componentCls, "-column-sorter"), _defineProperty({
    marginInlineStart: marginXXS,
    color: tableHeaderIconColor,
    fontSize: 0,
    transition: "color ".concat(token.motionDurationSlow),
    '&-inner': {
      display: 'inline-flex',
      flexDirection: 'column',
      alignItems: 'center'
    },
    '&-up, &-down': {
      fontSize: fontSizeIcon,
      '&.active': {
        color: token.colorPrimary
      }
    }
  }, "".concat(componentCls, "-column-sorter-up + ").concat(componentCls, "-column-sorter-down"), {
    marginTop: '-0.3em'
  })), _defineProperty(_$concat2, "".concat(componentCls, "-column-sorters:hover ").concat(componentCls, "-column-sorter"), {
    color: tableHeaderIconColorHover
  }), _$concat2));
};

export default genSorterStyle;