From 0e55d8e9d3f5d48f7410d821608d9368d2029ef2 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Thu, 11 Nov 2021 10:55:52 +0800
Subject: [PATCH] =?UTF-8?q?=E6=82=AC=E6=B5=AE=E6=8C=89=E9=92=AE=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/JumpToTopButton.js | 9 ++++-----
 components/TocDrawerButton.js | 6 +++---
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/components/JumpToTopButton.js b/components/JumpToTopButton.js
index 4a949db0..69349846 100644
--- a/components/JumpToTopButton.js
+++ b/components/JumpToTopButton.js
@@ -22,7 +22,6 @@ const JumpToTopButton = ({ targetRef, showPercent = true }) => {
     if (per > 100) per = 100
     const shouldShow = scrollY > 100 && per > 0
 
-
     if (shouldShow !== show) {
       switchShow(shouldShow)
     }
@@ -34,15 +33,15 @@ const JumpToTopButton = ({ targetRef, showPercent = true }) => {
   }, [show])
 
   return (
-    <div id='jump-to-top' className='right-0 fixed flex bottom-36 mr-4 duration-500 z-20'>
+    <div id='jump-to-top' className='right-0 fixed flex bottom-36 mr-4 duration-500 z-20 opacity-75'>
       <div >
         <div
           onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
           style={{ boxShadow: 'rgba(41, 50, 60, 0.5) 0px 2px 16px', borderRadius: '28px' }}
-          className={(show ? 'animate__fadeInUp' : 'animate__fadeOutUp') + ' bg-gray-700 px-1 py-1 cursor-pointer animate__animated animate__faster shadow-2xl'}>
+          className={(show ? 'animate__fadeInUp' : 'animate__fadeOutUp') + ' bg-white dark:bg-gray-700 px-1 py-1 cursor-pointer animate__animated animate__faster shadow-2xl'}>
           <div className='text-center'>
-            <div className='w-10 text-xl text-gray-100 transform hover:scale-125 duration-200' title={locale.POST.TOP} ><i className='fa fa-arrow-up'/> </div>
-            {showPercent && (<div className='w-10 text-xs text-gray-100 dark:text-gray-200'>{percent} </div>)}
+            <div className='w-10 text-xl dark:text-gray-100 transform hover:scale-125 duration-200' title={locale.POST.TOP} ><i className='fa fa-arrow-up'/> </div>
+            {showPercent && (<div className='w-10 text-xs dark:text-gray-200'>{percent} </div>)}
           </div>
         </div>
       </div>
diff --git a/components/TocDrawerButton.js b/components/TocDrawerButton.js
index 39f9f98e..7a60d58a 100644
--- a/components/TocDrawerButton.js
+++ b/components/TocDrawerButton.js
@@ -10,11 +10,11 @@ import React from 'react'
  */
 const TocDrawerButton = (props) => {
   return (
-    <div id='jump-to-top' className='right-0 fixed flex bottom-52 mr-4 duration-500 z-30' onClick={props.onClick}>
+    <div id='toc-drawer-button' className='right-0 fixed flex top-2 mr-4 duration-500 z-10 opacity-75' 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'}>
-          <div className='text-center text-gray-100'>
+          className={'animate__fadeInUp bg-white dark:bg-gray-700 px-1 py-1 cursor-pointer animate__animated animate__faster shadow-xl'}>
+          <div className='text-center dark:text-gray-100'>
             <div className='w-10 text-xl' title='目录' ><i className='fa fa-book'/> </div>
             <div className='text-xs'>目录</div>
           </div>