From 156b6afa35fbb7a4c9016d37064a5f70e623a9cc Mon Sep 17 00:00:00 2001 From: Dan Ko Date: Mon, 18 Sep 2023 19:47:01 -0400 Subject: [PATCH 1/6] adjust styles to make main page content adjust with sidebar --- src/app/layout.tsx | 9 +- src/app/page.tsx | 6 +- src/components/index.ts | 1 + src/components/navbar/Navbar.tsx | 2 +- src/components/sidebar/ExpandButton.tsx | 26 ++++ src/components/sidebar/PageButton.tsx | 51 ++++++++ src/components/sidebar/Sidebar.tsx | 136 ++++++++++++++++++++ src/components/sidebar/VoyagePageButton.tsx | 56 ++++++++ src/components/sidebar/VoyageStatus.tsx | 35 +++++ src/components/sidebar/index.ts | 4 + 10 files changed, 318 insertions(+), 8 deletions(-) create mode 100644 src/components/sidebar/ExpandButton.tsx create mode 100644 src/components/sidebar/PageButton.tsx create mode 100644 src/components/sidebar/Sidebar.tsx create mode 100644 src/components/sidebar/VoyagePageButton.tsx create mode 100644 src/components/sidebar/VoyageStatus.tsx create mode 100644 src/components/sidebar/index.ts diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f6ee4da7..ff79f8d9 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,7 +1,7 @@ import "./globals.css"; import type { Metadata } from "next"; import { Inter } from "next/font/google"; -import { StoreProvider, Navbar } from "@/components"; +import { StoreProvider, Navbar, Sidebar } from "@/components"; export const metadata: Metadata = { title: "Create Next App", @@ -23,8 +23,13 @@ export default function RootLayout({ return ( +
- {children} + + +
{children}
+ +
); diff --git a/src/app/page.tsx b/src/app/page.tsx index 8a077e13..ecbb0a8f 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -3,9 +3,5 @@ import { CounterPage } from "."; export default function Home() { - return ( -
- -
- ); + return ; } diff --git a/src/components/index.ts b/src/components/index.ts index 7c17c28d..154dce72 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -2,4 +2,5 @@ export { default as StoreProvider } from "./StoreProvider"; export { default as Avatar } from "./Avatar"; export { default as Button } from "./Button"; export { default as Banner } from "./Banner"; +export { default as Sidebar } from "./sidebar/Sidebar"; export * from "./navbar"; diff --git a/src/components/navbar/Navbar.tsx b/src/components/navbar/Navbar.tsx index f83d2fd5..18a732b3 100644 --- a/src/components/navbar/Navbar.tsx +++ b/src/components/navbar/Navbar.tsx @@ -5,7 +5,7 @@ const notificationCount = 4; export default function Navbar() { return ( -