diff --git a/web/src/pages/SetupWizard.tsx b/web/src/pages/SetupWizard.tsx index f7db8255f9..a2edefbae5 100644 --- a/web/src/pages/SetupWizard.tsx +++ b/web/src/pages/SetupWizard.tsx @@ -5,9 +5,12 @@ import SetupDetector from "@/components/setup/SetupDetector"; import SetupHwAccel from "@/components/setup/SetupHwAccel"; import SetupRecording from "@/components/setup/SetupRecording"; import SetupWelcome from "@/components/setup/SetupWelcome"; +import { Button } from "@/components/ui/button"; import { Card, CardContent } from "@/components/ui/card"; +import { useTheme } from "@/context/theme-provider"; import { useCallback, useReducer } from "react"; import { useTranslation } from "react-i18next"; +import { LuMoon, LuSun } from "react-icons/lu"; import { toast } from "sonner"; import axios from "axios"; @@ -108,8 +111,11 @@ function wizardReducer(state: WizardState, action: WizardAction): WizardState { } export default function SetupWizard() { - const { t } = useTranslation(["views/setup"]); + const { t } = useTranslation(["views/setup", "common"]); const [state, dispatch] = useReducer(wizardReducer, initialState); + const { theme, systemTheme, setTheme } = useTheme(); + + const isDark = (theme === "system" ? systemTheme : theme) === "dark"; const handleSkipSetup = useCallback(async () => { try { @@ -219,6 +225,19 @@ export default function SetupWizard() { return (