diff --git a/src/assets/soarca-logo-cropped-dark.svg b/src/assets/soarca-logo-cropped-dark.svg new file mode 100644 index 0000000..2c86361 --- /dev/null +++ b/src/assets/soarca-logo-cropped-dark.svg @@ -0,0 +1,145 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/soarca-logo-dark.svg b/src/assets/soarca-logo-dark.svg new file mode 100644 index 0000000..b8608c4 --- /dev/null +++ b/src/assets/soarca-logo-dark.svg @@ -0,0 +1,145 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/pages/LoginPage.tsx b/src/pages/LoginPage.tsx index 9467ab5..8aaa211 100644 --- a/src/pages/LoginPage.tsx +++ b/src/pages/LoginPage.tsx @@ -2,7 +2,9 @@ import { HelpCircle, KeyRound, LockKeyholeOpen } from "lucide-react"; import styled from "styled-components"; import soarcaBackground from "@/assets/soarca-background.jpg"; +import logoDark from "@/assets/soarca-logo-cropped-dark.svg"; import logo from "@/assets/soarca-logo-cropped.svg"; + import { Button, ButtonWidth, @@ -17,14 +19,19 @@ import { Spacer, ThemeVariant, } from "@/components"; +import { useThemeMode } from "@/theme"; export const LoginPage: React.FC = () => { + const { resolved } = useThemeMode(); return ( - + diff --git a/src/pages/main-page/MainPage.tsx b/src/pages/main-page/MainPage.tsx index ce2a7db..5d3346c 100644 --- a/src/pages/main-page/MainPage.tsx +++ b/src/pages/main-page/MainPage.tsx @@ -12,6 +12,7 @@ import { import { useState } from "react"; import { Outlet, useLocation, useNavigate } from "react-router"; +import logoDark from "@/assets/soarca-logo-cropped-dark.svg"; import logo from "@/assets/soarca-logo-cropped.svg"; import logoSmall from "@/assets/soarca-logo-small.svg"; import { PATHS, SOARCA_DOC_URL } from "@/utils"; @@ -33,6 +34,7 @@ import { ThemeVariant, } from "@/components"; +import { useThemeMode } from "@/theme/ThemeModeContext"; import { ContentArea, MainContent, @@ -62,6 +64,7 @@ const NAV_ROUTES: NavRoute[] = [ export const MainPage: React.FC = () => { const navigate = useNavigate(); + const { resolved } = useThemeMode(); const location = useLocation(); const [sidebarOpen, setSidebarOpen] = useState(false); @@ -79,7 +82,11 @@ export const MainPage: React.FC = () => { - +