Donde lo utilizo es en SiderMenu
const SiderMenu = () => {
return (
<Sider
style={{
overflow: 'auto',
height: '100vh',
position: 'fixed',
left: 0,
}}
>
<Menu theme="dark" mode="inline" defaultSelectedKeys={['4']}>
{declaraciones.declaraciones.map((e) => (
<Menu.Item id='menuItem' className='miStyle'>
<Tooltip title={e}>
{e}
</Tooltip>
</Menu.Item>
))}
</Menu>
</Sider>
);
}
El cual es llamado en HomePage
dentro de un Layout
componente de Ant Design
const HomePage = () => {
return (
<Layout>
<SiderMenu />
<Layout className="site-layout" style={{ marginLeft: 200 }}>
<Header className="site-layout-background" style={{ padding: 0 }} />
<Content style={{ margin: '24px 16px 0', overflow: 'initial' }}>
<div className="site-layout-background" style={{ padding: 24, textAlign: 'center' }}>
<CardSucursal />
<Button >Terminar</Button>
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>Ant Design ©2018 Created by Ant UED</Footer>
</Layout>
</Layout>
);
}
Existe alguna otra forma de poder colocar mi configuración de estilos a los elementos ?