From cbf1047244c56a619f0f0278d2f04575c776fb6f Mon Sep 17 00:00:00 2001 From: Mathis Date: Fri, 27 Sep 2024 11:58:10 +0200 Subject: [PATCH] feat(app): add base layout and home page Introduced global CSS styling and created the initial structure for the Home page and Root layout. The Home page includes a logo, instructions, and helpful links, while the layout sets up metadata and font usage. --- src/app/globals.css | 70 ++++++++++++++++++++++++++++++ src/app/layout.tsx | 35 +++++++++++++++ src/app/page.tsx | 101 ++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 206 insertions(+) create mode 100644 src/app/globals.css create mode 100644 src/app/layout.tsx create mode 100644 src/app/page.tsx diff --git a/src/app/globals.css b/src/app/globals.css new file mode 100644 index 0000000..e44d83e --- /dev/null +++ b/src/app/globals.css @@ -0,0 +1,70 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +body { + font-family: Arial, Helvetica, sans-serif; +} + +@layer utilities { + .text-balance { + text-wrap: balance; + } +} + +@layer base { + :root { + --background: 0 0% 87.18%; + --foreground: 0 0% 12.94%; + --muted: 60 4.8% 95.9%; + --muted-foreground: 26 83.33% 14.12%; + --popover: 0 0% 100%; + --popover-foreground: 0 0% 12.94%; + --card: 0 0% 100%; + --card-foreground: 0 0% 12.94%; + --border: 20 0% 52.31%; + --input: 20 21.42% 41.39%; + --primary: 47.9 100% 48.08%; + --primary-foreground: 26 83.3% 14.1%; + --secondary: 26 49.13% 43.5%; + --secondary-foreground: 0 0% 92.55%; + --accent: 60 0% 93.08%; + --accent-foreground: 24 9.8% 10%; + --destructive: 0 84.2% 60.2%; + --destructive-foreground: 60 9.1% 97.8%; + --ring: 20 14.3% 4.1%; + --radius: 0.5rem; + } + + .dark { + --background: 20 14.3% 4.1%; + --foreground: 0 0% 92.55%; + --muted: 12 6.5% 15.1%; + --muted-foreground: 24 5.4% 63.9%; + --popover: 20 14.3% 4.1%; + --popover-foreground: 60 9.1% 97.8%; + --card: 20 14.3% 4.1%; + --card-foreground: 0 0% 92.55%; + --border: 12 6.19% 17.63%; + --input: 12 6.5% 15.1%; + --primary: 60 96.56% 44.61%; + --primary-foreground: 26 90.03% 12.55%; + --secondary: 12 26.8% 16.18%; + --secondary-foreground: 0 0% 92.55%; + --accent: 12 5.7% 26.68%; + --accent-foreground: 0 0% 92.55%; + --destructive: 0 76.12% 38%; + --destructive-foreground: 0 0% 92.55%; + --ring: 47.95 95.82% 53.14%; + } +} + + +@layer base { + * { + @apply border-border; + } + body { + @apply bg-background text-foreground; + } +} diff --git a/src/app/layout.tsx b/src/app/layout.tsx new file mode 100644 index 0000000..a36cde0 --- /dev/null +++ b/src/app/layout.tsx @@ -0,0 +1,35 @@ +import type { Metadata } from "next"; +import localFont from "next/font/local"; +import "./globals.css"; + +const geistSans = localFont({ + src: "./fonts/GeistVF.woff", + variable: "--font-geist-sans", + weight: "100 900", +}); +const geistMono = localFont({ + src: "./fonts/GeistMonoVF.woff", + variable: "--font-geist-mono", + weight: "100 900", +}); + +export const metadata: Metadata = { + title: "Create Next App", + description: "Generated by create next app", +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + {children} + + + ); +} diff --git a/src/app/page.tsx b/src/app/page.tsx new file mode 100644 index 0000000..6fe62d1 --- /dev/null +++ b/src/app/page.tsx @@ -0,0 +1,101 @@ +import Image from "next/image"; + +export default function Home() { + return ( +
+
+ Next.js logo +
    +
  1. + Get started by editing{" "} + + src/app/page.tsx + + . +
    2. +
  2. Save and see your changes instantly.
    3. +
+ +
+ + Vercel logomark + Deploy now + + + Read our docs + +
+
+ +
+ ); +}