Added navbar component

This commit is contained in:
z0ccc 2021-06-10 02:46:34 -04:00
parent 9e5a89fe1a
commit 43234c05c9
3 changed files with 22 additions and 14 deletions

View file

@ -23,7 +23,7 @@ a:hover {
color: var( --main); color: var( --main);
} }
.header { .navbar {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

View file

@ -1,8 +1,7 @@
import * as React from 'react'; import * as React from 'react';
import { useEffect } from 'react'; import { useEffect } from 'react';
import * as Bowser from 'bowser'; import * as Bowser from 'bowser';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import Navbar from './Navbar';
import { faExternalLinkAlt, faCog } from '@fortawesome/free-solid-svg-icons';
import './App.css'; import './App.css';
const updateDOM = (id, text) => { const updateDOM = (id, text) => {
@ -64,17 +63,7 @@ const App = () => {
return ( return (
<div className="App"> <div className="App">
<div className="header"> <Navbar />
<div className="logoImage" />
<div className="menu">
<a href="url" target="_blank">
<FontAwesomeIcon icon={faExternalLinkAlt} size="lg" />
</a>
<a href="url" target="_blank">
<FontAwesomeIcon icon={faCog} size="lg" />
</a>
</div>
</div>
<table> <table>
<col className="column-one" /> <col className="column-one" />
<div className="title">Connection</div> <div className="title">Connection</div>

19
src/Navbar.js Normal file
View file

@ -0,0 +1,19 @@
import * as React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faExternalLinkAlt, faCog } from '@fortawesome/free-solid-svg-icons';
const Navbar = () => (
<div className="navbar">
<div className="logoImage" />
<div className="menu">
<a href="url" target="_blank">
<FontAwesomeIcon icon={faExternalLinkAlt} size="lg" />
</a>
<a href="url" target="_blank">
<FontAwesomeIcon icon={faCog} size="lg" />
</a>
</div>
</div>
);
export default Navbar;