Merge pull request #30 from tangly1024/theme-Next

微调组件、去掉右侧adsense

components/Card.js

@@ -1,7 +1,7 @@
 const Card = ({ children, headerSlot, className }) => {
   return <div className={className}>
     <>{headerSlot}</>
-    <section className="shadow mb-5 px-2 py-4 bg-white dark:bg-gray-800 hover:shadow-xl duration-200">
+    <section className="shadow px-2 py-4 bg-white dark:bg-gray-800 hover:shadow-xl duration-200">
         {children}
     </section>
   </div>

components/Collapse.js

@@ -28,7 +28,7 @@ const Collapse = props => {
     }
   }, [props.isOpen])
   return (
-    <div ref={collapseRef} className='overflow-hidden duration-200'>
+    <div ref={collapseRef} style={{ height: '0px' }} className='overflow-hidden duration-200'>
       {props.children}
     </div>
   )

components/Footer.js

@@ -1,25 +1,27 @@
-import { faCopyright, faEye, faShieldAlt, faUsers } from '@fortawesome/free-solid-svg-icons'
+import { faCopyright, faEye, faShieldAlt, faUsers, faHeart } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import React from 'react'
 import BLOG from '@/blog.config'
 
 const Footer = ({ title }) => {
   const d = new Date()
-  const y = d.getFullYear()
+  const currentYear = d.getFullYear()
+  const startYear = BLOG.since && BLOG.since !== currentYear && BLOG.since + '-'
   return (
     <footer
-      className='dark:bg-gray-900 flex-shrink-0 justify-center text-center m-auto w-full text-gray-400 text-sm p-6'
+      className='dark:bg-gray-900 flex-shrink-0 justify-center text-center m-auto w-full leading-6 text-gray-400 text-sm p-6'
     >
-      <FontAwesomeIcon icon={faCopyright} /> {` ${y}`} <span> <a href={BLOG.link} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.author}</a>. Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext</a>.</span>
-      <br />
-      <FontAwesomeIcon icon={faShieldAlt} /> <a href='https://beian.miit.gov.cn/' className='ml-1 font-bold'>闽ICP备20010331号</a>
-      {/* <span > <Link href='/article/privacy-policy' ><a className='ml-1 mr-1 font-bold underline'>隐私政策</a></Link></span> */}
+      <FontAwesomeIcon icon={faCopyright} /> {`${startYear}${currentYear}`} <span><FontAwesomeIcon icon={faHeart} className='mx-1 animate-pulse'/> <a href={BLOG.link} className='underline font-bold text-gray-500 dark:text-gray-300 '>{BLOG.author}</a>.
+      <br/>
 
+      <span>Powered by <a href='https://notion.so' className='underline font-bold text-gray-500 dark:text-gray-300'>Notion</a> & <a href='https://github.com/tangly1024/NotionNext' className='underline font-bold text-gray-500 dark:text-gray-300'>NotionNext</a>.</span></span>
+      <br />
+
+      <FontAwesomeIcon icon={faShieldAlt} /> <a href='https://beian.miit.gov.cn/' className='mr-2 font-bold'>闽ICP备20010331号</a>
       <span className='hidden busuanzi_container_site_pv'>
-            <FontAwesomeIcon icon={faEye}/><span className='px-1 busuanzi_value_site_pv'> </span>pv
-      </span>
+            <FontAwesomeIcon icon={faEye}/><span className='px-1 busuanzi_value_site_pv'> </span>  </span>
       <span className='pl-2 hidden busuanzi_container_site_uv'>
-        <FontAwesomeIcon icon={faUsers}/> <span className='px-1 busuanzi_value_site_uv'> </span>uv   </span>
+        <FontAwesomeIcon icon={faUsers}/> <span className='px-1 busuanzi_value_site_uv'> </span> </span>
         <br/>
         <h1>{title}</h1>
     </footer>

components/SideAreaRight.js

@@ -39,17 +39,17 @@ const SideAreaRight = ({
 
   return (<aside id='right' className='hidden 2xl:block flex-col w-60 ml-4'>
 
-      <Card>
-              {/* 展示广告  */}
-              <ins
-                className="adsbygoogle"
-                style={{ display: 'block' }}
-                data-adtest="on"
-                data-ad-client="ca-pub-2708419466378217"
-                data-ad-slot="8807314373"
-                data-ad-format="auto"
-                data-full-width-responsive="true"
-              ></ins>
+      <Card className='mb-2'>
+          {/* 展示广告  */}
+          <ins
+            className="adsbygoogle"
+            style={{ display: 'block' }}
+            data-adtest="on"
+            data-ad-client="ca-pub-2708419466378217"
+            data-ad-slot="8807314373"
+            data-ad-format="auto"
+            data-full-width-responsive="true"
+          ></ins>
       </Card>
 
       <div className="sticky top-4">