update starter to reflect new patterns

arbetsmarknad · Feb 7, 2025 · 10f7aff · 10f7aff
1 parent f3e501c
commit 10f7aff
Show file tree

Hide file tree

Showing 5 changed files with 300 additions and 36 deletions.
diff --git a/app/RootLayout.tsx b/app/RootLayout.tsx
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,6 +1,9 @@
 import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
+import { Footer } from "@arbetsmarknad/components/Footer";
+import { HeaderMenu } from "@arbetsmarknad/components/HeaderMenu";
+import { Page } from "@arbetsmarknad/components/Page";
 
 const geistSans = Geist({
   variable: "--font-geist-sans",
@@ -27,7 +30,16 @@ export default function RootLayout({
       <body
         className={`${geistSans.variable} ${geistMono.variable} antialiased`}
       >
-        {children}
+        <Page>
+          <HeaderMenu
+            href="https://arbetsmarknad.github.io"
+            text="arbetsmarknad.github.io"
+          />
+          {children}
+          <Footer
+            sourceCode={["arbetsmarknad/next", "arbetsmarknad/components"]}
+          />
+        </Page>
       </body>
     </html>
   );

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,41 +1,24 @@
-import {
-  Breadcrumb,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbList,
-  BreadcrumbSeparator,
-} from "@arbetsmarknad/components/Breadcrumb";
+import { Breadcrumbs } from "@arbetsmarknad/components/Breadcrumb";
 import { Container } from "@arbetsmarknad/components/Container";
 import { HeaderMenu } from "@arbetsmarknad/components/HeaderMenu";
-import { Page } from "@arbetsmarknad/components/Page";
+import { Main } from "@arbetsmarknad/components/Main";
 import { TopLevelHeading } from "@arbetsmarknad/components/TopLevelHeading";
 
 export default function Home() {
   return (
-    <Page>
-      <HeaderMenu
-        href="https://arbetsmarknad.github.io"
-        text="arbetsmarknad.github.io"
-      />
-      <Breadcrumb className="py-4 w-full flex justify-center">
-        <Container>
-          <BreadcrumbList>
-            <BreadcrumbItem>
-              <BreadcrumbLink href="/">Arbetsmarknad</BreadcrumbLink>
-            </BreadcrumbItem>
-            <BreadcrumbSeparator />
-            <BreadcrumbItem>
-              <BreadcrumbLink href="/components">Components</BreadcrumbLink>
-            </BreadcrumbItem>
-          </BreadcrumbList>
-        </Container>
-      </Breadcrumb>
-      <main className="flex flex-col items-center w-full py-4">
+    <>
+      <Breadcrumbs>
+        {{
+          "https://arbetsmarknad.github.io/": "Arbetsmarknad",
+          "/next": "Next",
+        }}
+      </Breadcrumbs>
+      <Main>
         <Container className="flex flex-col items-start space-y-4">
           <TopLevelHeading text="Arbetsmarknad Starter Project" />
           <p>This is a starter project for Arbetsmarknad web content.</p>
         </Container>
-      </main>
-    </Page>
+      </Main>
+    </>
   );
 }
diff --git a/package.json b/package.json
@@ -5,7 +5,7 @@
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@arbetsmarknad/components": "^0.0.11",
+    "@arbetsmarknad/components": "^0.0.25",
     "@eslint/eslintrc": "^3",
     "@tailwindcss/postcss": "^4.0.0",
     "@types/node": "^20",