From 358f8057f5967019a01c21f32f9993358e735860 Mon Sep 17 00:00:00 2001
From: Naresh <ghostwriternr@gmail.com>
Date: Fri, 6 Sep 2024 14:18:35 +0100
Subject: [PATCH] Make the navbar retro styled

Testing copilot workspace

---

For more details, open the [Copilot Workspace session](https://copilot-workspace.githubnext.com/codestoryai/website?shareId=XXXX-XXXX-XXXX-XXXX).
---
 app/globals.css       | 17 +++++++++++++++++
 components/header.tsx |  2 +-
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/app/globals.css b/app/globals.css
index 4ae7b89..54e66aa 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -49,3 +49,20 @@ html {
     @apply bg-background text-foreground;
   }
 }
+
+/* Retro styling for navbar */
+.retro-navbar {
+  background-color: #f4f4f4;
+  font-family: 'Courier New', Courier, monospace;
+  border: 2px solid #000;
+}
+
+.retro-navbar a {
+  color: #000;
+  text-decoration: none;
+}
+
+.retro-navbar a:hover {
+  color: #ff0000;
+  text-decoration: underline;
+}
diff --git a/components/header.tsx b/components/header.tsx
index cec33ab..48e48bb 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -25,7 +25,7 @@ interface HeaderProps {
 
 export default function Header({ user, logoSuffix }: HeaderProps) {
   return (
-    <div className="absolute w-screen">
+    <div className="absolute w-screen retro-navbar">
       <div className="max-w-screen-2xl m-auto p-8 md:p-12 flex items-center justify-between text-2xl">
         <div className="flex items-center">
           <Link className="flex items-center" href="/">