From 1fca1281f9f4318e9baa0ee4b7eaaef8c59af64e Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Wed, 29 Sep 2021 13:16:40 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=95=B6=20=E4=BE=A7=E8=BE=B9=E6=A0=8F?=
 =?UTF-8?q?=E5=BE=AE=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Footer.js       | 11 ++---------
 components/SideBar.js      | 22 ++++++++++++++++------
 components/SocialButton.js |  2 +-
 layouts/DefaultLayout.js   |  8 ++++----
 4 files changed, 23 insertions(+), 20 deletions(-)

diff --git a/components/Footer.js b/components/Footer.js
index 7b477f8f..2fd97a54 100644
--- a/components/Footer.js
+++ b/components/Footer.js
@@ -1,6 +1,5 @@
 import BLOG from '@/blog.config'
 import React from 'react'
-import SocialButton from '@/components/SocialButton'
 
 const Footer = ({ fullWidth = true }) => {
   const d = new Date()
@@ -10,14 +9,8 @@ const Footer = ({ fullWidth = true }) => {
     <footer
       className='flex-shrink-0 m-auto w-full text-gray-500 dark:text-gray-400'
     >
-      <div className='py-2'>
-        <span className='text-xl border-b-2'>联系我</span>
-        <div className='py-2'>
-          <SocialButton />
-        </div>
-      </div>
-
-      <div className='text-sm py-4 text-gray-400'>
+      <div className='text-sm text-gray-400'>
+        <hr className='py-2'/>
         <span className='fa fa-shield leading-6'><a href='https://beian.miit.gov.cn/'
                                                     className='ml-1'>闽ICP备20010331号</a></span>
         <br />
diff --git a/components/SideBar.js b/components/SideBar.js
index afdf96cd..f82798ec 100644
--- a/components/SideBar.js
+++ b/components/SideBar.js
@@ -8,6 +8,7 @@ import DarkModeButton from '@/components/DarkModeButton'
 import Footer from '@/components/Footer'
 import throttle from 'lodash.throttle'
 import TocBar from '@/components/TocBar'
+import SocialButton from '@/components/SocialButton'
 
 const SideBar = ({ tags, currentTag, toc }) => {
   const locale = useLocale()
@@ -36,7 +37,7 @@ const SideBar = ({ tags, currentTag, toc }) => {
       changeCollapse(true)
     }
   }, 500)
-  const [collapse, changeCollapse] = useState(true)
+  const [collapse, changeCollapse] = useState(false)
 
   return <aside className='z-10'>
 
@@ -77,10 +78,10 @@ const SideBar = ({ tags, currentTag, toc }) => {
 
         {/* 菜单 */}
         <nav className='py-4'>
-          <div className='mb-3'>
-            <span className='text-xl border-b-2 text-gray-500 dark:text-gray-400'>菜单</span>
+          <div>
+            <strong className='text-xl text-gray-600 dark:text-gray-400'>菜单</strong>
           </div>
-          <ul className='leading-8 dark:text-gray-400'>
+          <ul className='leading-8 text-gray-500 dark:text-gray-400'>
             <li><a className='fa fa-info hover:underline' href='/article/about' id='about'><span
               className='ml-2'>关于本站</span></a></li>
             <li><a className='fa fa-rss hover:underline' href='/feed' target='_blank' id='feed'><span
@@ -90,12 +91,21 @@ const SideBar = ({ tags, currentTag, toc }) => {
 
         {/* 标签云  */}
         <section className=''>
-          <div className='mb-3'>
-            <span className='text-xl border-b-2 text-gray-500 dark:text-gray-400'>标签</span>
+          <div>
+            <strong className='text-xl text-gray-600 dark:text-gray-400'>标签</strong>
           </div>
           <Tags tags={tags} currentTag={currentTag} />
         </section>
 
+        <section>
+          <div className='mt-4'>
+            <strong className='text-xl text-gray-600 dark:text-gray-400'>联系我</strong>
+            <div className='py-2'>
+              <SocialButton />
+            </div>
+          </div>
+        </section>
+
         <section className='pt-2'>
           {/* 站点信息 */}
           <Footer />
diff --git a/components/SocialButton.js b/components/SocialButton.js
index 8bbaa9fb..9b88a7b9 100644
--- a/components/SocialButton.js
+++ b/components/SocialButton.js
@@ -2,7 +2,7 @@ import React from 'react'
 
 const SocialButton = () => {
   return <>
-    <div className='space-x-3 text-2xl'>
+    <div className='space-x-3 text-2xl text-gray-500 dark:text-gray-400'>
       <a className='fa fa-github' target='_blank' rel='noreferrer' title={'github'}
          href={'https://github.com/tangly1024'} />
       <a className='fa fa-twitter' target='_blank' rel='noreferrer' title={'twitter'}
diff --git a/layouts/DefaultLayout.js b/layouts/DefaultLayout.js
index dbe21327..cce644a1 100644
--- a/layouts/DefaultLayout.js
+++ b/layouts/DefaultLayout.js
@@ -50,14 +50,14 @@ const DefaultLayout = ({ tags, posts, page, currentTag, ...customMeta }) => {
     // if (ref) {
     //   ref.remove()
     // }
-    window.addEventListener('resize', resizeWindowHideToc)
-    resizeWindowHideToc()
+    window.addEventListener('resize', changeColumnCount)
+    changeColumnCount()
     return () => {
-      window.removeEventListener('resize', resizeWindowHideToc)
+      window.removeEventListener('resize', changeColumnCount)
     }
   }, [])
 
-  const resizeWindowHideToc = throttle(() => {
+  const changeColumnCount = throttle(() => {
     if (window.innerWidth > 2500) {
       changeColumn(5)
     } else if (window.innerWidth > 1800) {