ui icon indicating copy to clipboard operation
ui copied to clipboard

Card padding properties over 9 fail

Open EdwardGoomba opened this issue 3 years ago • 1 comments

While using a card component, inputting any single number over 9 as a property for padding breaks the functionality.

This works fine - padding is as expected:

<Card padding={9}>
  Some content
</Card>

This breaks - padding is no longer applied at all:

<Card padding={10}>
  Some content
</Card>

EdwardGoomba avatar Jan 27 '21 06:01 EdwardGoomba

@EdwardGoomba I believe this is because the Sanity theme only has 10 total padding values (as can be seen here theme.ts)

If you need more than this you might want to just assign custom padding yourself using styled components

import styled from 'styled-components'

const CardWithLargePadding = styled(Card)`
  padding: 500px;
`

return <CardWithLargePadding />

LiamMartens avatar Mar 04 '22 17:03 LiamMartens