Update src/app/page.tsx

2026-03-06 22:54:16 +00:00
2 changed files with 46 additions and 16 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,28 +1,57 @@
 import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { Halant } from "next/font/google";
+import { Inter } from "next/font/google";
+import { Nunito } from "next/font/google";
 import "./globals.css";
+import { ServiceWrapper } from "@/components/ServiceWrapper";
+import Tag from "@/tag/Tag";

-const geist = Geist({
-  variable: "--font-geist-sans",  subsets: ["latin"],
+const halant = Halant({
+  variable: "--font-halant",  subsets: ["latin"],
+  weight: ["300", "400", "500", "600", "700"],
 });

-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",  subsets: ["latin"],
+const inter = Inter({
+  variable: "--font-inter",  subsets: ["latin"],
+});
+
+const nunito = Nunito({
+  variable: "--font-nunito",  subsets: ["latin"],
 });

 export const metadata: Metadata = {
-  title: "Serene Studios - Editorial Fashion & Design",  description: "Serene Studios explores the intersection of restraint, identity, and intentional creation. Avant-garde fashion with conceptual rigor."};
+  title: "Serene Studios | Luxury Avant-Garde Fashion",  description: "Serene Studios creates conceptual luxury fashion where silence speaks louder than noise. Editorial aesthetic, restrained design, timeless pieces for design aesthetes.",  keywords: "luxury fashion, avant-garde design, editorial aesthetic, minimalist clothing, contemporary luxury brand, designer clothing",  metadataBase: new URL("https://serenestudios.com"),
+  alternates: {
+    canonical: "https://serenestudios.com"},
+  openGraph: {
+    title: "Serene Studios | Silence in Design",    description: "Conceptual luxury fashion that whispers rather than shouts. Pieces designed for those who understand restraint as ultimate luxury.",    url: "https://serenestudios.com",    siteName: "Serene Studios",    type: "website",    images: [
+      {
+        url: "http://img.b2bpic.net/free-photo/view-human-hand-with-mirror_23-2149512324.jpg",        alt: "luxury fashion editorial studio aesthetic"},
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",    title: "Serene Studios | Luxury Avant-Garde Fashion",    description: "Editorial luxury fashion. Silence in design. Timeless pieces.",    images: ["http://img.b2bpic.net/free-photo/view-human-hand-with-mirror_23-2149512324.jpg"],
+  },
+  robots: {
+    index: true,
+    follow: true,
+  },
+};

 export default function RootLayout({
  children,
-}: {
+}: Readonly<{
  children: React.ReactNode;
-}) {
+}>) {
  return (
-    <html lang="en">
-      <body className={`${geist.variable} ${geistMono.variable} antialiased`}>
-        {children}
-      
+    <html lang="en" suppressHydrationWarning>
+      <ServiceWrapper>
+        <body
+          className={`${halant.variable} ${inter.variable} ${nunito.variable} antialiased`}
+        >
+          <Tag />
+          {children}
+        
        <script
          dangerouslySetInnerHTML={{
            __html: `
@@ -1390,6 +1419,7 @@ export default function RootLayout({
          }}
        />
      </body>
+      </ServiceWrapper>
    </html>
  );
 }
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client"

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
@@ -11,7 +11,7 @@ import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
 import FaqBase from "@/components/sections/faq/FaqBase";
 import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { Award, ArrowRight, Eye, HelpCircle, Infinity, Package, Palette, Pen, Sparkles, Star, Target, Zap, Mail, Phone, MapPin } from "lucide-react";
+import { Award, ArrowRight, Eye, HelpCircle, Infinity, Package, Palette, Pen, Sparkles, Star, Target, Zap } from "lucide-react";

 export default function LandingPage() {
  return (
@@ -34,7 +34,7 @@ export default function LandingPage() {
            { name: "Collection", id: "products" },
            { name: "About", id: "about" },
            { name: "Approach", id: "approach" },
-            { name: "Contact", id: "contact" },
+            { name: "Journal", id: "blog" },
          ]}
          button={{ text: "Contact", href: "#contact" }}
          animateOnLoad={true}
@@ -317,7 +317,7 @@ export default function LandingPage() {
                { label: "Collection", href: "#products" },
                { label: "About", href: "#about" },
                { label: "Approach", href: "#approach" },
-                { label: "Contact", href: "#contact" },
+                { label: "Journal", href: "#blog" },
              ],
            },
            {