styled-nav-component
The bootstrap nav component made with styled-components.
This is a modular approach to use bootstrap components for quick prototypes, as an entrypoint of your own component library, or if you need just one bootstrap component for your application.
Installation
npm install --save styled-nav-componentnpm install --save styled-components@^4.1.3 react@^16.7.0 # Peer dependencies
Usage
For detailed information take a look at the documentation.
import Nav NavLink from 'styled-nav-component'; const Navigation = props <Nav мertical> <NavLink ="#" >Active</NavLink> <NavLink ="#">Link</NavLink> <NavLink ="#">Link</NavLink> <NavLink ="#" >Disabled</NavLink> </Nav>;
Usage with react-router-dom.
import Nav NavLink from 'styled-nav-component';import Link from 'react-router-dom'; const MyNavWithReactRouterDom = props <Nav > <Link ="#"> <NavLink >Active</NavLink> </Link> <Link ="#"> <NavLink >Link</NavLink> </Link> <Link ="#"> <NavLink >Link</NavLink> </Link> <Link ="#"> <NavLink >Disabled</NavLink> </Link> </Nav>;
Properties
Properties which can be added to the component to change the visual appearance.
collapse
only on Nav Type: booleanexpandSm
only on Nav Type: booleanexpandMd
only on Nav Type: booleanexpandLg
only on Nav Type: booleanexpandXl
only on Nav Type: booleanhidden
only on Nav Type: booleanstart
only on Nav Type: stringcenter
only on Nav Type: stringend
only on Nav Type: stringvertical
only on Nav Type: stringjustified
only on Nav Type: stringfill
only on Nav Type: stringtabs
only on NavLink Type: stringpills
only on NavLink Type: stringnoRadius
only on NavLink Type: stringactive
only on NavLink Type: stringdisabled
only on NavLink Type: stringitem
only on NavLink Type: string
License
MIT © Lukas Aichbauer