From 180c9577f8337991ca71470816333fe8430cd3ca Mon Sep 17 00:00:00 2001
From: real-zephex <zephex-1@outlook.com>
Date: Fri, 24 May 2024 22:51:36 +0530
Subject: =?UTF-8?q?=E2=9C=A8=20feat(ui):=20=F0=9F=8E=A8=20migrate=20from?=
 =?UTF-8?q?=20vanilla=20css=20to=20tailwind=20css,=20adopted=20next=20ui?=
 =?UTF-8?q?=20and=20restructured?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/components/header/header.jsx | 53 ++++++++++++++++++++++++------------
 1 file changed, 35 insertions(+), 18 deletions(-)

(limited to 'src/app/components/header')

diff --git a/src/app/components/header/header.jsx b/src/app/components/header/header.jsx
index 9e5fc69..3c7db2e 100644
--- a/src/app/components/header/header.jsx
+++ b/src/app/components/header/header.jsx
@@ -1,26 +1,43 @@
 import Link from "next/link";
 import styles from "../../page.module.css";
+import { ThemeSwitcher } from "../themeSwitcher";
 
 export default async function Header() {
 	return (
-		<main className={styles.main}>
-			<div className={styles.header}>
-				<div className={styles.left}>
-					<Link
-						href={"/"}
-						style={{ textDecoration: "none", color: "white" }}
-					>
-						<p>Dramalama</p>
-					</Link>
-				</div>
-				<div className={styles.right}>
-					<Link href="/anime">Anime</Link>
-					<Link href="/kdrama">Kdrama</Link>
-					<Link href="/manga">Manga</Link>
-					<Link href="/movies">Movies</Link>
-					<Link href="/web-series">Series</Link>
-				</div>
+		<div className="fixed top-0 w-full flex items-center justify-between z-50  dark:bg-black bg-white">
+			<h4 className="text-teal-400 text-2xl p-2">
+				<Link href={"/"}>Dramalama</Link>
+			</h4>
+			<div
+				className={`mx-2 flex items-center overflow-auto ${styles.ScrollBarAdjuster}`}
+			>
+				<ThemeSwitcher />
+
+				<Link href={"/anime"} className="mx-2 hover:text-sky-400">
+					<p>Anime</p>
+				</Link>
+				<Link href={"/kdrama"} className="mx-2 hover:text-sky-400">
+					<p>Kdrama</p>
+				</Link>
+				<Link
+					href={"/components/workInProgress/"}
+					className="mx-2 hover:text-sky-400"
+				>
+					<p>Manga</p>
+				</Link>
+				<Link
+					href={"/components/workInProgress/"}
+					className="mx-2 hover:text-sky-400"
+				>
+					<p>Series</p>
+				</Link>
+				<Link
+					href={"/components/workInProgress/"}
+					className="mx-2 hover:text-sky-400"
+				>
+					<p>Movies</p>
+				</Link>
 			</div>
-		</main>
+		</div>
 	);
 }
-- 
cgit v1.2.3