search

grommet / grommet-theme-hpe

Hewlett Packard Enterprise grommet theme
Apache License 2.0
23 stars 12 forks source link

Issue using a checkbox in a grid #414

Open adam-arnett523 opened 3 weeks ago

adam-arnett523 commented 3 weeks ago

I just wanted to bring up that I think there's a small problem when using a checkbox that is set to fill and be a toggle when in a grid. When it's set to fill the hover extends beyond the bottom of the checkbox no matter what the height is set to. When it's not in a grid it works how it's supposed to. image Example code: image

<Grid columns={grid.columns[size]} rows={grid.rows[size]} areas={grid.areas[size]} gap={grid.gap[size]} margin={{ top: 'medium', bottom: 'medium' }}

{t('group_wizard.step_set_external_storage.header')} {externalStorageSetting.name} {externalStorageSettingsData.value} } />

<Box margin={{ top: 'small' }} pad={{ top: 'small' }}>

{t('group_wizard.step_set_external_storage.policies')} {t('group_wizard.step_set_external_storage.policies_desc')}

<Box margin={{ top: 'small' }} pad={{ top: 'small' }}> <Box pad={{ top: 'small' }}> <FormField name="autoApplyExternalStorageConfig" htmlFor="autoApplyExternalStorageConfig" help={t( 'group_wizard.step_set_external_storage.auto_apply_external_storage_help', )}

<CheckBox id="externalStorageConfiguration" name="externalStorageConfiguration" label={t( 'group_wizard.step_set_external_storage.auto_apply_external_storage_checkbox_label', )} fill toggle reverse checked={externalStorageConfiguration} onChange={event => setExternalStorageConfiguration(event.target.checked) } />