Make the ThemeToggle look decent, unhide it

next-virtuoso-proof
Alex Gleason 2 years ago
parent 04e3b91c29
commit f9d01dab0a
No known key found for this signature in database
GPG Key ID: 7211D1F99744FBB7

@ -68,9 +68,7 @@ const Navbar = () => {
</div> </div>
<div className='absolute inset-y-0 right-0 flex items-center pr-2 lg:static lg:inset-auto lg:ml-6 lg:pr-0 space-x-3'> <div className='absolute inset-y-0 right-0 flex items-center pr-2 lg:static lg:inset-auto lg:ml-6 lg:pr-0 space-x-3'>
{settings.get('isDeveloper') && ( <ThemeToggle />
<ThemeToggle />
)}
{account ? ( {account ? (
<div className='hidden relative lg:flex items-center'> <div className='hidden relative lg:flex items-center'>

@ -37,8 +37,8 @@ function ThemeToggle({ showLabel }: IThemeToggle) {
id={id} id={id}
checked={themeMode === 'light'} checked={themeMode === 'light'}
icons={{ icons={{
checked: <Icon src={require('@tabler/icons/icons/sun.svg')} />, checked: <Icon className='w-4 h-4' src={require('@tabler/icons/icons/sun.svg')} />,
unchecked: <Icon src={require('@tabler/icons/icons/moon.svg')} />, unchecked: <Icon className='w-4 h-4' src={require('@tabler/icons/icons/moon.svg')} />,
}} }}
onChange={onToggle} onChange={onToggle}
/> />

@ -27,8 +27,11 @@
} }
} }
.svg-icon { .react-toggle-track {
width: 18px; @apply dark:bg-slate-600;
height: 18px; }
.react-toggle-thumb {
@apply dark:bg-slate-900 dark:border-slate-800;
} }
} }

Loading…
Cancel
Save