From a85d42d47a3bd85ef23336882582cec69dd1fbdf Mon Sep 17 00:00:00 2001 From: Steven Sparks Date: Sat, 24 Feb 2024 21:17:09 -0500 Subject: [PATCH 1/9] Complete HamburgerNav css --- apps/frontend/src/app/UIContext.tsx | 25 +++ apps/frontend/src/app/app.module.scss | 122 ------------ apps/frontend/src/app/app.tsx | 22 ++- .../components/hamburger-nav/HamburgerNav.tsx | 138 ++++--------- .../components/hamburger-nav/hamburger.css | 125 ++++++------ .../src/app/views/dashboard/Dashboard.tsx | 97 +++++---- .../src/app/views/dashboard/dashboard.css | 186 +++++++++--------- 7 files changed, 278 insertions(+), 437 deletions(-) create mode 100644 apps/frontend/src/app/UIContext.tsx diff --git a/apps/frontend/src/app/UIContext.tsx b/apps/frontend/src/app/UIContext.tsx new file mode 100644 index 0000000..329182f --- /dev/null +++ b/apps/frontend/src/app/UIContext.tsx @@ -0,0 +1,25 @@ +import React, { createContext, useState, ReactNode } from 'react'; + +interface UIContextType { + displaySideBar: boolean; + toggleSideBar: () => void; +} + +export const UIContext = createContext({ + displaySideBar: false, + toggleSideBar: () => {} +}); + + + +export const UIProvider = ({ children }: { children: ReactNode }) => { + const [displaySideBar, setDisplaySideBar] = useState(false); + + const toggleSideBar = () => setDisplaySideBar(prev => !prev); + + return ( + + {children} + + ); +}; diff --git a/apps/frontend/src/app/app.module.scss b/apps/frontend/src/app/app.module.scss index b97e6c0..4e8ba03 100644 --- a/apps/frontend/src/app/app.module.scss +++ b/apps/frontend/src/app/app.module.scss @@ -11,125 +11,3 @@ body { grid-template-rows: 40px 137px 98px 66px 116px 66px 96px 106px; } -.dashboard-root { - width: 100%; - height: auto; - background-color: white; - display: flex; - flex-direction: column; - justify-content: space-between; - gap: 0; - padding: 0; - border-radius: 0; -} - -.dashboard-content { - padding-top: 5vh; - display: grid; - grid-template-rows: auto 1fr 1fr 1fr; - grid-template-columns: 1fr; - height: 100vh; - grid-row: 3 / span 10; - grid-column: 1 / span 1; - display: flex; - flex-direction: column; - align-items: center; - gap: 5vh; -} - -.hamburger-menu-section { - padding-top: 8vh; - grid-row: 1 / span 1; - grid-column: 1 / span 1; - width: 80%; - align-items: center; -} - -.profile-image { - width: 2rem; - border-radius: 0.75rem; -} - -.greeting-text { - font-size: 2rem; - margin-top: 1rem; - text-align: center; - font-weight: 500; -} - -.net-worth-section { - display: flex; - flex-direction: column; - margin-left: 20px; - gap: 6px; - justify-content: center; - font-family: 'Raleway', sans-serif; -} - -.net-worth-value { - font-size: 2rem; - font-weight: 800; - text-align: center; -} - -.net-worth-label { - font-family: 'Raleway', sans-serif; - width: 100%; - font-size: 1.5rem; - font-weight: 300; - justify-content: center; - text-align: center; -} - -.buttons-section { - display: flex; - flex-direction: column; - justify-content: center; - gap: 1.5rem; - width: 75%; - align-items: center; - text-align: center; -} - -.dashboard-button { - font-size: 1rem; - font-weight: bold; - font-family: 'Sofia Pro', sans-serif; - color: white; - background-color: #148cfb; - display: flex; - flex-direction: column; - justify-content: center; - width: 100%; - height: 3rem; - cursor: pointer; - align-items: center; - text-align: center; - border-radius: 100px; -} - -.dashboard-button:hover { - font-size: 1.5rem; -} - -.first-time-user-text { - padding: 50px; - margin-top: 10vh; - font-family: 'Sofia Pro', sans-serif; - font-size: 1rem; - font-weight: 800; - letter-spacing: 0px; - text-align: center; - display: flex; - justify-content: center; - align-items: center; - border-width: 2px; - padding: 0.5rem 1rem; - height: 2rem; - border-color: black; - border-radius: 20px; -} - -.first-time-user-text:hover { - text-decoration: underline; -} \ No newline at end of file diff --git a/apps/frontend/src/app/app.tsx b/apps/frontend/src/app/app.tsx index 490b35d..03937ff 100644 --- a/apps/frontend/src/app/app.tsx +++ b/apps/frontend/src/app/app.tsx @@ -1,5 +1,6 @@ import React, { useEffect } from 'react'; import { BrowserRouter } from 'react-router-dom'; +import { UIProvider } from './UIContext'; import Footer from './components/footer/footer'; // import Header from './components/header/header'; import Router from './views/router/router'; @@ -14,7 +15,6 @@ export function App() { const [user, setUser] = React.useState({firstName: null, lastName: null, id: null, joinDate: null, email: null, userType: 'Reader', picture: null, name: null, roles: ['None']}); - useEffect(() => { const user = localStorage.getItem('user'); if(user){ @@ -38,15 +38,17 @@ export function App() { return ( - -
-
- {/*
*/} - -
-
-
- + + +
+
+ {/*
*/} + +
+
+
+ + ); } diff --git a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx index e1f0d8b..51fdd41 100644 --- a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx +++ b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx @@ -1,127 +1,61 @@ -// import './hamburger.css'; -// import hamburgerMenu from '../../images/dash/hamburger_menu.svg'; +import React, { useContext } from 'react' import crystalBall from '../../images/dash/crystal-ball.svg' import lineList from '../../images/dash/line-md_list-3-filled.svg' -import image103 from '../../images/logos/loginGroup103.svg' -import hamburger_menu from '../../images/dash/hamburger_menu.svg' -import hankHill from '../../images/dash/Hank_Hill.webp' import { Link } from "react-router-dom"; -import path from 'path' +import { UIContext } from '../../UIContext'; +import './hamburger.css' + + export default function HamburgerNav() { + + const { toggleSideBar } = useContext(UIContext); + return ( -
+
toggleSideBar()}>
-
-
-
-
-
-
-
- Linemdlistfilled -
-
- L{" "} -
-
+
+
+
+
W
+ lineList +
L
+
" " CrystalBall +
-
-
- Dashboard +
+
+ Dashboard
-
- Cash Flow +
+ Cash Flow
-
- Assets +
+ Assets
-
- Liabilities +
+ Liabilities
-
- Logout +
+ Logout
-
- Settings +
+ Settings
- -
- -
- -
-
-
- top_image - -
- - - Frame2 -
- - -
-
Hi, Bsmith
-
-
-
###.##
-
Net worth
-
-
- - -
-
-
-
- First Time User ?
-
) } diff --git a/apps/frontend/src/app/components/hamburger-nav/hamburger.css b/apps/frontend/src/app/components/hamburger-nav/hamburger.css index 80cbfb2..5558ad8 100644 --- a/apps/frontend/src/app/components/hamburger-nav/hamburger.css +++ b/apps/frontend/src/app/components/hamburger-nav/hamburger.css @@ -1,86 +1,91 @@ -.nav { - position: fixed; - z-index: 200px; + +.opaque-container{ + position: absolute; + inset:0; + inset: 0; + width: 100%; + height: 100%; + background-color: #333333; + opacity: 0.5; } -.navbar { - background: #ff0000; - position: relative; - top: 85px; +.fly-out-menu-root { + + background-color: black; + position: absolute; left: 0; - width: 100%; + top: 0; display: flex; - justify-content: space-between; - align-items: center; - padding: -2em; -} + flex-direction: column; + gap: 5%; + width: 50%; + height: 100%; -.menu-toggle { - cursor: pointer; } -.nav-overlay { - position: fixed; - background: #18181c; - z-index: -2; - top: -100%; - left: 0; +.trademark-container { + padding-top: 25%; + display: flex; + align-items: center; width: 100%; - height: 100vh; - overflow: hidden; - padding: 4em; - transition: all 2s cubic-bezier(0.16, 1, 0, 0.3, 1); + align-items: space-around; + justify-content: center; + gap: 1rem; } -.hamBox { - position: relative; - top: -10px; - width: 44px; - height: 44px; - cursor: pointer; - border-radius: 50%; - transition: 1s ease; - padding: 2.4em; +.trademark-image { + font-size: large; + color: white; } -.hambox:hover { - background: 2a2a2f; + +.trademark-letter { + font-size: large; + color: white; + margin-top: 0.25rem; } -.hamBoxOpen { - background: 2a2a2f; +.vertical-line { + position: relative; + display: flex; } -.lineTop, -.lineBottom { - margin: 0 auto; +.vertical-line::before { + content: ''; position: absolute; - display: block; - width: 24px; - height: 2px; - border-radius: 10px; - background: #ff0000; + top: 0; + bottom: 0; left: 0; - right: 0; - transform: rotate(0deg); - transition: all 0.4s; + width: 1px; + background-color: rgb(255, 255, 255); } -.lineTop { - top: 2.2em; +.trademark-symbol { + margin-top: 0.25rem; + width: 1.25rem; } -.lineBottom { - bottom: 2.2em; +.link-container { + position: relative; + display: flex; + flex-direction: column; + width: 100%; + font-family: 'Sofia_Pro', sans-serif; + align-items: center; + justify-content: center; } -.lineTop .spin { - top: 2.35em; - transform: rotate(135deg); - background: black; +.hamburger-link { + font-weight: bold; + color: white; + border-top: 1px solid #6f6f6f; + width: 100%; + height: 2.5rem; + display: flex; + align-items: center; + justify-content: center; } -.lineBottom .spin { - top: 2.35em; - transform: rotate(225deg); - background: black; + +.hamburger-link:hover { + text-decoration: underline; } diff --git a/apps/frontend/src/app/views/dashboard/Dashboard.tsx b/apps/frontend/src/app/views/dashboard/Dashboard.tsx index 3acd79a..a75ec26 100644 --- a/apps/frontend/src/app/views/dashboard/Dashboard.tsx +++ b/apps/frontend/src/app/views/dashboard/Dashboard.tsx @@ -1,68 +1,67 @@ -import { useState } from "react"; +// Dashboard.js +import React, { useContext } from 'react'; import { AuthLayout } from '../../components/authlayout/AuthLayout'; import hamburger_menu from '../../images/dash/hamburger_menu.svg'; import hankHill from '../../images/dash/Hank_Hill.webp'; -import image103 from '../../images/logos/loginGroup103.svg'; import HamburgerNav from "../../components/hamburger-nav/HamburgerNav"; -import styles from '../../app.module.scss'; +import { UIContext } from '../../UIContext'; +import './dashboard.css'; export const Dashboard = () => { - const [isOpen, setIsOpen] = useState(false); + const { displaySideBar, toggleSideBar } = useContext(UIContext); return ( - {!isOpen ? ( -
-
- -
-
+ e.preventDefault()}> + {/*
+ +
*/} + {displaySideBar && } +
+ +
+
+ Frame2 -
Hi, Bsmith
+
Hi, Bsmith
-
-
###.##
-
Net worth
-
+
+
###.##
+
Net worth
+
-
- - - -
+
+ + +
- - ) : ( -
setIsOpen(!isOpen)}> -
- )} + ); }; diff --git a/apps/frontend/src/app/views/dashboard/dashboard.css b/apps/frontend/src/app/views/dashboard/dashboard.css index 3ce6c39..f8f1f62 100644 --- a/apps/frontend/src/app/views/dashboard/dashboard.css +++ b/apps/frontend/src/app/views/dashboard/dashboard.css @@ -1,136 +1,134 @@ -/* .page { - display: grid; - grid-template-rows: 40px 137px 98px 66px 116px 66px 96px 106px; -} -.burger { +.dashboard-root { + width: 100%; + height: auto; + background-color: white; display: flex; - align-items: left; + flex-direction: column; + justify-content: space-between; + gap: 0; + padding: 0; + border-radius: 0; } -.bsmith { +.dashboard-content { + padding-top: 5vh; + display: grid; + grid-template-rows: auto 1fr 1fr 1fr; + grid-template-columns: 1fr; + height: 100vh; + grid-row: 3 / span 10; + grid-column: 1 / span 1; display: flex; + flex-direction: column; align-items: center; + gap: 5vh; } -.text { - display: flex; - justify-content: center; + +.hamburger-menu-section { + padding-top: 8vh; + grid-row: 1 / span 1; + grid-column: 1 / span 1; + width: 80%; align-items: center; } -.networth { - display: flex; - justify-content: center; - align-items: center; - display: inline-flex; - padding: 17px 106px 16px 105px; + +.profile-image { + width: 2rem; + border-radius: 0.75rem; } -.profile_dash { - flex-shrink: 0; - border-radius: 100px; - width: 50px; - height: 50px; +.greeting-text { + font-size: 2rem; + margin-top: 1rem; + text-align: center; + font-weight: 500; } -.profile-dash-div { - position: relative; +.net-worth-section { display: flex; + flex-direction: column; + margin-left: 20px; + gap: 6px; justify-content: center; + font-family: 'Raleway', sans-serif; } -.greeting-text { - color: #000; - font-feature-settings: "clig" off, "liga" off; - font-family: FONTSPRING DEMO - Capitana Medium; - font-size: 35px; - font-style: normal; - font-weight: 500; - line-height: normal; - display: flex; +.net-worth-value { + font-size: 2rem; + font-weight: 800; + text-align: center; +} + +.net-worth-label { + font-family: 'Raleway', sans-serif; + width: 100%; + font-size: 1.5rem; + font-weight: 300; justify-content: center; - padding: 20px; + text-align: center; } -.balance { +.buttons-section { display: flex; - padding: 17px 106px 16px 105px; + flex-direction: column; justify-content: center; + gap: 1.5rem; + width: 75%; align-items: center; - border-radius: 100px; - background: var(--Primary-Blue, #148cfb); - border-radius: 100px; - background: var(--Primary-Blue, #148cfb); - width: 345px; + text-align: center; } -.cash-flow { +.dashboard-button { + font-size: 1rem; + font-weight: bold; + font-family: 'Sofia Pro', sans-serif; + color: white; + background-color: #148cfb; display: flex; - width: 345px; - padding: 17px 0px 16px 10px; + flex-direction: column; justify-content: center; + width: 100%; + height: 3rem; + cursor: pointer; align-items: center; + text-align: center; border-radius: 100px; - background: var(--Primary-Blue, #148cfb); } -.page-font { - display: flex; - justify-content: center; - align-items: center; - color: #000; - font-feature-settings: "clig" off, "liga" off; - font-family: Sofia Pro; - font-size: 35px; - font-style: normal; - font-weight: 300; - line-height: normal; +.dashboard-button:hover { + font-size: 1.5rem; } -.numbers-font { +.first-time-user-text { + padding: 50px; + margin-top: 10vh; + font-family: 'Sofia Pro', sans-serif; + font-size: 1rem; + font-weight: 800; + letter-spacing: 0px; + text-align: center; display: flex; justify-content: center; align-items: center; - color: #000; - font-feature-settings: "clig" off, "liga" off; - font-family: Sofia Pro; - font-size: 48px; - font-style: normal; - font-weight: 800; - line-height: normal; + border-width: 2px; + padding: 0.5rem 1rem; + height: 2rem; + border-color: black; + border-radius: 20px; } -.btn-font { - color: #fff; - font-feature-settings: "clig" off, "liga" off; - font-family: Sofia Pro; - font-size: 20px; - font-style: normal; - font-weight: 800; - line-height: normal; -} - -.userBtn { - display: inline-flex; - justify-content: center; - align-items: center; - gap: 10px; +.first-time-user-text:hover { + text-decoration: underline; } -.image-103 { +.dashboard-root { display: flex; - justify-content: center; -} */ - -@media only screen and (min-width: 834px min-height: 1192px) { - /* Tablet */ - #HomePageDashboardRoot { - color: green; - padding: 1000px; - } + position: relative; +} - #hello { - width: 179px; - height: 52px; - top: 104px; - left: 83px; - } +.hamburger-button { + position: absolute; + top: 20px; /* Adjust as needed */ + left: 20px; /* Adjust as needed */ + z-index: 100; } From 977564c6805adca07756f03eeca564aaf5fe9e4b Mon Sep 17 00:00:00 2001 From: Steven Sparks Date: Sun, 25 Feb 2024 12:54:01 -0500 Subject: [PATCH 2/9] Update sideBar slide out time --- apps/frontend/src/app/app.module.scss | 20 ++-- apps/frontend/src/app/app.tsx | 2 +- .../app/components/authlayout/AuthLayout.tsx | 26 ++--- .../components/hamburger-nav/HamburgerNav.tsx | 110 +++++++++--------- .../components/hamburger-nav/hamburger.css | 26 ++++- .../src/app/views/dashboard/Dashboard.tsx | 5 +- .../src/app/views/dashboard/dashboard.css | 2 + 7 files changed, 100 insertions(+), 91 deletions(-) diff --git a/apps/frontend/src/app/app.module.scss b/apps/frontend/src/app/app.module.scss index 4e8ba03..d70bca4 100644 --- a/apps/frontend/src/app/app.module.scss +++ b/apps/frontend/src/app/app.module.scss @@ -1,13 +1,13 @@ /* Your styles goes here. */ -body { - min-height: 100vh; - display: flex; - flex-direction: column; -} +// body { +// min-height: 100vh; +// display: flex; +// flex-direction: column; +// } -.page { - height: 100vh; - display: grid; - grid-template-rows: 40px 137px 98px 66px 116px 66px 96px 106px; -} +// .page { +// height: 100vh; +// display: grid; +// grid-template-rows: 40px 137px 98px 66px 116px 66px 96px 106px; +// } diff --git a/apps/frontend/src/app/app.tsx b/apps/frontend/src/app/app.tsx index 03937ff..b0e4636 100644 --- a/apps/frontend/src/app/app.tsx +++ b/apps/frontend/src/app/app.tsx @@ -45,7 +45,7 @@ export function App() { {/*
*/}
-
+ {/*
*/}
diff --git a/apps/frontend/src/app/components/authlayout/AuthLayout.tsx b/apps/frontend/src/app/components/authlayout/AuthLayout.tsx index 68c5d24..36ea910 100644 --- a/apps/frontend/src/app/components/authlayout/AuthLayout.tsx +++ b/apps/frontend/src/app/components/authlayout/AuthLayout.tsx @@ -4,21 +4,19 @@ import backgroundImage from './background-auth.jpg' export function AuthLayout({ children }: any) { return ( - <> -
-
-
- {children} -
-
-
- blue background +
+
+
+ {children}
- +
+ blue background +
+
) } \ No newline at end of file diff --git a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx index 51fdd41..641e455 100644 --- a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx +++ b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx @@ -1,61 +1,59 @@ -import React, { useContext } from 'react' -import crystalBall from '../../images/dash/crystal-ball.svg' -import lineList from '../../images/dash/line-md_list-3-filled.svg' -import { Link } from "react-router-dom"; +// HamburgerNav.js +import React, { useContext } from 'react'; +import crystalBall from '../../images/dash/crystal-ball.svg'; +import lineList from '../../images/dash/line-md_list-3-filled.svg'; +import { Link } from 'react-router-dom'; import { UIContext } from '../../UIContext'; -import './hamburger.css' - - +import './hamburger.css'; export default function HamburgerNav() { + const { displaySideBar, toggleSideBar } = useContext(UIContext); - const { toggleSideBar } = useContext(UIContext); - - return ( -
toggleSideBar()}> -
-
-
-
-
W
- lineList -
L
-
" " - CrystalBall -
-
-
-
- Dashboard -
-
- Cash Flow -
-
- Assets -
-
- Liabilities -
-
- Logout -
-
- Settings -
-
-
-
-
- ) + return ( +
toggleSideBar()} + > + +
+ ); } diff --git a/apps/frontend/src/app/components/hamburger-nav/hamburger.css b/apps/frontend/src/app/components/hamburger-nav/hamburger.css index 5558ad8..5872c3b 100644 --- a/apps/frontend/src/app/components/hamburger-nav/hamburger.css +++ b/apps/frontend/src/app/components/hamburger-nav/hamburger.css @@ -1,7 +1,24 @@ +/* hamburger.css */ +.nav-container { + position: absolute; + top: 0; + left: 0; + width: 250px; /* Adjust as needed */ + height: 100%; + background-color: black; + transition: transform 1s ease; +} -.opaque-container{ +.showSideBar { + transform: translateX(0); +} + +.hideSideBar { + transform: translateX(-250px); /* Adjust as needed */ +} + +.opaque-container { position: absolute; - inset:0; inset: 0; width: 100%; height: 100%; @@ -10,7 +27,6 @@ } .fly-out-menu-root { - background-color: black; position: absolute; left: 0; @@ -18,9 +34,8 @@ display: flex; flex-direction: column; gap: 5%; - width: 50%; + width: 100%; /* Adjust as needed */ height: 100%; - } .trademark-container { @@ -38,7 +53,6 @@ color: white; } - .trademark-letter { font-size: large; color: white; diff --git a/apps/frontend/src/app/views/dashboard/Dashboard.tsx b/apps/frontend/src/app/views/dashboard/Dashboard.tsx index a75ec26..bccec50 100644 --- a/apps/frontend/src/app/views/dashboard/Dashboard.tsx +++ b/apps/frontend/src/app/views/dashboard/Dashboard.tsx @@ -13,10 +13,7 @@ export const Dashboard = () => { return (
e.preventDefault()}> - {/*
- -
*/} - {displaySideBar && } +
-
- - onMenuItemClick('home')} - > - - - -
- Sign In - {hasAdminAccess && ( -
-
- -
- +
- {showMobileMenu && ( -
-
- onMenuItemClick('home')} - className={classNames( - 'home' === currentHeader - ? `bg-gray-200` - : `border-transparent`, - 'block pl-3 pr-4 py-2 border-l-4 text-base font-medium' - )} - aria-current={ - 'home' === currentHeader ? 'page' : undefined - } - role="menuitem" - > - Home - - onMenuItemClick('blogs')} - className={classNames( - 'blogs' === currentHeader - ? `bg-gray-200` - : `border-transparent`, - 'block pl-3 pr-4 py-2 border-l-4 text-base font-medium w-full' - )} - aria-current={ - 'blogs' === currentHeader ? 'page' : undefined - } - role="menuitem" - > - Blogs - + +
  • + onMenuItemClick("assets")} + > + Assets + +
    • +
  • + onMenuItemClick("liabilities")} + > + Liabilities + +
    • +
    - )} - - -
    - ) - } \ No newline at end of file + + + + ) +} \ No newline at end of file diff --git a/apps/frontend/src/app/views/assets/Assets.tsx b/apps/frontend/src/app/views/assets/Assets.tsx index f22b5be..b8a1f81 100644 --- a/apps/frontend/src/app/views/assets/Assets.tsx +++ b/apps/frontend/src/app/views/assets/Assets.tsx @@ -44,28 +44,6 @@ export const Assets = () => { }, [inputs]); return ( - {!isOpen ? ( -
    - -
    - Frame2 -
    -
    - ) : ( -
    setIsOpen(!isOpen)}> - -
    - )}

    diff --git a/apps/frontend/src/app/views/assets/AssetsInput.tsx b/apps/frontend/src/app/views/assets/AssetsInput.tsx index 502606d..67bce86 100644 --- a/apps/frontend/src/app/views/assets/AssetsInput.tsx +++ b/apps/frontend/src/app/views/assets/AssetsInput.tsx @@ -17,28 +17,6 @@ export const AssetsInput = () => { } return ( - {!isOpen ? ( -

    - -
    - Frame2 -
    -
    - ) : ( -
    setIsOpen(!isOpen)}> - -
    - )}

    diff --git a/apps/frontend/src/app/views/dashboard/Dashboard.tsx b/apps/frontend/src/app/views/dashboard/Dashboard.tsx index bccec50..bd0440d 100644 --- a/apps/frontend/src/app/views/dashboard/Dashboard.tsx +++ b/apps/frontend/src/app/views/dashboard/Dashboard.tsx @@ -1,28 +1,14 @@ // Dashboard.js -import React, { useContext } from 'react'; +import React from 'react'; import { AuthLayout } from '../../components/authlayout/AuthLayout'; -import hamburger_menu from '../../images/dash/hamburger_menu.svg'; import hankHill from '../../images/dash/Hank_Hill.webp'; -import HamburgerNav from "../../components/hamburger-nav/HamburgerNav"; -import { UIContext } from '../../UIContext'; import './dashboard.css'; export const Dashboard = () => { - const { displaySideBar, toggleSideBar } = useContext(UIContext); return ( e.preventDefault()}> - -

    - -
    Date: Tue, 27 Feb 2024 14:48:25 -0500 Subject: [PATCH 4/9] Complete header trademark --- .../components/hamburger-nav/HamburgerNav.tsx | 2 +- .../components/hamburger-nav/hamburger.css | 27 ++- .../src/app/components/header/header.css | 46 +++- .../src/app/components/header/header.tsx | 212 ++++++++++-------- .../src/app/views/dashboard/Dashboard.tsx | 2 +- 5 files changed, 186 insertions(+), 103 deletions(-) diff --git a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx index 4306130..a75304e 100644 --- a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx +++ b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx @@ -23,7 +23,7 @@ const HamburgerNav: React.FC = ({ show }) => { L
    - " " + " CrystalBall - + ) } \ No newline at end of file diff --git a/apps/frontend/src/app/views/dashboard/Dashboard.tsx b/apps/frontend/src/app/views/dashboard/Dashboard.tsx index bd0440d..22bd3d6 100644 --- a/apps/frontend/src/app/views/dashboard/Dashboard.tsx +++ b/apps/frontend/src/app/views/dashboard/Dashboard.tsx @@ -13,7 +13,7 @@ export const Dashboard = () => { Frame2
    Hi, Bsmith
    From 238c793601637221bff0cc58e504386ef6a56abc Mon Sep 17 00:00:00 2001 From: Steven Sparks Date: Tue, 27 Feb 2024 15:41:30 -0500 Subject: [PATCH 5/9] Update HamburgerNav trademark --- .../components/hamburger-nav/HamburgerNav.tsx | 14 ++--- .../components/hamburger-nav/hamburger.css | 56 ++++++++++--------- 2 files changed, 38 insertions(+), 32 deletions(-) diff --git a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx index a75304e..fcefe01 100644 --- a/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx +++ b/apps/frontend/src/app/components/hamburger-nav/HamburgerNav.tsx @@ -11,24 +11,24 @@ interface HamburgerNavProps { const HamburgerNav: React.FC = ({ show }) => { return ( -
    +