joshuafhiggins/realm-homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
mauro-balades
2024-09-02 18:15:03 +02:00
parent ec6783038f
commit 7071eed755
22 changed files with 71 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
messages/ro.json
View File

@@ -1,7 +0,0 @@
{
"navigation": {
"nav-getting-started": "Noțiuni de bază",
"donate": "Donează",
"useful-links": "Linkuri utile"
}
}

17
next.config.js
View File

@@ -1,8 +1,6 @@
const createNextIntlPlugin = require('next-intl/plugin');
const { PHASE_DEVELOPMENT_SERVER } = require('next/constants')
const withNextIntl = createNextIntlPlugin();
/** @type {import('next').NextConfig} */
const nextConfig = (phase, { defaultConfig }) => {
@@ -20,7 +18,6 @@ const nextConfig = (phase, { defaultConfig }) => {
pathname: '/gh/zen-browser/**',
}
],
formats: ["image/png", "image/jpeg", "image/svg+xml", "image/webp"],
domains: ['localhost', 'cdn.jsdelivr.net', "raw.githubusercontent.com"], // Allow images from jsDelivr
},
experimental: {
@@ -32,6 +29,18 @@ const nextConfig = (phase, { defaultConfig }) => {
compiler: {
styledComponents: true,
},
webpack: (
config,
{ buildId, dev, isServer, defaultLoaders, nextRuntime, webpack }
) => {
// Important: return the modified config
return {
output: {
// ...
globalObject: 'this',
},
}
},
};
if (phase === PHASE_DEVELOPMENT_SERVER) {
return {
@@ -46,4 +55,4 @@ const nextConfig = (phase, { defaultConfig }) => {
};
};
module.exports = withNextIntl(nextConfig);
module.exports = nextConfig;

2
src/app/branding-assets/page.tsx → src/app/[locale]/branding-assets/page.tsx
View File

@@ -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>
);
}

2
src/app/create-theme/page.tsx → src/app/[locale]/create-theme/page.tsx
View File

@@ -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>
);
}

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

@@ -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>
);
}

0
src/app/feed.xml/route.ts → src/app/[locale]/feed.xml/route.ts
View File

0
src/app/globals.css → src/app/[locale]/globals.css
View File

36
src/app/layout.tsx → src/app/[locale]/layout.tsx
View File

@@ -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>

2
src/app/not-found.tsx → src/app/[locale]/not-found.tsx
View File

@@ -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>
);
}

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

@@ -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>
);
}

0
src/app/privacy-policy/markdown.css → src/app/[locale]/privacy-policy/markdown.css
View File

2
src/app/privacy-policy/page.tsx → src/app/[locale]/privacy-policy/page.tsx
View File

@@ -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>
)
}

4
src/app/release-notes/[version]/page.tsx → src/app/[locale]/release-notes/[version]/page.tsx
View File

@@ -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>
);
}

2
src/app/release-notes/page.tsx → src/app/[locale]/release-notes/page.tsx
View File

@@ -28,8 +28,6 @@ export default function ReleaseNotes() {
))}
</div>
</div>
<Footer />
<Navigation /> {/* At the bottom of the page */}
</main>
)
}

2
src/app/themes/[theme]/page.tsx → src/app/[locale]/themes/[theme]/page.tsx
View File

@@ -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>
);
}

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

@@ -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>
);
}

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

@@ -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>
);
}

4
src/components/footer.tsx
View File

@@ -105,7 +105,9 @@ export default function Footer() {
</div>
<div className="flex w-full pt-10 pr-5 pl-3 mx-auto lg:!w-2/3 items-center">
<p className="text-xs font-normal opacity-30">Crafted with ❤️ by the community - Copyright © {new Date().getFullYear()} Zen Browser</p>
<Button onClick={() => window.open("/download")} className="ml-auto">Download</Button>
<a href="/download" className="ml-auto">
<Button className="ml-auto">Download</Button>
</a>
</div>
</div>
);

5
src/components/navigation.tsx
View File

@@ -1,5 +1,4 @@
"use client"
import * as React from "react"
import Link from "next/link"
@@ -19,6 +18,7 @@ import { MobileNav } from "./mobile-nav"
import { HeartIcon } from "lucide-react"
import { HeartFilledIcon } from "@radix-ui/react-icons"
import { useTranslations } from "next-intl";
import { unstable_setRequestLocale } from "next-intl/server"
export const components: { titleKey: string; href: string; descriptionKey: string }[] = [
{
@@ -49,7 +49,6 @@ export const components: { titleKey: string; href: string; descriptionKey: strin
]
export function Navigation() {
const t = useTranslations('navigation');
const translatedComponents = components.map(component => ({

2
src/components/theme-page.tsx
View File

@@ -3,7 +3,7 @@
import { getThemeAuthorLink, getThemeFromId, getThemeMarkdown, ZenTheme } from "@/lib/themes";
import { Button } from "./ui/button";
import Markdown from "react-markdown";
import '../app/privacy-policy/markdown.css';
import '../app/[locale]/privacy-policy/markdown.css';
import { ChevronLeft, LoaderCircleIcon } from "lucide-react";
export default async function ThemePage({ themeID }: { themeID: string }) {

35
src/i18n.ts
View File

@@ -1,35 +0,0 @@
import { getRequestConfig } from "next-intl/server";
import { headers } from "next/headers";
const SUPPORTED_LANGUAGES = ['en', 'de', 'ro'];
export default getRequestConfig(async () => {
const headersList = headers();
const acceptLanguage = headersList.get("accept-language") || "en";
const [primaryLanguage] = acceptLanguage
.split(",")
.map((lang) => lang.split(";")[0])
.map((lang) => lang.toLowerCase());
const locale = SUPPORTED_LANGUAGES.includes(primaryLanguage) ? primaryLanguage : 'en';
try {
const messages = (await import(`../messages/${locale}.json`)).default;
return {
locale,
messages,
};
} catch (error) {
console.error(`Failed to load messages for locale: ${locale}`, error);
const fallbackMessages = (await import(`../messages/en.json`)).default;
return {
locale: "en",
messages: fallbackMessages,
};
}
});

22
src/middleware.ts Normal file
View File

@@ -0,0 +1,22 @@
import createMiddleware from 'next-intl/middleware';
import {NextRequest} from 'next/server';
export default async function middleware(request: NextRequest) {
// Step 1: Use the incoming request (example)
const defaultLocale = request.headers.get('x-your-custom-locale') || 'en';
// Step 2: Create and call the next-intl middleware (example)
const handleI18nRouting = createMiddleware({
locales: ['en', 'de'],
defaultLocale,
localePrefix: "always",
});
const response = handleI18nRouting(request);
return response;
}
export const config = {
// Match only internationalized pathnames
matcher: ['/', '/(de|en)/:path*']
};