Search code examples
reactjsthemesgrommet

Grommet UI how to modify the size of the components?

I try to use the components from the Grommet UI with ReactJs. I would like to understand if there is a way to use an existing Grommet theme in order to have smaller components (text input, number input, datetime) or I have to customize by overriding the components dimentions ?

Solution

  • No grommet supported way.

    Yeah there is not a easy way to reduce the components size. Just some containers and icons have the attribute size that can have a shirt-sized dimension xsmall small medium large etc.

    But if it is of help I found handy to modify the size through styles:

    <GrommetComponent style={{width:'100%', height:20}}/>