✨ theme switch
This commit is contained in:
parent
c49c61dd2a
commit
f3313a517b
@ -165,6 +165,36 @@ const Header = () => {
|
|||||||
|
|
||||||
<div className="flex items-center justify-end space-x-1.5 ltr:ml-auto rtl:mr-auto rtl:space-x-reverse dark:text-[#d0d2d6] sm:flex-1 ltr:sm:ml-0 sm:rtl:mr-0 lg:space-x-2">
|
<div className="flex items-center justify-end space-x-1.5 ltr:ml-auto rtl:mr-auto rtl:space-x-reverse dark:text-[#d0d2d6] sm:flex-1 ltr:sm:ml-0 sm:rtl:mr-0 lg:space-x-2">
|
||||||
|
|
||||||
|
{/* ------------------- Start Theme Switch ------------------- */}
|
||||||
|
<div>
|
||||||
|
{themeConfig.theme === 'light' ? (
|
||||||
|
<button
|
||||||
|
className={`${
|
||||||
|
themeConfig.theme === 'light' &&
|
||||||
|
'flex items-center rounded-full bg-white-light/40 p-2 hover:bg-white-light/90 hover:text-primary dark:bg-dark/40 dark:hover:bg-dark/60'
|
||||||
|
}`}
|
||||||
|
onClick={() => dispatch(toggleTheme('dark'))}
|
||||||
|
>
|
||||||
|
<IconSun />
|
||||||
|
</button>
|
||||||
|
) : (
|
||||||
|
''
|
||||||
|
)}
|
||||||
|
{themeConfig.theme === 'dark' && (
|
||||||
|
<button
|
||||||
|
className={`${
|
||||||
|
themeConfig.theme === 'dark' &&
|
||||||
|
'flex items-center rounded-full bg-white-light/40 p-2 hover:bg-white-light/90 hover:text-primary dark:bg-dark/40 dark:hover:bg-dark/60'
|
||||||
|
}`}
|
||||||
|
onClick={() => dispatch(toggleTheme('light'))}
|
||||||
|
>
|
||||||
|
<IconMoon />
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
{/* ------------------- End Theme Switch ------------------- */}
|
||||||
|
|
||||||
|
|
||||||
<div className="dropdown flex shrink-0">
|
<div className="dropdown flex shrink-0">
|
||||||
<Dropdown
|
<Dropdown
|
||||||
offset={[0, 8]}
|
offset={[0, 8]}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user