53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
// 此样式是vue版本独有样式，react版本没有拖拽改变列宽度功能
|
||
import type { CSSObject } from '../../_util/cssinjs';
|
||
import type { GenerateStyle } from '../../theme/internal';
|
||
import type { TableToken } from './index';
|
||
|
||
const genResizeStyle: GenerateStyle<TableToken, CSSObject> = token => {
|
||
const { componentCls } = token;
|
||
|
||
return {
|
||
[`${componentCls}-wrapper ${componentCls}-resize-handle`]: {
|
||
position: 'absolute',
|
||
top: 0,
|
||
height: '100% !important',
|
||
bottom: 0,
|
||
left: ' auto !important',
|
||
right: ' -8px',
|
||
cursor: 'col-resize',
|
||
touchAction: 'none',
|
||
userSelect: 'auto',
|
||
width: '16px',
|
||
zIndex: 1,
|
||
[`&-line`]: {
|
||
display: 'block',
|
||
width: '1px',
|
||
marginLeft: '7px',
|
||
height: '100% !important',
|
||
backgroundColor: token.colorPrimary,
|
||
opacity: 0,
|
||
},
|
||
[`&:hover &-line`]: {
|
||
opacity: 1,
|
||
},
|
||
},
|
||
[`${componentCls}-wrapper ${componentCls}-resize-handle.dragging`]: {
|
||
overflow: 'hidden',
|
||
[`${componentCls}-resize-handle-line`]: {
|
||
opacity: 1,
|
||
},
|
||
[`&:before`]: {
|
||
position: 'absolute',
|
||
top: 0,
|
||
bottom: 0,
|
||
content: '" "',
|
||
width: '200vw',
|
||
transform: 'translateX(-50%)',
|
||
opacity: 0,
|
||
},
|
||
},
|
||
};
|
||
};
|
||
|
||
export default genResizeStyle;
|