my_website/my-app/src/App.tsx
2024-05-05 10:29:11 +02:00

61 lines
1.4 KiB
TypeScript

import './css/App.css';
import './css/mine.css';
import './css/mine_phone.css';
import Home from './pages/home'
import { ThemeProvider, createTheme } from '@mui/material/styles';
import { BrowserRouter, Route, Router, Routes, useLocation } from 'react-router-dom';
import React, { useState } from "react";
import CssBaseline from '@mui/material/CssBaseline';
import Header from './components/header';
import { ColorModeContext } from './utils/color-toggle';
import { useTranslation } from 'react-i18next';
import "./utils/i18n";
function App()
{
// state to manage the dark mode
const [toggleDarkMode, setToggleDarkMode] = useState(true);
// function to toggle the dark mode as true or false
const toggleDarkTheme = () => {
console.log("changed");
setToggleDarkMode(!toggleDarkMode);
};
const darkTheme = createTheme({
palette: {
mode: toggleDarkMode ? 'dark' : 'light',
primary: {
main: '#90caf9',
},
secondary: {
main: '#131052',
},
},
});
const { i18n, t } = useTranslation();
// const location = useLocation();
return (
<React.StrictMode>
<BrowserRouter>
<CssBaseline />
{/* <Router> */}
<Header/>
<Routes>
<Route path="/" element={<Home/>}/>
<Route path="/test" element={<></>}/>
</Routes>
{/* </Router> */}
</BrowserRouter>
</React.StrictMode>
);
}
export default App;