fix: show light/dark button according to site setting

This commit is contained in:
satnaing
2025-03-07 19:52:05 +07:00
committed by Sat Naing
parent b995f4dada
commit 39ed4898a3
+16 -16
View File
@@ -117,22 +117,22 @@ const isActive = (path: string) => {
<span class="sr-only">Search</span> <span class="sr-only">Search</span>
</LinkButton> </LinkButton>
</li> </li>
<li class="col-span-1 flex items-center justify-center"> {
<button SITE.lightAndDarkMode && (
id="theme-btn" <li class="col-span-1 flex items-center justify-center">
class="focus-outline relative size-12 p-4 sm:size-8 hover:[&>svg]:stroke-accent" <button
title="Toggles light & dark" id="theme-btn"
aria-label="auto" class="focus-outline relative size-12 p-4 sm:size-8 hover:[&>svg]:stroke-accent"
aria-live="polite" title="Toggles light & dark"
> aria-label="auto"
<IconMoon aria-live="polite"
class="absolute top-[50%] left-[50%] -translate-[50%] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" >
/> <IconMoon class="absolute top-[50%] left-[50%] -translate-[50%] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
<IconSunHigh <IconSunHigh class="absolute top-[50%] left-[50%] -translate-[50%] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
class="absolute top-[50%] left-[50%] -translate-[50%] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" </button>
/> </li>
</button> )
</li> }
</ul> </ul>
</nav> </nav>
</div> </div>