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>

src/app/darmasaba/_com/main-page/landing-page/ModuleView.tsx

@@ -10,8 +10,7 @@ import {
   SimpleGrid,
   Skeleton,
   Stack,
-  Text,
+  Text
-  useMantineColorScheme
 } 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 ? (

src/app/darmasaba/layout.tsx

@@ -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]}>
+        <MantineProvider theme={theme} defaultColorScheme="light">
-            <Navbar />
+            <Stack gap={0} bg={colors.grey[1]}>
-            <Space h={{
+                <Navbar />
-                base: "3.9rem",
+                <Space h={{
-                md: "2.5rem"
+                    base: "3.9rem",
-            }} />
+                    md: "2.5rem"
-            <Box style={{
+                }} />
-                overflow: "scroll"
+                <Box style={{
-            }}>
+                    overflow: "scroll"
-                {children}
+                }}>
-            </Box>
+                    {children}
-            <Footer />
+                </Box>
-        </Stack>
+                <Footer />
+            </Stack>
+        </MantineProvider>
     )
 }