diff --git a/src/app/(main)/server/[server]/page.tsx b/src/app/(main)/server/[server]/page.tsx index 92a2d8b..0625a71 100644 --- a/src/app/(main)/server/[server]/page.tsx +++ b/src/app/(main)/server/[server]/page.tsx @@ -128,7 +128,7 @@ export async function generateMetadata( export default function ServerPage({ params }: { params: { server: string } }) { return ( -
+
diff --git a/src/app/(main)/server/[server]/statistics/page.tsx b/src/app/(main)/server/[server]/statistics/page.tsx index c359674..a009481 100644 --- a/src/app/(main)/server/[server]/statistics/page.tsx +++ b/src/app/(main)/server/[server]/statistics/page.tsx @@ -97,7 +97,7 @@ export async function generateMetadata( export default function ServerPage({ params }: { params: { server: string } }) { return ( -
+
diff --git a/src/components/Banner.tsx b/src/components/Banner.tsx index 823f535..d5aad92 100644 --- a/src/components/Banner.tsx +++ b/src/components/Banner.tsx @@ -66,7 +66,7 @@ export default function Banner({ server }: { server: string }) { ? bannerURL : "wsrv.nl/?url=" + encodeURIComponent(bannerURL) + "?n=-1" } - className="rounded align-middle block ml-auto mr-auto absolute left-0 z-0 max-h-[400px] w-full object-fill" + className="rounded align-middle block ml-auto mr-auto absolute left-0 z-0 w-full object-fill" alt="User-provided banner for this server." style={ { diff --git a/src/components/ThemeProvider.tsx b/src/components/ThemeProvider.tsx index 847935c..fa7a23b 100644 --- a/src/components/ThemeProvider.tsx +++ b/src/components/ThemeProvider.tsx @@ -33,6 +33,7 @@ import * as React from "react"; import { ThemeProvider as NextThemesProvider, useTheme } from "next-themes"; import { type ThemeProviderProps } from "next-themes"; +import { usePathname } from "next/navigation"; declare global { interface Document { @@ -48,6 +49,7 @@ declare global { export function ThemeProvider({ children, ...props }: ThemeProviderProps) { const [mounted, setMounted] = React.useState(false); + const pathname = usePathname(); React.useEffect(() => { setMounted(true); @@ -55,7 +57,14 @@ export function ThemeProvider({ children, ...props }: ThemeProviderProps) { if (!mounted) return null; - return {children}; + return ( + + {children} + + ); } interface UseThemeTransitionResult { diff --git a/src/components/ThemeSwitcher.tsx b/src/components/ThemeSwitcher.tsx index e2758ed..298aa2d 100644 --- a/src/components/ThemeSwitcher.tsx +++ b/src/components/ThemeSwitcher.tsx @@ -39,9 +39,11 @@ import { DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { useThemeTransition } from "./ThemeProvider"; +import { usePathname } from "next/navigation"; export function ModeToggle() { const { changeTheme } = useThemeTransition(); + const pathname = usePathname(); return ( @@ -53,13 +55,28 @@ export function ModeToggle() { - changeTheme("light")}> + {pathname?.startsWith("/server") && ( +
+ For compatibility reasons,
server pages are forced to dark + mode +
+ )} + changeTheme("light")} + disabled={pathname?.startsWith("/server")} + > Light - changeTheme("dark")}> + changeTheme("dark")} + disabled={pathname?.startsWith("/server")} + > Dark - changeTheme("system")}> + changeTheme("system")} + disabled={pathname?.startsWith("/server")} + > System