pascallinxweiler/Webify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[dyad] Added language switcher for English and German - wrote 10 file(s), renamed 2 file(s), added next-intl package(s)

Browse Source
This commit is contained in:
[dyad]
2026-01-18 12:39:47 +01:00
parent 1d41f871ee
commit 2136a2dd79
11 changed files with 799 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/app/[locale]/layout.tsx Normal file
View File

@@ -0,0 +1,44 @@
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { ThemeProvider } from "@/components/theme-provider";
import { Toaster } from "@/components/ui/sonner";
const geistSans = Geist({
variable: "--font-geist-sans",
subsets: ["latin"],
});
const geistMono = Geist_Mono({
variable: "--font-geist-mono",
subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Image Web Exporter",
description: "Upload a picture, then export it in a different resolution and format.",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en" suppressHydrationWarning>
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{children}
<Toaster />
</ThemeProvider>
</body>
</html>
);
}

11
src/app/page.tsx → src/app/[locale]/page.tsx
View File

@@ -1,15 +1,22 @@
import { ImageConverter } from "@/components/image-converter";
import { LanguageSwitcher } from "@/components/language-switcher";
import { useTranslations } from "next-intl";
export default function Home() {
const t = useTranslations("HomePage");
return (
<div className="relative flex flex-col items-center justify-center min-h-screen p-4 sm:p-8 bg-gray-50 dark:bg-background font-[family-name:var(--font-geist-sans)]">
<div className="absolute top-4 right-4 z-20">
<LanguageSwitcher />
</div>
<main className="flex flex-col items-center w-full max-w-6xl z-10">
<div className="text-center mb-8">
<h1 className="text-4xl font-bold tracking-tight text-gray-900 dark:text-gray-100 sm:text-5xl">
Image Web Exporter
{t("title")}
</h1>
<p className="mt-3 text-lg text-gray-600 dark:text-gray-400">
Upload a picture, then export it in a different resolution and format.
{t("description")}
</p>
</div>
<ImageConverter />

47
src/app/layout.tsx
View File

@@ -1,44 +1,17 @@
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
import { ThemeProvider } from "@/components/theme-provider";
import { Toaster } from "@/components/ui/sonner";
import { ReactNode } from 'react';
const geistSans = Geist({
variable: "--font-geist-sans",
subsets: ["latin"],
});
const geistMono = Geist_Mono({
variable: "--font-geist-mono",
subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Image Web Exporter",
description: "Upload a picture, then export it in a different resolution and format.",
type Props = {
children: ReactNode;
params: { locale: string };
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
// Even though this component is just passing its children through, the presence
// of this file fixes an issue in Next.js 13.4 where link clicks that switch
// the locale would otherwise cause a full page reload.
export default function RootLayout({ children, params: { locale } }: Props) {
return (
<html lang="en" suppressHydrationWarning>
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
<ThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
disableTransitionOnChange
>
{children}
<Toaster />
</ThemeProvider>
</body>
<html lang={locale}>
<body>{children}</body>
</html>
);
}