Fixed nav-link to have full item apply to page change instead of just the text

This commit is contained in:
Gregory Campbell
2021-07-12 12:10:38 -04:00
parent fb5152d92a
commit 428c44d661
+22 -22
View File
@@ -13,7 +13,7 @@ const Styles = styled.div`
color: #000; color: #000;
&:hover{ &:hover{
color:black; color:#219837;
} }
} }
`; `;
@@ -21,30 +21,30 @@ const Styles = styled.div`
export const NavigationBar = () => ( export const NavigationBar = () => (
<Styles> <Styles>
<Navbar expand="lg" color='light-blue lighten-4'> <Navbar expand="lg" color='light-blue lighten-4'>
<Navbar.Brand href="/">GC</Navbar.Brand> <Navbar.Brand as={Link} to="/">GC</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" /> <Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav"> <Navbar.Collapse id="basic-navbar-nav">
<Nav classname="ml-auto"> <Nav classname="navbar-link">
<Nav.Item> <Nav.Item>
<Nav.Link> <Nav.Link as={Link} to="/">
<Link to="/">Home</Link> <Link to="/">Home</Link>
</Nav.Link> </Nav.Link>
</Nav.Item> </Nav.Item>
<Nav.Item> <Nav.Item>
<Nav.Link> <Nav.Link as={Link} to="/Resume">
<Link to="/Resume">Resume</Link> <Link to="/Resume">Resume</Link>
</Nav.Link> </Nav.Link>
</Nav.Item> </Nav.Item>
<Nav.Item> <Nav.Item>
<Nav.Link> <Nav.Link as={Link} to="/Projects">
<Link to="/Projects">Projects</Link> <Link to="/Projects">Projects</Link>
</Nav.Link> </Nav.Link>
</Nav.Item> </Nav.Item>
<Nav.Item> <Nav.Item>
<Nav.Link> <Nav.Link as={Link} to="/Contact">
<Link to="/Contact">Contact</Link> <Link to="/Contact">Contact</Link>
</Nav.Link> </Nav.Link>
</Nav.Item> </Nav.Item>
</Nav> </Nav>
</Navbar.Collapse> </Navbar.Collapse>
</Navbar> </Navbar>