React Sidebar Pro
<Sidebar className="sidebar_custom">
<SidebarHeader>
<SidebarLogo img={pathOfLogo}/>
</SidebarHeader>
<SidebarBody>
<MenuBar>
<MenuItem
to='/'
text='Dashboard'
/>
<MenuItem
to='/'
text='My Project Tasks'
/>
<SubMenuBar
label="More Options"
>
<MenuItem
to='/'
text='First Option'
/>
<MenuItem
to='/'
text='Second Option'
/>
</SubMenuBar>
</MenuBar>
</SidebarBody>
<SidebarFooter>
content of footer
</SidebarFooter>
</Sidebar>
Props Provided
Sidebar <Sidebar> </Sidebar>
Props |
Type |
Description |
className |
string |
class name of sidebar |
SidebarHeader <SidebarHeader></SidebarHeader>
Props |
Type |
Description |
className |
string |
class name of sidebar header |
SidebarLogo <SidebarLogo props />
Props |
Description |
img |
set image as logo on sidebar |
MenuItem <MenuItem props />
Props |
Type |
Description |
Optional |
to |
string |
navigation link |
False |
leftIcon |
any |
icon on the left side of label of menuitem |
True |
text |
string |
main text of menu item |
False |
rightIcon |
any |
icon on the right side of label of menuitem |
True |
SubMenuBar <SubMenuBar props></SubMenuBar>
Props |
Type |
Description |
Optional |
labelLeftIcon |
string |
Icon on the left side of label of menuitem |
True |
label |
string |
label for the submenubar |
False |
labelRightIcon |
any |
change icon on right side of label (default is downIcon) |
True |
children |
any |
all children pass in the component |
False |
Note
^3.0.2 version is fully completed