fixed user + admin navbars

client/src/pages/MobileUserNavbar.js

@@ -0,0 +1,54 @@
+import './MobNavbar.css';
+import bfpLogo from './../images/bfpLogo.svg';
+import xButton from './../images/isbees-x-symbol.svg';
+import groceries from './../images/navBarImage.png';
+import React, { useState } from 'react';
+import dropdownIcon from './../images/dropdown-icon.svg'
+import { BrowserRouter as Router, Routes, Route, Link } from "react-router-dom";
+
+function MobNavbar() {
+    const [dropdown, setDropdown] = useState(0);
+    function setTrue() {
+        setDropdown(true)
+    }
+    function setFalse() {
+        setDropdown(false)
+    }
+    if (dropdown) {
+        return (
+            <div className='canvas'>
+                <div className = "dropNavBar">
+                    <img src = {bfpLogo} className = "logo"></img>
+                    <button onClick={setFalse}>
+                        <img src = {xButton} className = "xButton" />
+                    </button>
+                </div>
+                <div className ='imageAndDropDowns'>
+                    <img src = {groceries} className = "dropDownLogo"></img>
+                    <div className='dropDownLinks'>
+                        <a href="https://www.berkeleyfoodpantry.org/aboutus" 
+                        target="_blank" rel="noopener noreferrer" className='dropDownText' onClick = {setFalse}>About the Pantry</a>
+                        <Link to = "/stockListingAdmin" onClick={setFalse} className = 'dropDownText'> View Today's Stock </Link>
+                        <a href="google.com" className='dropDownText'>Schedule Appointment</a>
+                        <Link to = "/adminLogin" onClick={setFalse} className = 'dropDownText'> Login </Link>
+                        {/* <a href="google.com" className='dropDownText'>Edit Today's Stock</a>
+                        <a href="google.com" className='dropDownText'>View Appointments</a>
+                        <a href="google.com" className='dropDownText'>Logout</a> */}
+                    </div>
+                </div>
+            </div>
+        )
+    } 
+    return (
+            <div className='navBar'>
+                <img src = {bfpLogo} className = "logo"></img>
+                <button onClick={setTrue}>
+                    <img src = {dropdownIcon} className = "icon"></img>
+                </button>
+            </div>
+
+    )
+
+}
+
+export default MobNavbar;

client/src/pages/UserNavbar.js

@@ -0,0 +1,17 @@
+import { BrowserRouter as Router, Routes, Route, Link } from "react-router-dom";
+import './Navbar.css';
+import berkeleyfoodpantrylogo from './../images/berkeley-food-pantry-logo.png';
+
+export default function AdminLoginNavbar() {
+   return(
+      <div className= "navbarContainer">
+         <img src={berkeleyfoodpantrylogo} className = "navbarLogo" alt = "navbar logo"></img>
+            <ul className = "navbar-container"> 
+                  <Link to="https://www.berkeleyfoodpantry.org/aboutus" className = "headerTags" style={{ textDecoration: 'none'}} >About the Pantry</Link>
+                  <Link to="/stockListingAdmin" className = "headerTags" style={{ textDecoration: 'none' }}>View Today's Stock</Link>
+                  <Link to="/appointmentScheduler" className = "headerTags" style={{ textDecoration: 'none' }}>Schedule Appointment</Link>
+                  <Link to="/adminLogin" className = "headerTags" style={{ textDecoration: 'none' }}>Login</Link>
+            </ul>
+      </div>
+   )
+}