create navbar

zsrobinson · zsrobinson · commit e6ab80dee21e · 2024-02-05T19:41:50.000-05:00
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,3 @@
 {
-  "cSpell.words": ["clsx", "tailwindcss"]
+  "cSpell.words": ["clsx", "Echolon", "tabler", "tailwindcss"]
 }
diff --git a/app/globals.css b/app/globals.css
@@ -64,6 +64,8 @@
       --border: 240 3.7% 15.9%;
       --input: 240 3.7% 15.9%;
       --ring: 240 4.9% 83.9%;
+
+      color-scheme: dark;
     }
   }
 }
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,6 +1,7 @@
 import type { Metadata } from "next";
 import "./globals.css";
 import { ReactNode } from "react";
+import { Navbar } from "~/components/navbar";
 
 export const metadata: Metadata = {
   title: "Create Next App",
@@ -10,7 +11,10 @@ export const metadata: Metadata = {
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <html lang="en">
-      <body>{children}</body>
+      <body>
+        <Navbar />
+        {children}
+      </body>
     </html>
   );
 }
diff --git a/app/page.tsx b/app/page.tsx
@@ -1,7 +1,9 @@
 export default function Page() {
   return (
     <main className="m-8">
-      <p>Hello world</p>
+      <h2 className="text-lg font-semibold">
+        Reduced Row Echolon Form Proof of Concept
+      </h2>
     </main>
   );
 }
diff --git a/components/navbar.tsx b/components/navbar.tsx
@@ -0,0 +1,21 @@
+import { IconBrackets, IconBrandGithub } from "@tabler/icons-react";
+import Link from "next/link";
+
+export function Navbar() {
+  return (
+    <div className="flex items-center justify-between border-b border-border bg-muted px-8 py-4 dark:bg-muted/30">
+      <Link href="/" className="flex items-center gap-2">
+        <IconBrackets />
+        <h1 className="text-xl font-bold">Concepts in Linear Algebra</h1>
+      </Link>
+
+      <a
+        href="https://github.com/zsrobinson/linear"
+        target="_blank"
+        rel="noreferrer"
+      >
+        <IconBrandGithub />
+      </a>
+    </div>
+  );
+}
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,7 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@radix-ui/react-icons": "^1.3.0",
+    "@tabler/icons-react": "^2.47.0",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "next": "14.1.0",
diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -1,13 +1,12 @@
-import type { Config } from "tailwindcss"
+import type { Config } from "tailwindcss";
 
 const config = {
-  darkMode: ["class"],
   content: [
-    './pages/**/*.{ts,tsx}',
-    './components/**/*.{ts,tsx}',
-    './app/**/*.{ts,tsx}',
-    './src/**/*.{ts,tsx}',
-	],
+    "./pages/**/*.{ts,tsx}",
+    "./components/**/*.{ts,tsx}",
+    "./app/**/*.{ts,tsx}",
+    "./src/**/*.{ts,tsx}",
+  ],
   prefix: "",
   theme: {
     container: {
@@ -75,6 +74,6 @@ const config = {
     },
   },
   plugins: [require("tailwindcss-animate")],
-} satisfies Config
+} satisfies Config;
 
-export default config
+export default config;

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,3 @@`
`1`	`1`	`{`
`2`		`- "cSpell.words": ["clsx", "tailwindcss"]`
	`2`	`+ "cSpell.words": ["clsx", "Echolon", "tabler", "tailwindcss"]`
`3`	`3`	`}`
Original file line number	Diff line number	Diff line change
`@@ -64,6 +64,8 @@`
`64`	`64`	`--border: 240 3.7% 15.9%;`
`65`	`65`	`--input: 240 3.7% 15.9%;`
`66`	`66`	`--ring: 240 4.9% 83.9%;`
	`67`	`+`
	`68`	`+ color-scheme: dark;`
`67`	`69`	`}`
`68`	`70`	`}`
`69`	`71`	`}`