ExternalPageNavBar.tsx

import React, { ReactElement } from "react";
import { Col, Container, Row } from "react-bootstrap";
import Login from "../../shared/Login";
import GeantLogo from "../../images/geant_logo_f2020_new.svg";

/**
 * NavBar
 *
 * This NavBar is only to be used when doing development, as the main site will run inside an iframe with
 * the correct menu around it
 */
function ExternalPageNavBar(): ReactElement {
    return (
        <div className={'external-page-nav-bar'}>

            <Container>
                <Row>
                    <Col xs={10}>
                        <div className="nav-wrapper">
                            <nav className="header-nav">
                                <a href="https://geant.org/"><img src={GeantLogo} /></a>

                                <ul>
                                    <li><a className="nav-link-entry" href="https://network.geant.org/">NETWORK</a></li>
                                    <li><a className="nav-link-entry" href="https://geant.org/services/">SERVICES</a></li>
                                    <li><a className="nav-link-entry" href="https://community.geant.org/">COMMUNITY</a></li>
                                    <li><a className="nav-link-entry" href="https://tnc23.geant.org/">TNC</a></li>
                                    <li><a className="nav-link-entry" href="https://geant.org/projects/">PROJECTS</a></li>
                                    <li><a className="nav-link-entry" href="https://connect.geant.org/">CONNECT</a></li>
                                    <li><a className="nav-link-entry" href="https://impact.geant.org/">IMPACT</a></li>
                                    <li><a className="nav-link-entry" href="https://careers.geant.org/">CAREERS</a></li>
                                    <li><a className="nav-link-entry" href="https://about.geant.org/">ABOUT</a></li>
                                    <li><a className="nav-link-entry" href="https://connect.geant.org/community-news">NEWS</a></li>
                                    <li><a className="nav-link-entry" href="https://resources.geant.org/">RESOURCES</a></li>
                                </ul>

                            </nav>
                        </div>

                    </Col>

                    <Col align="right">
                        <Login />
                    </Col>
                </Row>
            </Container>
        </div >
    );
}

export default ExternalPageNavBar;