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:
@@ -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 ? (
|
||||
|
||||
@@ -1,13 +1,19 @@
|
||||
"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 (
|
||||
<MantineProvider theme={theme} defaultColorScheme="light">
|
||||
<Stack gap={0} bg={colors.grey[1]}>
|
||||
<Navbar />
|
||||
<Space h={{
|
||||
@@ -21,5 +27,6 @@ export default function Layout({ children }: { children: React.ReactNode }) {
|
||||
</Box>
|
||||
<Footer />
|
||||
</Stack>
|
||||
</MantineProvider>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user