From ee51b8269c35257e4fe4102dfd30af0be4006b15 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Fri, 5 Nov 2021 17:47:27 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=9C=E9=97=B4=E6=A8=A1=E5=BC=8F=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/DarkModeButton.js  | 2 +-
 components/JumpToTopButton.js | 2 +-
 components/TocDrawerButton.js | 2 +-
 layouts/BaseLayout.js         | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/components/DarkModeButton.js b/components/DarkModeButton.js
index 7450ac3d..d1aca4fd 100644
--- a/components/DarkModeButton.js
+++ b/components/DarkModeButton.js
@@ -9,7 +9,7 @@ const DarkModeButton = () => {
     saveTheme(newTheme)
     changeTheme(newTheme)
   }
-  return <div className='z-10 p-1 duration-200 h-12 text-xl cursor-pointer dark:text-gray-300 '>
+  return <div className='z-10 duration-200 text-xl cursor-pointer'>
     <i id='darkModeButton' className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (userTheme === 'dark' ? 'fa-sun-o' : 'fa-moon-o')}
        onClick={handleChangeDarkMode} />
   </div>
diff --git a/components/JumpToTopButton.js b/components/JumpToTopButton.js
index 71dea964..69db5db8 100644
--- a/components/JumpToTopButton.js
+++ b/components/JumpToTopButton.js
@@ -32,7 +32,7 @@ const JumpToTopButton = ({ targetRef, showPercent = true }) => {
   }, [show])
 
   return (
-    <div id='jump-to-top' className='right-0 fixed flex bottom-24 mr-4 duration-500 z-20'>
+    <div id='jump-to-top' className='right-0 fixed flex bottom-36 mr-4 duration-500 z-20'>
       <div >
         <div
           onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
diff --git a/components/TocDrawerButton.js b/components/TocDrawerButton.js
index 2ab87a41..39f9f98e 100644
--- a/components/TocDrawerButton.js
+++ b/components/TocDrawerButton.js
@@ -10,7 +10,7 @@ import React from 'react'
  */
 const TocDrawerButton = (props) => {
   return (
-    <div id='jump-to-top' className='right-0 fixed flex bottom-40 mr-4 duration-500 z-30' onClick={props.onClick}>
+    <div id='jump-to-top' className='right-0 fixed flex bottom-52 mr-4 duration-500 z-30' onClick={props.onClick}>
       <div className='transform hover:scale-105 duration-200 '>
         <div style={{ boxShadow: 'rgba(41, 50, 60, 0.5) 0px 2px 16px', borderRadius: '28px' }}
           className={'animate__fadeInUp bg-gray-700 px-1 py-1 cursor-pointer animate__animated animate__faster shadow-2xl'}>
diff --git a/layouts/BaseLayout.js b/layouts/BaseLayout.js
index 4da6e219..360005d7 100644
--- a/layouts/BaseLayout.js
+++ b/layouts/BaseLayout.js
@@ -81,7 +81,7 @@ const BaseLayout = ({
           {children}
         </div>
         <JumpToTopButton targetRef={targetRef} showPercent={true} />
-        <div className='fixed right-2 top-2 p-0.5 shadow-2xl bg-white border dark:border-gray-500 dark:bg-gray-700 rounded-full'>
+        <div className='fixed right-4 top-4 p-1 bg-gray-700 dark:border-gray-500 dark:bg-gray-700 rounded-full text-white' style={{ boxShadow: 'rgba(41, 50, 60, 0.5) 0px 2px 16px', borderRadius: '28px' }}>
           <DarkModeButton/>
         </div>
       </main>