From bdb537767772704971ac8fcb744cd0ab4b322f79 Mon Sep 17 00:00:00 2001 From: Michael Date: Fri, 26 Jan 2024 20:21:56 +0100 Subject: [PATCH] added: working dark mode --- src/App.jsx | 10 +++--- src/assets/logo NeuraChatAi 100x100 white.png | Bin 0 -> 3704 bytes src/assets/logo NeuraChatAi white.png | Bin 0 -> 10321 bytes src/components/Chat.jsx | 2 +- src/components/Header.jsx | 20 +++++++++--- src/components/ModeToggle.jsx | 30 ++++++++++++++++++ 6 files changed, 52 insertions(+), 10 deletions(-) create mode 100644 src/assets/logo NeuraChatAi 100x100 white.png create mode 100644 src/assets/logo NeuraChatAi white.png create mode 100644 src/components/ModeToggle.jsx diff --git a/src/App.jsx b/src/App.jsx index a0d5e38..6f3e7a3 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,16 +1,16 @@ import './styles/App.scss' import {Outlet} from "react-router-dom"; -import {Box} from "@mui/joy"; +import {Sheet} from "@mui/joy"; import Header from "./components/Header.jsx"; function App() { return ( <> -
- - - +
+ + + ) } diff --git a/src/assets/logo NeuraChatAi 100x100 white.png b/src/assets/logo NeuraChatAi 100x100 white.png new file mode 100644 index 0000000000000000000000000000000000000000..f63a8d90efa121736de825d8aea98d00578ed5f9 GIT binary patch literal 3704 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�gNB*2g3e89ucT|UPqQciPTwSZicp?z2}rPVY3#|OokgPn%cBlPCY zkx~&mU|oSV_=n)ZNuAmBga*1A}uXKFVZ(-{k!S9rR0}AIsYh>^%vOih2 zUpONE7FH6j5lj%Nr~L^{KxsiA&g!SfYr{I&fD=wF!*O+z08AVKgv|NXjk*0VLWqb< znXvw2h;jlL*B;l)w@172S6mq`TCOMUb25XbpD&1|x0<9)7SvkpPU=ggw~k9@Tm!w2ZQI8&DbRw*3L z-*fcaeXnTIF=s0bIkm&Gc@dKF?^22ogdK1J4`IkM>yRO9YH>?dnqJV7+HwqgN3{hi ze0kkyF-Zb$`NT}Qzaj&^`6?OKC;BJg3S!gz2Hnx>+n3>Tq1cesmdrv^=IuyLeN(o& zwu<;++Un3D)90~9fm!Rl*-ty=F`|FIFMZa3;qJJ;H@(+(LCL_Px(_!>6BDb%C+a2O zd=jY&Q-8sePL7|kQCz$?G;r-KhGsMGMA#%-MkZM1yG|;q8~I~xml7O2VQ_iAyYGJ3 zBi$Q#lR?G|4(fmD%>f30^%%j!=H3L45(-qi$dKjO%zW!N@g3{7K`VA99Z#zVM8pT4td^2#hkbmh< zhdG4whr~?nrvOE1x-{)^8B%kTs>Wo46^W-}iv0g~Ky5@d9}eSXy(cbrub=UTC$!+R!{TkCf(BM{=~-%47G?!t|_vW~w*RCpXWjBwwh$-PjO`rajd zWh|G;WL)a^?X)AVfU)soFPcP7Ub@SWW4{SGhf_Czkl=<>N5IT`BLuQTxc?du;L~Z w``MWL|8q`A%iC@+8k|ZzCAsg&p}Pp~HM%)hqU*i8Zwmxe6g3pe {messages.map((el, index) => { diff --git a/src/components/Header.jsx b/src/components/Header.jsx index 3e62f21..827dd2f 100644 --- a/src/components/Header.jsx +++ b/src/components/Header.jsx @@ -1,8 +1,19 @@ -import {Box, GlobalStyles, Sheet, Stack} from "@mui/joy"; +import {Box, GlobalStyles, Sheet, Stack, Typography} from "@mui/joy"; import {Link as RouterLink} from "react-router-dom"; import logoNeuraChatAi from "../assets/logo NeuraChatAi.png" +import logoNeuraChatAiWhite from "../assets/logo NeuraChatAi white.png" +import ModeToggle from "./ModeToggle.jsx"; +import {useEffect, useState} from "react"; +import { useColorScheme } from '@mui/joy/styles'; function Header() { + const {mode} = useColorScheme(); + const [logoHeader, setLogoHeader] = useState(mode) + + useEffect(() => { + mode === 'light' ? setLogoHeader(logoNeuraChatAi) : setLogoHeader(logoNeuraChatAiWhite) + },[mode]) + return ( - - Homepage - About + Homepage + About + ) } diff --git a/src/components/ModeToggle.jsx b/src/components/ModeToggle.jsx new file mode 100644 index 0000000..0efe02b --- /dev/null +++ b/src/components/ModeToggle.jsx @@ -0,0 +1,30 @@ +import {useEffect, useState} from 'react' +import {Button, useColorScheme} from '@mui/joy'; + + +function ModeToggle() { + const { mode, setMode } = useColorScheme(); + const [mounted, setMounted] = useState(false); + + // necessary for server-side rendering + // because mode is undefined on the server + useEffect(() => { + setMounted(true); + }, []); + if (!mounted) { + return null; + } + + return ( + + ); +} + +export default ModeToggle \ No newline at end of file