made the title change based on page

2025-03-27 11:25:46 +01:00
parent 243598ad20
commit 598d149d20
4 changed files with 49 additions and 19 deletions
@@ -4,20 +4,11 @@
    <option name="autoReloadType" value="SELECTIVE" />
  </component>
  <component name="ChangeListManager">
-    <list default="true" id="15d653a3-00a9-440e-a365-0d5dba6a77a9" name="Changes" comment="added dark/light mode toggle">
-      <change afterPath="$PROJECT_DIR$/.idea/jsLibraryMappings.xml" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/app/projects/nuclear-age/page.js" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/app/projects/porsche/page.js" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/app/projects/roboxers/page.js" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/components/accordion.jsx" afterDir="false" />
-      <change afterPath="$PROJECT_DIR$/src/components/burger.jsx" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/.idea/tailwindcss.xml" beforeDir="false" />
+    <list default="true" id="15d653a3-00a9-440e-a365-0d5dba6a77a9" name="Changes" comment="addded fuctioning burger with accordion for projects and fixed the header">
      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
      <change beforePath="$PROJECT_DIR$/src/app/layout.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/layout.js" afterDir="false" />
      <change beforePath="$PROJECT_DIR$/src/app/me/page.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/me/page.js" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/app/projects/page.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/app/projects/page.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/mode-toggle.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/mode-toggle.jsx" afterDir="false" />
    </list>
    <option name="SHOW_DIALOG" value="false" />
    <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -125,7 +116,7 @@
      <workItem from="1742463482019" duration="601000" />
      <workItem from="1742464379879" duration="293000" />
      <workItem from="1742464681826" duration="2750000" />
-      <workItem from="1743060154301" duration="7632000" />
+      <workItem from="1743060154301" duration="10034000" />
    </task>
    <task id="LOCAL-00001" summary="created a base layout">
      <option name="closed" value="true" />
@@ -151,7 +142,15 @@
      <option name="project" value="LOCAL" />
      <updated>1742461342755</updated>
    </task>
-    <option name="localTasksCounter" value="4" />
+    <task id="LOCAL-00004" summary="addded fuctioning burger with accordion for projects and fixed the header">
+      <option name="closed" value="true" />
+      <created>1743068701470</created>
+      <option name="number" value="00004" />
+      <option name="presentableId" value="LOCAL-00004" />
+      <option name="project" value="LOCAL" />
+      <updated>1743068701470</updated>
+    </task>
+    <option name="localTasksCounter" value="5" />
    <servers />
  </component>
  <component name="TypeScriptGeneratedFilesManager">
@@ -160,6 +159,7 @@
  <component name="VcsManagerConfiguration">
    <MESSAGE value="created a base layout" />
    <MESSAGE value="added dark/light mode toggle" />
-    <option name="LAST_COMMIT_MESSAGE" value="added dark/light mode toggle" />
+    <MESSAGE value="addded fuctioning burger with accordion for projects and fixed the header" />
+    <option name="LAST_COMMIT_MESSAGE" value="addded fuctioning burger with accordion for projects and fixed the header" />
  </component>
 </project>
@@ -5,9 +5,35 @@ import Link from "next/link";
 import {ThemeProvider} from "@/components/theme-provider";
 import {ModeToggle} from "@/components/mode-toggle";
 import Burger from "@/components/burger";
+import {usePathname} from "next/navigation";


 export default function RootLayout({children}) {
+    const pathname = usePathname();
+    const getTitle = () => {
+        switch (pathname) {
+            case "/":
+                return "Kristians Portfolio";
+            case "/about":
+                return "About";
+            case "/projects":
+                return "Projects";
+            case "/me":
+                return "About me";
+            case "/contact":
+                return "Contact";
+            case "/projects/roboxers":
+                return "Roboxers";
+            case "/projects/nuclear-age":
+                return "Nuclear Age Mod";
+            case "/projects/porsche":
+                return "Wirtschaftsgeschichte von Porsche";
+            case "/privacy":
+                return "Privacy Policy";
+            default:
+                return "Kristians Portfolio";
+        }
+    };
    return (
        <html lang="en" suppressHydrationWarning>
        <body
@@ -18,12 +44,13 @@ export default function RootLayout({children}) {
            enableSystem
            disableTransitionOnChange
        >
-            <header className={"fixed dark:bg-black bg-gray-200 w-full flex text-3xl md:text-5xl p-3 justify-between border-b-2 border-emerald-800 dark:border-emerald-300 content-center"}>
+            <header
+                className={"fixed dark:bg-black bg-gray-200 w-full flex text-3xl md:text-5xl p-3 justify-between border-b-2 border-emerald-800 dark:border-emerald-300 content-center"}>
                <Burger/>
-                <div className={""}>Kristians Portfolio</div>
+                <div className={""}>{getTitle()}</div>
                <ModeToggle/>
            </header>
-            <div className={"p-5 pt-20"}>
+            <div className={"p-5 pt-23"}>
                {children}
            </div>
            <footer className={""}>
@@ -1,5 +1,6 @@
 export default function Me() {
-    return <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
+    return (
+        <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore
        et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
        clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
        consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
@@ -61,4 +62,5 @@ export default function Me() {


    </p>
+    )
 }
@@ -12,7 +12,8 @@ export function ModeToggle() {
    return (
        <Button variant="outline" size="icon" onClick={() =>
            setTheme(theme === "dark" ? "light" : "dark")}
-                className="bg-gray-300 dark:bg-transparent text-yellow-600 dark:text-yellow-300 lg:scale-150 m-2">
+                className="bg-transparent text-yellow-600 dark:text-yellow-200 lg:scale-150 m-2
+                border-1 dark:border-emerald-300 border-emerald-800">
            <Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-125 transition-all dark:-rotate-90 dark:scale-0"/>
            <Moon
                className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-125"/>