add uconn svg logo, remove extraneous public dir, update footer and n…

…avbar
sfc23007 · Nov 19, 2024 · b4ddfab · b4ddfab
1 parent 420ec88
commit b4ddfab
Show file tree

Hide file tree

Showing 6 changed files with 62 additions and 11 deletions.
diff --git a/public/oak-leaf-blue.png b/public/oak-leaf-blue.png
diff --git a/src/App.scss b/src/App.scss
@@ -54,4 +54,8 @@ h1 {
       margin-bottom: 0;
     }
   }
+}
+
+.site-footer {
+  background: #FFF;
 }
diff --git a/src/Footer.jsx b/src/Footer.jsx
@@ -1,16 +1,58 @@
+import uconnLogo from './assets/University_of_Connecticut_logo.svg'
+
 function Footer() {
 
   return (
     <>
-      <footer className="site-footer">
-        <div className="container py-5">
-          <div className="row">
-            <div className="col-12">
-              <h5 className="text-center">Site Footer...</h5>
-            </div>
+    <div className="site-footer">
+      <div className="container">
+        <footer className="row row-cols-1 row-cols-sm-2 row-cols-md-5 py-5 mt-5 border-top">
+          <div className="col mb-3">
+            <a href="/" className="d-flex align-items-center mb-3 link-body-emphasis text-decoration-none">
+            <img src={uconnLogo} alt="UConn Logo" className="d-inline-block h-auto" style={{ width: '300px' }} />
+            </a>
+            <p className="text-body-secondary">© 2024</p>
+          </div>
+
+          <div className="col mb-3">
+
+          </div>
+
+          <div className="col mb-3">
+            <h5>Section</h5>
+            <ul className="nav flex-column">
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Home</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Features</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Pricing</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">FAQs</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">About</a></li>
+            </ul>
           </div>
+
+          <div className="col mb-3">
+            <h5>Section</h5>
+            <ul className="nav flex-column">
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Home</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Features</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Pricing</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">FAQs</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">About</a></li>
+            </ul>
+          </div>
+
+          <div className="col mb-3">
+            <h5>Section</h5>
+            <ul className="nav flex-column">
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Home</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Features</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">Pricing</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">FAQs</a></li>
+              <li className="nav-item mb-2"><a href="#" className="nav-link p-0 text-body-secondary">About</a></li>
+            </ul>
+          </div>
+        </footer>
+        </div>
         </div>
-      </footer>
     </>
   );
 }

diff --git a/src/Navbar.jsx b/src/Navbar.jsx
@@ -1,12 +1,16 @@
-import { Link } from "react-router-dom";
-import { useState } from 'react';
+import { Link } from "react-router-dom"
+import { useState } from 'react'
+import uconnLogo from './assets/University_of_Connecticut_logo.svg'
+
 const Navbar = () => {
   const [isNavCollapsed, setIsNavCollapsed] = useState(true);
   const handleNavCollapse = () => setIsNavCollapsed(!isNavCollapsed);
   return (
     <nav className="navbar navbar-expand-lg bg-body-tertiary d-flex w-100">
         <div className="container px-2 px-lg-3 px-xl-5">
-          <a className="navbar-brand" href="#">Navbar</a>
+          <a className="navbar-brand" href="/">
+            <img src={uconnLogo} alt="UConn Logo" className="d-inline-block h-auto" style={{ width: '100px' }} />
+          </a>
           <button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded={!isNavCollapsed ? true : false} aria-label="Toggle navigation" onClick={handleNavCollapse}>
             <span className="navbar-toggler-icon"></span>
           </button>

diff --git a/src/UConnFooter.jsx b/src/UConnFooter.jsx
@@ -5,7 +5,7 @@ function UConnFooter() {
   return (
     <>
       <div id="footers">
-        <footer id="footer" className="site-footer" role="contentinfo">
+        <footer id="footer" className="uconn-footer" role="contentinfo">
           <div className="container">
             <ul id="uc-footer-links" className="clearfix">
               <li>

diff --git a/src/assets/University_of_Connecticut_logo.svg b/src/assets/University_of_Connecticut_logo.svg