fix: force light mode for darmasaba public pages

- Add MantineProvider with defaultColorScheme='light' to darmasaba/layout.tsx
- Remove useMantineColorScheme from ModuleView component
- Hardcode bg='white' for Paper components in ModuleView
- Prevent system dark mode from affecting public pages

This ensures public pages always use light mode regardless of
OS system preference, while admin panel can still use dark mode toggle.

Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
This commit is contained in:
2026-02-25 11:30:42 +08:00
parent 458797ae38
commit a319484907
2 changed files with 23 additions and 19 deletions

View File

@@ -10,8 +10,7 @@ import {
SimpleGrid,
Skeleton,
Stack,
Text,
useMantineColorScheme
Text
} from "@mantine/core";
import { useShallowEffect } from "@mantine/hooks";
import { Prisma } from "@prisma/client";
@@ -24,8 +23,6 @@ type ProgramInovasiItem = Prisma.ProgramInovasiGetPayload<{ include: { image: tr
function ModuleItem({ data }: { data: ProgramInovasiItem }) {
const router = useTransitionRouter();
const { colorScheme } = useMantineColorScheme();
const isDark = colorScheme === "dark";
return (
<motion.div whileHover={{ scale: 1.03 }}>
@@ -37,7 +34,7 @@ function ModuleItem({ data }: { data: ProgramInovasiItem }) {
role="button"
tabIndex={0}
className="cursor-pointer transition-all"
bg={isDark ? "dark.6" : "white"}
bg="white"
>
<Center h={160}>
{data.image?.link ? (

View File

@@ -1,25 +1,32 @@
"use client";
import colors from "@/con/colors";
import { MantineProvider, createTheme } from "@mantine/core";
import { Box, Space, Stack } from "@mantine/core";
import { Navbar } from "@/app/darmasaba/_com/Navbar";
import Footer from "./_com/Footer";
const theme = createTheme({
defaultColorScheme: "light",
});
export default function Layout({ children }: { children: React.ReactNode }) {
return (
<Stack gap={0} bg={colors.grey[1]}>
<Navbar />
<Space h={{
base: "3.9rem",
md: "2.5rem"
}} />
<Box style={{
overflow: "scroll"
}}>
{children}
</Box>
<Footer />
</Stack>
<MantineProvider theme={theme} defaultColorScheme="light">
<Stack gap={0} bg={colors.grey[1]}>
<Navbar />
<Space h={{
base: "3.9rem",
md: "2.5rem"
}} />
<Box style={{
overflow: "scroll"
}}>
{children}
</Box>
<Footer />
</Stack>
</MantineProvider>
)
}