How to customize button padding in Mantine UI Button component. Mantine UI core button padding customization code.
styles={{
root: {
padding: 5,
margin: 0,
height:'60px'
},
Example:
<Button
key={value}
variant={response === value ? "gradient" : "default"}
gradient={{ from: '#62CBE6', to: '#3F5BA9' }}
onClick={() => updateResponse(value)}
sx={{ minHeight: '30px', maxWidth: '70px', maxHeight: '70px' }}
styles={{
root: {
padding: 5,
margin: 0,
height:'60px'
},
inner: { padding:'0px' } }}
>
<Image src={`${process.env.NEXT_PUBLIC_FRONTEND_URL}/images/smileys/${value}.png`} width={25} height={25} />
</Button>