30 lines
		
	
	
		
			701 B
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			30 lines
		
	
	
		
			701 B
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
import { styled } from '../stitches.config'
 | 
						|
import { StyledButton } from './Button'
 | 
						|
 | 
						|
const ButtonGroup = styled('div', {
 | 
						|
  display: 'flex',
 | 
						|
  marginLeft: '1px',
 | 
						|
  [`& ${StyledButton}`]: {
 | 
						|
    marginLeft: '-1px',
 | 
						|
    px: '$4',
 | 
						|
    zIndex: 2,
 | 
						|
    position: 'relative',
 | 
						|
    '&:hover, &:focus': {
 | 
						|
      zIndex: 200
 | 
						|
    }
 | 
						|
  },
 | 
						|
  [`& ${StyledButton}:not(:only-of-type):not(:first-child):not(:last-child)`]: {
 | 
						|
    borderRadius: 0
 | 
						|
  },
 | 
						|
  [`& ${StyledButton}:first-child:not(:only-of-type)`]: {
 | 
						|
    borderBottomRightRadius: 0,
 | 
						|
    borderTopRightRadius: 0
 | 
						|
  },
 | 
						|
  [`& ${StyledButton}:last-child:not(:only-of-type)`]: {
 | 
						|
    borderBottomLeftRadius: 0,
 | 
						|
    borderTopLeftRadius: 0
 | 
						|
  }
 | 
						|
})
 | 
						|
 | 
						|
export default ButtonGroup
 |