feat: Update footer layout, add social media links, and improve styling

2024-09-02 18:15:03 +02:00
parent ec6783038f
commit 7071eed755
22 changed files with 71 additions and 81 deletions
--- a/src/app/[locale]/branding-assets/page.tsx
+++ b/src/app/[locale]/branding-assets/page.tsx
@@ -6,8 +6,6 @@ export default function BrandingAssetsPage() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <BrandingAssets />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  );
 }
--- a/src/app/[locale]/create-theme/page.tsx
+++ b/src/app/[locale]/create-theme/page.tsx
@@ -6,8 +6,6 @@ export default function BrandingAssetsPage() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <CreateThemePage />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  );
 }
--- a/src/app/[locale]/download/page.tsx
+++ b/src/app/[locale]/download/page.tsx
@@ -7,8 +7,6 @@ export default function Download() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <DownloadPage />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>   
  );
 }
--- a/src/app/[locale]/feed.xml/route.ts
+++ b/src/app/[locale]/feed.xml/route.ts
--- a/src/app/[locale]/globals.css
+++ b/src/app/[locale]/globals.css
--- a/src/app/[locale]/layout.tsx
+++ b/src/app/[locale]/layout.tsx
@@ -4,7 +4,10 @@ import "./globals.css";
 import { ThemeProvider } from "@/components/theme-provider";
 import StyledComponentsRegistry from "@/lib/styled-components-registry";
 import {NextIntlClientProvider} from 'next-intl';
-import {getLocale, getMessages} from 'next-intl/server';
+import {unstable_setRequestLocale} from 'next-intl/server';
+import Footer from "@/components/footer";
+import { Navigation } from "@/components/navigation";
+import { notFound } from "next/navigation";

 const inter = Inter({ subsets: ["latin"] });

@@ -16,14 +19,29 @@ export const metadata: Metadata = {
  keywords: ["Zen", "Browser", "Zen Browser", "Web", "Internet", "Fast"],
 };

+const SUPPORTED_LANGUAGES = ["en", "de"];
+
+async function getMessages(locale: string) {
+  try {
+    return (await import(`../../../messages/${locale}.json`)).default
+  } catch (error) {
+    notFound()
+  }
+}
+
+export function generateStaticParams() {
+  return SUPPORTED_LANGUAGES.map((locale) => ({locale}));
+}
+
 export default async function RootLayout({
  children,
+  params: {locale},
 }: Readonly<{
  children: React.ReactNode;
+  params: {locale: string};
 }>) {
-  const locale = await getLocale();
-
-  const messages = await getMessages();
+  unstable_setRequestLocale(locale);
+  const messages = await getMessages(locale);

  return (
    <html lang={locale} suppressHydrationWarning>
@@ -32,14 +50,20 @@ export default async function RootLayout({
        <link rel="alternate" type="application/rss+xml" title="Zen Browser Release Notes" href="https://www.zen-browser.app/feed.xml" />
      </head>
      <body className={inter.className}>
-        <NextIntlClientProvider messages={messages}>
+        <NextIntlClientProvider messages={messages} locale={locale}>
          <ThemeProvider
            attribute="class"
            defaultTheme="dark"
            enableSystem
            disableTransitionOnChange
          >
-            <StyledComponentsRegistry>{children}</StyledComponentsRegistry>
+            <StyledComponentsRegistry>
+              <div>
+                {children}
+                <Footer />  
+                <Navigation /> {/* At the bottom of the page */}
+              </div>
+            </StyledComponentsRegistry>
          </ThemeProvider>
        </NextIntlClientProvider>
      </body>
--- a/src/app/[locale]/not-found.tsx
+++ b/src/app/[locale]/not-found.tsx
@@ -8,8 +8,6 @@ export default function NotFoundPage() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <h1>404</h1>
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  );
 }
--- a/src/app/[locale]/page.tsx
+++ b/src/app/[locale]/page.tsx
@@ -10,8 +10,6 @@ export default function Home() {
    <main className="flex min-h-screen overflow-x-hidden flex-col items-center justify-start">
      <Header />
      <Features />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>   
  );
 }
--- a/src/app/[locale]/privacy-policy/markdown.css
+++ b/src/app/[locale]/privacy-policy/markdown.css
--- a/src/app/[locale]/privacy-policy/page.tsx
+++ b/src/app/[locale]/privacy-policy/page.tsx
@@ -91,8 +91,6 @@ If you have any questions or concerns about this Privacy Policy or Zen Browser,
 By using Zen Browser, you agree to this Privacy Policy. Remember, with Zen, your privacy is in your hands.`}
        </Markdown>
      </div>
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  )
 }
--- a/src/app/[locale]/release-notes/[version]/page.tsx
+++ b/src/app/[locale]/release-notes/[version]/page.tsx
@@ -30,16 +30,12 @@ export default function ReleaseNotePage({ params }: { params: { version: string
            </Button>
          </a>
        </div>
-        <Footer />
-        <Navigation /> {/* At the bottom of the page */}
      </main>
    );
  }
  return (
    <main className="flex min-h-screen flex-col items-center justify-center">
      <ReleaseNote data={releaseNote} />
-      <Footer />
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  );
 }
--- a/src/app/[locale]/release-notes/page.tsx
+++ b/src/app/[locale]/release-notes/page.tsx
@@ -28,8 +28,6 @@ export default function ReleaseNotes() {
          ))}
        </div>
      </div>
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  )
 }
--- a/src/app/[locale]/themes/[theme]/page.tsx
+++ b/src/app/[locale]/themes/[theme]/page.tsx
@@ -49,8 +49,6 @@ export default async function ThemeInfoPage({ params }: { params: { theme: strin
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <ThemePage themeID={theme} />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>
  );
 }
--- a/src/app/[locale]/themes/page.tsx
+++ b/src/app/[locale]/themes/page.tsx
@@ -9,8 +9,6 @@ export default async function ThemesMarketplace() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <MarketplacePage themes={await getAllThemes()} />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>   
  );
 }
--- a/src/app/[locale]/welcome/page.tsx
+++ b/src/app/[locale]/welcome/page.tsx
@@ -7,8 +7,6 @@ export default function Download() {
  return (
    <main className="flex min-h-screen flex-col items-center justify-start">
      <WelcomePage />
-      <Footer />  
-      <Navigation /> {/* At the bottom of the page */}
    </main>   
  );
 }