Qortal/Qortal-Hub
1
0
Fork 0
mirror of https://github.com/Qortal/Qortal-Hub.git synced 2025-06-13 11:31:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Change sun color/background

Browse Source
This commit is contained in:
Nicola Benaglia 2025-04-12 17:05:17 +02:00
parent 6323820732
commit 8bb55b74f5
1 changed files with 33 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/Theme/ThemeSelector.tsx
View File

@ -1,58 +1,58 @@
import { useThemeContext } from "./ThemeContext"; import { useThemeContext } from './ThemeContext';
import { styled, Switch } from "@mui/material"; import { styled, Switch } from '@mui/material';
const ThemeSwitch = styled(Switch)(({ theme }) => ({ const ThemeSwitch = styled(Switch)(({ theme }) => ({
width: 62, width: 62,
height: 34, height: 34,
padding: 7, padding: 7,
"& .MuiSwitch-switchBase": { '& .MuiSwitch-switchBase': {
margin: 1, margin: 1,
padding: 0, padding: 0,
transform: "translateX(6px)", transform: 'translateX(6px)',
"&.Mui-checked": { '&.Mui-checked': {
color: "#fff", color: '#fff',
transform: "translateX(22px)", transform: 'translateX(22px)',
"& .MuiSwitch-thumb:before": { '& .MuiSwitch-thumb:before': {
backgroundImage: `url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 20 20"><path fill="${encodeURIComponent( backgroundImage: `url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 20 20"><path fill="${encodeURIComponent(
"#fff" '#fff'
)}" d="M4.2 2.5l-.7 1.8-1.8.7 1.8.7.7 1.8.6-1.8L6.7 5l-1.9-.7-.6-1.8zm15 8.3a6.7 6.7 0 11-6.6-6.6 5.8 5.8 0 006.6 6.6z"/></svg>')`, )}" d="M4.2 2.5l-.7 1.8-1.8.7 1.8.7.7 1.8.6-1.8L6.7 5l-1.9-.7-.6-1.8zm15 8.3a6.7 6.7 0 11-6.6-6.6 5.8 5.8 0 006.6 6.6z"/></svg>')`,
}, },
"& + .MuiSwitch-track": { '& + .MuiSwitch-track': {
opacity: 1, opacity: 1,
backgroundColor: "#aab4be", backgroundColor: '#aab4be',
...theme.applyStyles("dark", { ...theme.applyStyles('dark', {
backgroundColor: "#8796A5", backgroundColor: '#8796A5',
}), }),
}, },
}, },
}, },
"& .MuiSwitch-thumb": { '& .MuiSwitch-thumb': {
backgroundColor: "#001e3c", backgroundColor: '#fde402',
width: 32, width: 32,
height: 32, height: 32,
"&::before": { '&::before': {
content: "''", content: "''",
position: "absolute", position: 'absolute',
width: "100%", width: '100%',
height: "100%", height: '100%',
left: 0, left: 0,
top: 0, top: 0,
backgroundRepeat: "no-repeat", backgroundRepeat: 'no-repeat',
backgroundPosition: "center", backgroundPosition: 'center',
backgroundImage: `url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 20 20"><path fill="${encodeURIComponent( backgroundImage: `url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 20 20"><path fill="${encodeURIComponent(
"#fff" '#000000'
)}" d="M9.305 1.667V3.75h1.389V1.667h-1.39zm-4.707 1.95l-.982.982L5.09 6.072l.982-.982-1.473-1.473zm10.802 0L13.927 5.09l.982.982 1.473-1.473-.982-.982zM10 5.139a4.872 4.872 0 00-4.862 4.86A4.872 4.872 0 0010 14.862 4.872 4.872 0 0014.86 10 4.872 4.872 0 0010 5.139zm0 1.389A3.462 3.462 0 0113.471 10a3.462 3.462 0 01-3.473 3.472A3.462 3.462 0 016.527 10 3.462 3.462 0 0110 6.528zM1.665 9.305v1.39h2.083v-1.39H1.666zm14.583 0v1.39h2.084v-1.39h-2.084zM5.09 13.928L3.616 15.4l.982.982 1.473-1.473-.982-.982zm9.82 0l-.982.982 1.473 1.473.982-.982-1.473-1.473zM9.305 16.25v2.083h1.389V16.25h-1.39z"/></svg>')`, )}" d="M9.305 1.667V3.75h1.389V1.667h-1.39zm-4.707 1.95l-.982.982L5.09 6.072l.982-.982-1.473-1.473zm10.802 0L13.927 5.09l.982.982 1.473-1.473-.982-.982zM10 5.139a4.872 4.872 0 00-4.862 4.86A4.872 4.872 0 0010 14.862 4.872 4.872 0 0014.86 10 4.872 4.872 0 0010 5.139zm0 1.389A3.462 3.462 0 0113.471 10a3.462 3.462 0 01-3.473 3.472A3.462 3.462 0 016.527 10 3.462 3.462 0 0110 6.528zM1.665 9.305v1.39h2.083v-1.39H1.666zm14.583 0v1.39h2.084v-1.39h-2.084zM5.09 13.928L3.616 15.4l.982.982 1.473-1.473-.982-.982zm9.82 0l-.982.982 1.473 1.473.982-.982-1.473-1.473zM9.305 16.25v2.083h1.389V16.25h-1.39z"/></svg>')`,
}, },
...theme.applyStyles("dark", { ...theme.applyStyles('dark', {
backgroundColor: "#003892", backgroundColor: '#003892',
}), }),
}, },
"& .MuiSwitch-track": { '& .MuiSwitch-track': {
opacity: 1, opacity: 1,
backgroundColor: "#aab4be", backgroundColor: '#aab4be',
borderRadius: 20 / 2, borderRadius: 20 / 2,
...theme.applyStyles("dark", { ...theme.applyStyles('dark', {
backgroundColor: "#8796A5", backgroundColor: '#8796A5',
}), }),
}, },
})); }));
@ -62,14 +62,14 @@ const ThemeSelector = ({ style }) => {
return ( return (
<div <div
style={{ style={{
display: "flex", display: 'flex',
flexDirection: "column", flexDirection: 'column',
alignItems: "center", alignItems: 'center',
gap: "1px", gap: '1px',
...style, ...style,
}} }}
> >
<ThemeSwitch checked={themeMode === "dark"} onChange={toggleTheme} /> <ThemeSwitch checked={themeMode === 'dark'} onChange={toggleTheme} />
</div> </div>
); );
}; };