40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import {LinkContainer} from 'react-router-bootstrap'
|
|
import {Container, Nav, Navbar, NavDropdown} from 'react-bootstrap';
|
|
|
|
function Header() {
|
|
return (
|
|
<Navbar collapseOnSelect expand="md" className="bg-body-tertiary">
|
|
<Container>
|
|
<LinkContainer to="/">
|
|
<Navbar.Brand>K-FRIDGE</Navbar.Brand>
|
|
</LinkContainer>
|
|
<Navbar.Toggle aria-controls="responsive-navbar-nav" />
|
|
<Navbar.Collapse id="responsive-navbar-nav">
|
|
<Nav className="me-auto">
|
|
<Nav.Link href="#features">Features</Nav.Link>
|
|
<Nav.Link href="#pricing">Pricing</Nav.Link>
|
|
<NavDropdown title="Dropdown" id="collapsible-nav-dropdown">
|
|
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.2">
|
|
Another action
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
|
|
<NavDropdown.Divider />
|
|
<NavDropdown.Item href="#action/3.4">
|
|
Separated link
|
|
</NavDropdown.Item>
|
|
</NavDropdown>
|
|
</Nav>
|
|
<Nav>
|
|
<Nav.Link href="#deets">More deets</Nav.Link>
|
|
<Nav.Link eventKey={2} href="#memes">
|
|
Dank memes
|
|
</Nav.Link>
|
|
</Nav>
|
|
</Navbar.Collapse>
|
|
</Container>
|
|
</Navbar>
|
|
);
|
|
}
|
|
|
|
export default Header; |