feature: 调整Hexo 页面

components/Comment.js

@@ -1,7 +1,6 @@
 import BLOG from '@/blog.config'
 import dynamic from 'next/dynamic'
 import { useRouter } from 'next/router'
-import { useGlobal } from '@/lib/global'
 import 'gitalk/dist/gitalk.css'
 import Tabs from '@/components/Tabs'
 
@@ -19,30 +18,25 @@ const UtterancesComponent = dynamic(
 )
 const CusdisComponent = dynamic(
   () => {
-    return import('react-cusdis').then(m => m.ReactCusdis)
+    return import('@/components/Cusdis')
   },
   { ssr: false }
 )
 
 const Comment = ({ frontMatter }) => {
   const router = useRouter()
-  const { theme } = useGlobal()
   return (
-    <div className='comment mt-5 px-10 text-gray-800 dark:text-gray-300'>
+    <div className='comment mt-5 px-5 text-gray-800 dark:text-gray-300'>
       <Tabs>
         {BLOG.COMMENT_CUSDIS_APP_ID && (<div key='Cusdis'>
-          <CusdisComponent
-            attrs={{
-              host: BLOG.COMMENT_CUSDIS_HOST,
-              appId: BLOG.COMMENT_CUSDIS_APP_ID,
-              pageId: frontMatter.id,
-              pageTitle: frontMatter.title,
-              pageUrl: BLOG.LINK + router.asPath,
-              theme: theme
-            }}
-            lang={BLOG.LANG.toLowerCase()}
-          />
+          <CusdisComponent id={frontMatter.id} url={BLOG.LINK + router.asPath} title={frontMatter.title} />
         </div>)}
+
+        {BLOG.COMMENT_UTTERRANCES_REPO && (<div key='Utterance'>
+          <UtterancesComponent issueTerm={frontMatter.id} className='px-2' />
+        </div>
+        )}
+
         {BLOG.COMMENT_GITALK_CLIENT_ID && (<div key='GitTalk'>
           <GitalkComponent
             options={{
@@ -57,10 +51,7 @@ const Comment = ({ frontMatter }) => {
             }}
           />
         </div>)}
-        {BLOG.COMMENT_UTTERRANCES_REPO && (<div key='Utterance'>
-            <UtterancesComponent issueTerm={frontMatter.id} className='px-2' />
-          </div>
-        )}
+
       </Tabs>
     </div>
   )