From 79854ba98a59341b11393a8cd4e974268539c578 Mon Sep 17 00:00:00 2001 From: Phill Pover Date: Sat, 5 Apr 2025 08:57:25 +0100 Subject: [PATCH] Adding navigation and sidebar --- ...q0DIjV20oJI00e3QXLYIGN.jpg:Zone.Identifier | 4 ++ frontend/public/images/logo.jpg.jpg | Bin 0 -> 12388 bytes .../src/app/components/navigation/index.tsx | 20 +++++++ .../components/navigation/navbar/button.tsx | 6 ++ .../components/navigation/navbar/index.tsx | 47 +++++++++++++++ .../app/components/navigation/navbar/logo.tsx | 56 ++++++++++++++++++ .../components/navigation/sidebar/index.tsx | 56 ++++++++++++++++++ frontend/src/app/globals.css | 29 +-------- frontend/src/app/layout.tsx | 2 + 9 files changed, 194 insertions(+), 26 deletions(-) create mode 100644 frontend/public/images/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg:Zone.Identifier create mode 100644 frontend/public/images/logo.jpg.jpg create mode 100644 frontend/src/app/components/navigation/index.tsx create mode 100644 frontend/src/app/components/navigation/navbar/button.tsx create mode 100644 frontend/src/app/components/navigation/navbar/index.tsx create mode 100644 frontend/src/app/components/navigation/navbar/logo.tsx create mode 100644 frontend/src/app/components/navigation/sidebar/index.tsx diff --git a/frontend/public/images/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg:Zone.Identifier b/frontend/public/images/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg:Zone.Identifier new file mode 100644 index 0000000..04cce26 --- /dev/null +++ b/frontend/public/images/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg:Zone.Identifier @@ -0,0 +1,4 @@ +[ZoneTransfer] +ZoneId=3 +ReferrerUrl=https://t4.ftcdn.net/jpg/01/06/47/61/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg +HostUrl=https://t4.ftcdn.net/jpg/01/06/47/61/360_F_106476142_zMZkkTkhMeq0DIjV20oJI00e3QXLYIGN.jpg diff --git a/frontend/public/images/logo.jpg.jpg b/frontend/public/images/logo.jpg.jpg new file mode 100644 index 0000000000000000000000000000000000000000..0a48677fa70e65d51d98fa3b06fad39a9a18ac16 GIT binary patch literal 12388 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 wa_F;RWoJPvpD8J`Kzh_1ub)SVE_OC literal 0 HcmV?d00001 diff --git a/frontend/src/app/components/navigation/index.tsx b/frontend/src/app/components/navigation/index.tsx new file mode 100644 index 0000000..903b7a4 --- /dev/null +++ b/frontend/src/app/components/navigation/index.tsx @@ -0,0 +1,20 @@ +"use client"; +import { useState } from "react"; +import Navbar from "./navbar"; +import Sidebar from "./sidebar"; + +const Navigation = () => { + // toggle sidebar + const [isOpen, setIsOpen] = useState(false); + const toggle = () => { + setIsOpen(!isOpen); + }; + return ( + <> + + + + ); +}; + +export default Navigation; diff --git a/frontend/src/app/components/navigation/navbar/button.tsx b/frontend/src/app/components/navigation/navbar/button.tsx new file mode 100644 index 0000000..a2a7866 --- /dev/null +++ b/frontend/src/app/components/navigation/navbar/button.tsx @@ -0,0 +1,6 @@ +const Button = () => { + return ( + + ); +}; +export default Button; diff --git a/frontend/src/app/components/navigation/navbar/index.tsx b/frontend/src/app/components/navigation/navbar/index.tsx new file mode 100644 index 0000000..4a59aee --- /dev/null +++ b/frontend/src/app/components/navigation/navbar/index.tsx @@ -0,0 +1,47 @@ +import React from "react"; +import Link from "next/link"; +import Logo from "./logo"; +import Button from "./button"; + +const Navbar = ({ toggle }: { toggle: () => void }) => { + return ( + <> +
+
+
+ + +
    +
  • + +

    Albums

    + +
    • +
+
+
+
+
+
+ + ); +}; + +export default Navbar; diff --git a/frontend/src/app/components/navigation/navbar/logo.tsx b/frontend/src/app/components/navigation/navbar/logo.tsx new file mode 100644 index 0000000..760c2b0 --- /dev/null +++ b/frontend/src/app/components/navigation/navbar/logo.tsx @@ -0,0 +1,56 @@ +"use client"; +import Image from "next/image"; +import { useEffect, useState } from "react"; +import Link from "next/link"; +import Button from "./button"; + +const Logo = () => { + const [width, setWidth] = useState(0); + + const updateWidth = () => { + const newWidth = window.innerWidth; + setWidth(newWidth); + }; + + useEffect(() => { + window.addEventListener("resize", updateWidth); + updateWidth(); + }, []); + + const [showButton, setShowButton] = useState(false); + + const changeNavButton = () => { + if (window.scrollY >= 400 && window.innerWidth < 768) { + setShowButton(true); + } else { + setShowButton(false); + } + }; + + useEffect(() => { + window.addEventListener("scroll", changeNavButton); + }, []); + + return ( + <> + + Logo + +
+
+ + ); +}; + +export default Logo; diff --git a/frontend/src/app/components/navigation/sidebar/index.tsx b/frontend/src/app/components/navigation/sidebar/index.tsx new file mode 100644 index 0000000..27294aa --- /dev/null +++ b/frontend/src/app/components/navigation/sidebar/index.tsx @@ -0,0 +1,56 @@ +import Link from "next/link"; + +const Sidebar = ({ + isOpen, + toggle, +}: { + isOpen: boolean; + toggle: () => void; +}): React.JSX.Element => { + return ( + <> +
+ + +
    +
  • + +

    About Us

    + +
    • +
  • + +

    Services

    + +
    • +
  • + +

    Contacts

    + +
    • +
+
+ + ); +}; + +export default Sidebar; diff --git a/frontend/src/app/globals.css b/frontend/src/app/globals.css index a2dc41e..b5c61c9 100644 --- a/frontend/src/app/globals.css +++ b/frontend/src/app/globals.css @@ -1,26 +1,3 @@ -@import "tailwindcss"; - -:root { - --background: #ffffff; - --foreground: #171717; -} - -@theme inline { - --color-background: var(--background); - --color-foreground: var(--foreground); - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); -} - -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } -} - -body { - background: var(--background); - color: var(--foreground); - font-family: Arial, Helvetica, sans-serif; -} +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx index 0593c0f..c5a3730 100644 --- a/frontend/src/app/layout.tsx +++ b/frontend/src/app/layout.tsx @@ -1,6 +1,7 @@ import type { Metadata } from "next"; import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; +import Navigation from './components/navigation'; const geistSans = Geist({ variable: "--font-geist-sans", @@ -27,6 +28,7 @@ export default function RootLayout({ + {children}