mirror of
https://github.com/Qortal/Qortal-Hub.git
synced 2025-06-11 02:36:59 +00:00
Move some components into styles folder, delete duplicated themes
This commit is contained in:
Nicola Benaglia
parent
dcfa7b258e
commit
efd3624e92
@ -149,7 +149,7 @@ import { BuyQortInformation } from './components/BuyQortInformation';
|
||||
import { QortPayment } from './components/QortPayment';
|
||||
import { GeneralNotifications } from './components/GeneralNotifications';
|
||||
import { PdfViewer } from './common/PdfViewer';
|
||||
import ThemeSelector from './components/Theme/ThemeSelector';
|
||||
import ThemeSelector from './styles/ThemeSelector.tsx';
|
||||
|
||||
type extStates =
|
||||
| 'not-authenticated'
|
||||
|
||||
@ -29,7 +29,7 @@ import { CustomizedSnackbars } from '../components/Snackbar/Snackbar';
|
||||
import { cleanUrl, gateways } from '../background';
|
||||
import { GlobalContext } from '../App';
|
||||
import Tooltip, { TooltipProps, tooltipClasses } from '@mui/material/Tooltip';
|
||||
import ThemeSelector from '../components/Theme/ThemeSelector';
|
||||
import ThemeSelector from '../styles/ThemeSelector';
|
||||
|
||||
const manifestData = {
|
||||
version: '0.5.3',
|
||||
|
||||
@ -423,7 +423,7 @@ const WalletItem = ({ wallet, updateWalletItem, idx, setSelectedWallet }) => {
|
||||
>
|
||||
<ListItem
|
||||
sx={{
|
||||
bgcolor: 'background.paper',
|
||||
bgcolor: 'background.paper', // TODO: set background color
|
||||
flexGrow: 1,
|
||||
'&:hover': {
|
||||
backgroundColor: 'secondary.main',
|
||||
|
||||
@ -1,21 +1,21 @@
|
||||
import React, { useState } from "react";
|
||||
import React, { useState } from 'react';
|
||||
import {
|
||||
AppCircle,
|
||||
AppCircleContainer,
|
||||
AppCircleLabel,
|
||||
AppLibrarySubTitle,
|
||||
AppsContainer,
|
||||
} from "./Apps-styles";
|
||||
import { Box, ButtonBase, Input } from "@mui/material";
|
||||
import { Add } from "@mui/icons-material";
|
||||
import { isMobile } from "../../App";
|
||||
import { executeEvent } from "../../utils/events";
|
||||
import { Spacer } from "../../common/Spacer";
|
||||
import { SortablePinnedApps } from "./SortablePinnedApps";
|
||||
import { extractComponents } from "../Chat/MessageDisplay";
|
||||
import ArrowOutwardIcon from "@mui/icons-material/ArrowOutward";
|
||||
import { AppsPrivate } from "./AppsPrivate";
|
||||
import ThemeSelector from "../Theme/ThemeSelector";
|
||||
} from './Apps-styles';
|
||||
import { Box, ButtonBase, Input } from '@mui/material';
|
||||
import { Add } from '@mui/icons-material';
|
||||
import { isMobile } from '../../App';
|
||||
import { executeEvent } from '../../utils/events';
|
||||
import { Spacer } from '../../common/Spacer';
|
||||
import { SortablePinnedApps } from './SortablePinnedApps';
|
||||
import { extractComponents } from '../Chat/MessageDisplay';
|
||||
import ArrowOutwardIcon from '@mui/icons-material/ArrowOutward';
|
||||
import { AppsPrivate } from './AppsPrivate';
|
||||
import ThemeSelector from '../../styles/ThemeSelector';
|
||||
export const AppsHomeDesktop = ({
|
||||
setMode,
|
||||
myApp,
|
||||
@ -23,7 +23,7 @@ export const AppsHomeDesktop = ({
|
||||
availableQapps,
|
||||
myName,
|
||||
}) => {
|
||||
const [qortalUrl, setQortalUrl] = useState("");
|
||||
const [qortalUrl, setQortalUrl] = useState('');
|
||||
|
||||
const openQortalUrl = () => {
|
||||
try {
|
||||
@ -31,9 +31,9 @@ export const AppsHomeDesktop = ({
|
||||
const res = extractComponents(qortalUrl);
|
||||
if (res) {
|
||||
const { service, name, identifier, path } = res;
|
||||
executeEvent("addTab", { data: { service, name, identifier, path } });
|
||||
executeEvent("open-apps-mode", {});
|
||||
setQortalUrl("qortal://");
|
||||
executeEvent('addTab', { data: { service, name, identifier, path } });
|
||||
executeEvent('open-apps-mode', {});
|
||||
setQortalUrl('qortal://');
|
||||
}
|
||||
} catch (error) {}
|
||||
};
|
||||
@ -41,12 +41,12 @@ export const AppsHomeDesktop = ({
|
||||
<>
|
||||
<AppsContainer
|
||||
sx={{
|
||||
justifyContent: "flex-start",
|
||||
justifyContent: 'flex-start',
|
||||
}}
|
||||
>
|
||||
<AppLibrarySubTitle
|
||||
sx={{
|
||||
fontSize: "30px",
|
||||
fontSize: '30px',
|
||||
}}
|
||||
>
|
||||
Apps Dashboard
|
||||
@ -57,19 +57,19 @@ export const AppsHomeDesktop = ({
|
||||
|
||||
<AppsContainer
|
||||
sx={{
|
||||
justifyContent: "flex-start",
|
||||
justifyContent: 'flex-start',
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
gap: "20px",
|
||||
alignItems: "center",
|
||||
backgroundColor: "#1f2023",
|
||||
padding: "7px",
|
||||
borderRadius: "20px",
|
||||
width: "100%",
|
||||
maxWidth: "500px",
|
||||
display: 'flex',
|
||||
gap: '20px',
|
||||
alignItems: 'center',
|
||||
backgroundColor: '#1f2023',
|
||||
padding: '7px',
|
||||
borderRadius: '20px',
|
||||
width: '100%',
|
||||
maxWidth: '500px',
|
||||
}}
|
||||
>
|
||||
<Input
|
||||
@ -83,24 +83,24 @@ export const AppsHomeDesktop = ({
|
||||
autoCorrect="off"
|
||||
placeholder="qortal://"
|
||||
sx={{
|
||||
width: "100%",
|
||||
color: "white",
|
||||
"& .MuiInput-input::placeholder": {
|
||||
color: "rgba(84, 84, 84, 0.70) !important",
|
||||
fontSize: "20px",
|
||||
fontStyle: "normal",
|
||||
width: '100%',
|
||||
color: 'white',
|
||||
'& .MuiInput-input::placeholder': {
|
||||
color: 'rgba(84, 84, 84, 0.70) !important',
|
||||
fontSize: '20px',
|
||||
fontStyle: 'normal',
|
||||
fontWeight: 400,
|
||||
lineHeight: "120%", // 24px
|
||||
letterSpacing: "0.15px",
|
||||
lineHeight: '120%', // 24px
|
||||
letterSpacing: '0.15px',
|
||||
opacity: 1,
|
||||
},
|
||||
"&:focus": {
|
||||
outline: "none",
|
||||
'&:focus': {
|
||||
outline: 'none',
|
||||
},
|
||||
// Add any additional styles for the input here
|
||||
}}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter" && qortalUrl) {
|
||||
if (e.key === 'Enter' && qortalUrl) {
|
||||
openQortalUrl();
|
||||
}
|
||||
}}
|
||||
@ -108,7 +108,7 @@ export const AppsHomeDesktop = ({
|
||||
<ButtonBase onClick={() => openQortalUrl()}>
|
||||
<ArrowOutwardIcon
|
||||
sx={{
|
||||
color: qortalUrl ? "white" : "rgba(84, 84, 84, 0.70)",
|
||||
color: qortalUrl ? 'white' : 'rgba(84, 84, 84, 0.70)',
|
||||
}}
|
||||
/>
|
||||
</ButtonBase>
|
||||
@ -119,18 +119,18 @@ export const AppsHomeDesktop = ({
|
||||
|
||||
<AppsContainer
|
||||
sx={{
|
||||
gap: "50px",
|
||||
justifyContent: "flex-start",
|
||||
gap: '50px',
|
||||
justifyContent: 'flex-start',
|
||||
}}
|
||||
>
|
||||
<ButtonBase
|
||||
onClick={() => {
|
||||
setMode("library");
|
||||
setMode('library');
|
||||
}}
|
||||
>
|
||||
<AppCircleContainer
|
||||
sx={{
|
||||
gap: !isMobile ? "10px" : "5px",
|
||||
gap: !isMobile ? '10px' : '5px',
|
||||
}}
|
||||
>
|
||||
<AppCircle>
|
||||
@ -150,7 +150,7 @@ export const AppsHomeDesktop = ({
|
||||
/>
|
||||
</AppsContainer>
|
||||
|
||||
<ThemeSelector style={{ position: "fixed", bottom: "1%", left: "0%" }} />
|
||||
<ThemeSelector style={{ position: 'fixed', bottom: '1%', left: '0%' }} />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
import { Box, ButtonBase, useTheme } from "@mui/material";
|
||||
import { HomeIcon } from "../assets/Icons/HomeIcon";
|
||||
import { MessagingIcon } from "../assets/Icons/MessagingIcon";
|
||||
import { Save } from "./Save/Save";
|
||||
import { IconWrapper } from "./Desktop/DesktopFooter";
|
||||
import { useRecoilState } from "recoil";
|
||||
import { enabledDevModeAtom } from "../atoms/global";
|
||||
import { AppsIcon } from "../assets/Icons/AppsIcon";
|
||||
import ThemeSelector from "./Theme/ThemeSelector";
|
||||
import { Box, ButtonBase, useTheme } from '@mui/material';
|
||||
import { HomeIcon } from '../assets/Icons/HomeIcon';
|
||||
import { MessagingIcon } from '../assets/Icons/MessagingIcon';
|
||||
import { Save } from './Save/Save';
|
||||
import { IconWrapper } from './Desktop/DesktopFooter';
|
||||
import { useRecoilState } from 'recoil';
|
||||
import { enabledDevModeAtom } from '../atoms/global';
|
||||
import { AppsIcon } from '../assets/Icons/AppsIcon';
|
||||
import ThemeSelector from '../styles/ThemeSelector';
|
||||
|
||||
export const DesktopSideBar = ({
|
||||
goToHome,
|
||||
@ -24,25 +24,25 @@ export const DesktopSideBar = ({
|
||||
}) => {
|
||||
const [isEnabledDevMode, setIsEnabledDevMode] =
|
||||
useRecoilState(enabledDevModeAtom);
|
||||
|
||||
|
||||
const theme = useTheme();
|
||||
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
width: "60px",
|
||||
flexDirection: "column",
|
||||
height: "100vh",
|
||||
alignItems: "center",
|
||||
display: "flex",
|
||||
gap: "25px",
|
||||
width: '60px',
|
||||
flexDirection: 'column',
|
||||
height: '100vh',
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
gap: '25px',
|
||||
}}
|
||||
>
|
||||
<ButtonBase
|
||||
sx={{
|
||||
width: "60px",
|
||||
height: "60px",
|
||||
paddingTop: "23px",
|
||||
width: '60px',
|
||||
height: '60px',
|
||||
paddingTop: '23px',
|
||||
}}
|
||||
onClick={() => {
|
||||
goToHome();
|
||||
@ -51,39 +51,39 @@ export const DesktopSideBar = ({
|
||||
<HomeIcon
|
||||
height={34}
|
||||
color={
|
||||
desktopViewMode === "home" ? "white" : "rgba(250, 250, 250, 0.5)"
|
||||
desktopViewMode === 'home' ? 'white' : 'rgba(250, 250, 250, 0.5)'
|
||||
}
|
||||
/>
|
||||
</ButtonBase>
|
||||
<ButtonBase
|
||||
onClick={() => {
|
||||
setDesktopViewMode("apps");
|
||||
setDesktopViewMode('apps');
|
||||
// setIsOpenSideViewDirects(false)
|
||||
// setIsOpenSideViewGroups(false)
|
||||
}}
|
||||
>
|
||||
<IconWrapper
|
||||
color={isApps ? "white" : "rgba(250, 250, 250, 0.5)"}
|
||||
color={isApps ? 'white' : 'rgba(250, 250, 250, 0.5)'}
|
||||
label="Apps"
|
||||
selected={isApps}
|
||||
disableWidth
|
||||
>
|
||||
<AppsIcon
|
||||
color={isApps ? "white" : "rgba(250, 250, 250, 0.5)"}
|
||||
color={isApps ? 'white' : 'rgba(250, 250, 250, 0.5)'}
|
||||
height={30}
|
||||
/>
|
||||
</IconWrapper>
|
||||
</ButtonBase>
|
||||
<ButtonBase
|
||||
onClick={() => {
|
||||
setDesktopViewMode("chat");
|
||||
setDesktopViewMode('chat');
|
||||
}}
|
||||
>
|
||||
<IconWrapper
|
||||
color={
|
||||
hasUnreadDirects || hasUnreadGroups
|
||||
? "var(--unread)"
|
||||
: theme.palette.text.primary
|
||||
? 'var(--unread)'
|
||||
: theme.palette.text.primary
|
||||
}
|
||||
label="Chat"
|
||||
disableWidth
|
||||
@ -92,7 +92,7 @@ export const DesktopSideBar = ({
|
||||
height={30}
|
||||
color={
|
||||
hasUnreadDirects || hasUnreadGroups
|
||||
? "var(--unread)"
|
||||
? 'var(--unread)'
|
||||
: theme.palette.text.primary
|
||||
}
|
||||
/>
|
||||
@ -121,24 +121,22 @@ export const DesktopSideBar = ({
|
||||
{isEnabledDevMode && (
|
||||
<ButtonBase
|
||||
onClick={() => {
|
||||
setDesktopViewMode("dev");
|
||||
setDesktopViewMode('dev');
|
||||
}}
|
||||
>
|
||||
<IconWrapper
|
||||
color={
|
||||
desktopViewMode === "dev" ? "white" : "rgba(250, 250, 250, 0.5)"
|
||||
desktopViewMode === 'dev' ? 'white' : 'rgba(250, 250, 250, 0.5)'
|
||||
}
|
||||
label="Dev"
|
||||
disableWidth
|
||||
>
|
||||
<AppsIcon
|
||||
height={30}
|
||||
/>
|
||||
<AppsIcon height={30} />
|
||||
</IconWrapper>
|
||||
</ButtonBase>
|
||||
)}
|
||||
|
||||
<ThemeSelector style={{ position: "fixed", bottom: "1%" }} />
|
||||
<ThemeSelector style={{ position: 'fixed', bottom: '1%' }} />
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
18
src/main.tsx
18
src/main.tsx
@ -1,13 +1,13 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import App from "./App.tsx";
|
||||
import "./index.css";
|
||||
import "./messaging/messagesToBackground";
|
||||
import { MessageQueueProvider } from "./MessageQueueContext.tsx";
|
||||
import { RecoilRoot } from "recoil";
|
||||
import { ThemeProvider } from "./components/Theme/ThemeContext.tsx";
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App.tsx';
|
||||
import './index.css';
|
||||
import './messaging/messagesToBackground';
|
||||
import { MessageQueueProvider } from './MessageQueueContext.tsx';
|
||||
import { RecoilRoot } from 'recoil';
|
||||
import { ThemeProvider } from './styles/ThemeContext.tsx';
|
||||
|
||||
ReactDOM.createRoot(document.getElementById("root")!).render(
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<>
|
||||
<ThemeProvider>
|
||||
<MessageQueueProvider>
|
||||
|
||||
@ -1,24 +1,19 @@
|
||||
import { createContext, useContext, useState, useMemo } from 'react';
|
||||
import { createTheme, ThemeProvider as MuiThemeProvider } from '@mui/material/styles';
|
||||
import { ThemeProvider as MuiThemeProvider } from '@mui/material/styles';
|
||||
import { darkTheme, lightTheme } from './theme';
|
||||
|
||||
const darkTheme = createTheme({
|
||||
palette: {
|
||||
mode: 'dark',
|
||||
},
|
||||
const ThemeContext = createContext({
|
||||
themeMode: 'light',
|
||||
toggleTheme: () => {},
|
||||
});
|
||||
|
||||
const lightTheme = createTheme({
|
||||
palette: {
|
||||
mode: 'light',
|
||||
},
|
||||
});
|
||||
|
||||
const ThemeContext = createContext({ themeMode: 'light', toggleTheme: () => {} });
|
||||
|
||||
export const ThemeProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
const [themeMode, setThemeMode] = useState('light');
|
||||
|
||||
const theme = useMemo(() => (themeMode === 'light' ? lightTheme : darkTheme), [themeMode]);
|
||||
const theme = useMemo(
|
||||
() => (themeMode === 'light' ? lightTheme : darkTheme),
|
||||
[themeMode]
|
||||
);
|
||||
|
||||
const toggleTheme = () => {
|
||||
setThemeMode((prevMode) => (prevMode === 'light' ? 'dark' : 'light'));
|
||||
@ -31,4 +26,4 @@ export const ThemeProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
);
|
||||
};
|
||||
|
||||
export const useThemeContext = () => useContext(ThemeContext);
|
||||
export const useThemeContext = () => useContext(ThemeContext);
|
||||
@ -1,54 +1,50 @@
|
||||
import { createTheme } from '@mui/material/styles'
|
||||
|
||||
import { createTheme } from '@mui/material/styles';
|
||||
|
||||
// Extend the Theme interface
|
||||
|
||||
const commonThemeOptions = {
|
||||
typography: {
|
||||
fontFamily: [
|
||||
'Roboto'
|
||||
].join(','),
|
||||
fontFamily: ['Roboto'].join(','),
|
||||
h1: {
|
||||
fontSize: '2rem',
|
||||
fontWeight: 600
|
||||
fontWeight: 600,
|
||||
},
|
||||
h2: {
|
||||
fontSize: '1.75rem',
|
||||
fontWeight: 500
|
||||
fontWeight: 500,
|
||||
},
|
||||
h3: {
|
||||
fontSize: '1.5rem',
|
||||
fontWeight: 500
|
||||
fontWeight: 500,
|
||||
},
|
||||
h4: {
|
||||
fontSize: '1.25rem',
|
||||
fontWeight: 500
|
||||
fontWeight: 500,
|
||||
},
|
||||
h5: {
|
||||
fontSize: '1rem',
|
||||
fontWeight: 500
|
||||
fontWeight: 500,
|
||||
},
|
||||
h6: {
|
||||
fontSize: '0.875rem',
|
||||
fontWeight: 500
|
||||
fontWeight: 500,
|
||||
},
|
||||
body1: {
|
||||
fontSize: '23px',
|
||||
fontWeight: 400,
|
||||
lineHeight: 1.5,
|
||||
letterSpacing: '0.5px'
|
||||
letterSpacing: '0.5px',
|
||||
},
|
||||
|
||||
body2: {
|
||||
fontSize: '18px',
|
||||
fontWeight: 400,
|
||||
lineHeight: 1.4,
|
||||
letterSpacing: '0.2px'
|
||||
}
|
||||
letterSpacing: '0.2px',
|
||||
},
|
||||
},
|
||||
spacing: 8,
|
||||
shape: {
|
||||
borderRadius: 4
|
||||
borderRadius: 4,
|
||||
},
|
||||
breakpoints: {
|
||||
values: {
|
||||
@ -56,8 +52,8 @@ const commonThemeOptions = {
|
||||
sm: 600,
|
||||
md: 900,
|
||||
lg: 1200,
|
||||
xl: 1536
|
||||
}
|
||||
xl: 1536,
|
||||
},
|
||||
},
|
||||
components: {
|
||||
MuiButton: {
|
||||
@ -66,25 +62,24 @@ const commonThemeOptions = {
|
||||
backgroundColor: 'inherit',
|
||||
transition: 'filter 0.3s ease-in-out',
|
||||
'&:hover': {
|
||||
filter: 'brightness(1.1)'
|
||||
}
|
||||
}
|
||||
filter: 'brightness(1.1)',
|
||||
},
|
||||
},
|
||||
},
|
||||
defaultProps: {
|
||||
disableElevation: true,
|
||||
disableRipple: true
|
||||
}
|
||||
disableRipple: true,
|
||||
},
|
||||
},
|
||||
MuiModal: {
|
||||
styleOverrides: {
|
||||
root: {
|
||||
zIndex: 50000,
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const lightTheme = createTheme({
|
||||
...commonThemeOptions,
|
||||
@ -93,19 +88,19 @@ const lightTheme = createTheme({
|
||||
primary: {
|
||||
main: '#f4f4fb',
|
||||
dark: '#eaecf4',
|
||||
light: '#f9f9fd'
|
||||
light: '#f9f9fd',
|
||||
},
|
||||
secondary: {
|
||||
main: '#1EAAF1'
|
||||
main: '#1EAAF1',
|
||||
},
|
||||
background: {
|
||||
default: '#fafafa',
|
||||
paper: '#f0f0f0'
|
||||
paper: '#f0f0f0',
|
||||
},
|
||||
text: {
|
||||
primary: '#000000',
|
||||
secondary: '#525252'
|
||||
}
|
||||
secondary: '#525252',
|
||||
},
|
||||
},
|
||||
|
||||
components: {
|
||||
@ -119,20 +114,20 @@ const lightTheme = createTheme({
|
||||
'&:hover': {
|
||||
cursor: 'pointer',
|
||||
boxShadow:
|
||||
'rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;'
|
||||
}
|
||||
}
|
||||
}
|
||||
'rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
MuiIcon: {
|
||||
defaultProps: {
|
||||
style: {
|
||||
color: '#000000'
|
||||
}
|
||||
}
|
||||
}
|
||||
color: '#000000',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
const darkTheme = createTheme({
|
||||
...commonThemeOptions,
|
||||
@ -140,45 +135,45 @@ const darkTheme = createTheme({
|
||||
mode: 'dark',
|
||||
primary: {
|
||||
main: '#2e3d60',
|
||||
dark: "#1a2744",
|
||||
light: "#3f4b66",
|
||||
dark: '#1a2744',
|
||||
light: '#3f4b66',
|
||||
},
|
||||
secondary: {
|
||||
main: '#45adff'
|
||||
main: '#45adff',
|
||||
},
|
||||
|
||||
background: {
|
||||
default: '#313338',
|
||||
paper: "#1e1e20"
|
||||
paper: '#1e1e20',
|
||||
},
|
||||
text: {
|
||||
primary: '#ffffff',
|
||||
secondary: '#b3b3b3'
|
||||
}
|
||||
secondary: '#b3b3b3',
|
||||
},
|
||||
},
|
||||
components: {
|
||||
MuiCard: {
|
||||
styleOverrides: {
|
||||
root: {
|
||||
boxShadow: "none",
|
||||
boxShadow: 'none',
|
||||
borderRadius: '8px',
|
||||
transition: 'all 0.3s ease-in-out',
|
||||
'&:hover': {
|
||||
cursor: 'pointer',
|
||||
boxShadow:
|
||||
' 0px 3px 4px 0px hsla(0,0%,0%,0.14), 0px 3px 3px -2px hsla(0,0%,0%,0.12), 0px 1px 8px 0px hsla(0,0%,0%,0.2);'
|
||||
}
|
||||
}
|
||||
}
|
||||
' 0px 3px 4px 0px hsla(0,0%,0%,0.14), 0px 3px 3px -2px hsla(0,0%,0%,0.12), 0px 1px 8px 0px hsla(0,0%,0%,0.2);',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
MuiIcon: {
|
||||
defaultProps: {
|
||||
style: {
|
||||
color: '#ffffff'
|
||||
}
|
||||
}
|
||||
}
|
||||
color: '#ffffff',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
});
|
||||
|
||||
export { lightTheme, darkTheme }
|
||||
export { lightTheme, darkTheme };
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user