fix[frontend]: fix frontend blink

Author: SharzyL

frontend/components/DarkModeToggle.tsx

@@ -40,7 +40,7 @@ export function DarkModeToggle({ mode, onModeChange, className, ...rest }: MyCom
     <Tooltip content={`Toggle dark mode (currently ${mode})`}>
       <Button
         isIconOnly
-        className={"mr-2 rounded-full bg-background hover:bg-gray-100" + " " + className}
+        className={"mr-2 rounded-full bg-background hover:bg-default-100" + " " + className}
         aria-label="Toggle dark mode"
         onPress={() => {
           const curModeIdx = icons.findIndex(({ name }) => name === mode)

frontend/components/DecryptPaste.tsx

@@ -141,11 +141,11 @@ export function DecryptPaste() {
 
   const showFileContent = pasteFile && (!isFileBinary || forceShowBinary)
 
-  const buttonClasses = "rounded-full bg-background hover:bg-gray-100"
+  const buttonClasses = "rounded-full bg-background hover:bg-default-100"
   return (
     <main
       className={
-        "flex flex-col items-center min-h-screen bg-background text-foreground w-full p-2" +
+        "flex flex-col items-center min-h-screen transition-transform-background bg-background text-foreground w-full p-2" +
         (shouldBeDark(darkModeSelect) ? " dark" : " light")
       }
     >

frontend/components/PasteBin.tsx

@@ -278,7 +278,7 @@ export function PasteBin() {
   return (
     <main
       className={
-        "flex flex-col items-center min-h-screen font-sans bg-background text-foreground" +
+        "flex flex-col items-center min-h-screen font-sans transition-transform-background bg-background text-foreground" +
         (shouldBeDark(darkModeSelect) ? " dark" : " light")
       }
     >