Skip to content

Instantly share code, notes, and snippets.

@igmrrf
Created September 16, 2019 18:37
Show Gist options
  • Save igmrrf/f619306185eac733ea3f661f01e173f9 to your computer and use it in GitHub Desktop.
Save igmrrf/f619306185eac733ea3f661f01e173f9 to your computer and use it in GitHub Desktop.

Revisions

  1. Mr Richard Francis created this gist Sep 16, 2019.
    26 changes: 26 additions & 0 deletions header.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,26 @@
    import React from 'react';
    import { Navbar, Nav, Button, Form} from 'react-bootstrap';
    import { NavLink } from "react-router-dom"

    const Header = () => {
    return(
    <Navbar className='transh' expand="lg">
    <Navbar.Brand className='f3'><h1>KnowAfrica</h1></Navbar.Brand>
    <Navbar.Toggle aria-controls="basic-navbar-nav" />
    <Navbar.Collapse id="basic-navbar-nav">
    <Nav className="mr-auto">
    </Nav>
    <Form inline>
    <NavLink to="/" className="header"><strong>Home</strong></NavLink>
    <p className="header"><strong>Categories</strong></p>
    <p className="header"><strong>Leaderboard</strong></p>
    <p className="header"><strong>Richard</strong></p>
    <Button className='buth' variant='outline-primary'></Button>
    </Form>
    </Navbar.Collapse>
    </Navbar>

    )

    }
    export default Header;