Refactors tool panel

This commit is contained in:
Steve Ruiz 2021-07-10 13:01:59 +01:00
parent f9c688056e
commit 4efa1092f1
19 changed files with 580 additions and 261 deletions

View file

@ -7,6 +7,7 @@ import { forwardRef } from 'react'
export const breakpoints: any = { '@initial': 'mobile', '@sm': 'small' }
export const IconButton = styled('button', {
position: 'relative',
height: '32px',
width: '32px',
backgroundColor: '$panel',
@ -19,6 +20,7 @@ export const IconButton = styled('button', {
outline: 'none',
border: 'none',
pointerEvents: 'all',
fontSize: '$0',
cursor: 'pointer',
'& > *': {
@ -48,7 +50,9 @@ export const IconButton = styled('button', {
},
size: {
small: {
'& svg': {
height: 32,
width: 32,
'& svg:nth-of-type(1)': {
height: '16px',
width: '16px',
},
@ -56,17 +60,17 @@ export const IconButton = styled('button', {
medium: {
height: 44,
width: 44,
'& svg': {
height: '20px',
width: '20px',
'& svg:nth-of-type(1)': {
height: '18px',
width: '18px',
},
},
large: {
height: 44,
width: 44,
'& svg': {
height: '24px',
width: '24px',
'& svg:nth-of-type(1)': {
height: '20px',
width: '20px',
},
},
},
@ -404,3 +408,10 @@ export const ButtonsRow = styled('div', {
justifyContent: 'flex-start',
padding: 0,
})
export const VerticalDivider = styled('hr', {
width: '1px',
margin: '-2px 3px',
border: 'none',
backgroundColor: '$brushFill',
})