| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- const genButtonBorderStyle = (buttonTypeCls, borderColor) => ({
- // Border
- [`> span, > ${buttonTypeCls}`]: {
- '&:not(:last-child)': {
- [`&, & > ${buttonTypeCls}`]: {
- '&:not(:disabled)': {
- borderInlineEndColor: borderColor
- }
- }
- },
- '&:not(:first-child)': {
- [`&, & > ${buttonTypeCls}`]: {
- '&:not(:disabled)': {
- borderInlineStartColor: borderColor
- }
- }
- }
- }
- });
- const genGroupStyle = token => {
- const {
- componentCls,
- fontSize,
- lineWidth,
- colorPrimaryHover,
- colorErrorHover
- } = token;
- return {
- [`${componentCls}-group`]: [{
- position: 'relative',
- display: 'inline-flex',
- // Border
- [`> span, > ${componentCls}`]: {
- '&:not(:last-child)': {
- [`&, & > ${componentCls}`]: {
- borderStartEndRadius: 0,
- borderEndEndRadius: 0
- }
- },
- '&:not(:first-child)': {
- marginInlineStart: -lineWidth,
- [`&, & > ${componentCls}`]: {
- borderStartStartRadius: 0,
- borderEndStartRadius: 0
- }
- }
- },
- [componentCls]: {
- position: 'relative',
- zIndex: 1,
- [`&:hover,
- &:focus,
- &:active`]: {
- zIndex: 2
- },
- '&[disabled]': {
- zIndex: 0
- }
- },
- [`${componentCls}-icon-only`]: {
- fontSize
- }
- },
- // Border Color
- genButtonBorderStyle(`${componentCls}-primary`, colorPrimaryHover), genButtonBorderStyle(`${componentCls}-danger`, colorErrorHover)]
- };
- };
- export default genGroupStyle;
|