Merge branch 'main' of github.com:tangly1024/NotionNext

Ylarod · Sep 26, 2023 · 1215894 · 1215894 · vercel · Sep 26, 2023
2 parents adbd47b + 8e01d07
commit 1215894
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 36 deletions.
diff --git a/themes/heo/index.js b/themes/heo/index.js
@@ -1,7 +1,7 @@
 import CONFIG from './config'
 
 import CommonHead from '@/components/CommonHead'
-import { useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import Footer from './components/Footer'
 import SideRight from './components/SideRight'
 import NavBar from './components/NavBar'
@@ -123,11 +123,13 @@ const LayoutIndex = props => {
       <div id="post-outer-wrapper" className="px-5 md:px-0">
         {/* 文章分类条 */}
         <CategoryBar {...props} />
-        {BLOG.POST_LIST_STYLE === 'page' ? (
+        {BLOG.POST_LIST_STYLE === 'page'
+          ? (
           <BlogPostListPage {...props} />
-        ) : (
+            )
+          : (
           <BlogPostListScroll {...props} />
-        )}
+            )}
       </div>
     </LayoutBase>
   )
@@ -155,11 +157,13 @@ const LayoutPostList = props => {
       <div id="post-outer-wrapper" className="px-5  md:px-0">
         {/* 文章分类条 */}
         <CategoryBar {...props} />
-        {BLOG.POST_LIST_STYLE === 'page' ? (
+        {BLOG.POST_LIST_STYLE === 'page'
+          ? (
           <BlogPostListPage {...props} />
-        ) : (
+            )
+          : (
           <BlogPostListScroll {...props} />
-        )}
+            )}
       </div>
     </LayoutBase>
   )
@@ -206,17 +210,21 @@ const LayoutSearch = props => {
       headerSlot={headerSlot}
     >
       <div id="post-outer-wrapper" className="px-5  md:px-0">
-        {!currentSearch ? (
+        {!currentSearch
+          ? (
           <SearchNav {...props} />
-        ) : (
+            )
+          : (
           <div id="posts-wrapper">
-            {BLOG.POST_LIST_STYLE === 'page' ? (
+            {BLOG.POST_LIST_STYLE === 'page'
+              ? (
               <BlogPostListPage {...props} />
-            ) : (
+                )
+              : (
               <BlogPostListScroll {...props} />
-            )}
+                )}
           </div>
-        )}
+            )}
       </div>
     </LayoutBase>
   )
@@ -272,6 +280,13 @@ const LayoutSlug = props => {
   const { post, lock, validPassword } = props
   const { locale } = useGlobal()
 
+  const [hasCode, setHasCode] = useState(false)
+
+  useEffect(() => {
+    const hasCode = document.querySelectorAll('[class^="language-"]').length > 0
+    setHasCode(hasCode)
+  }, [])
+
   // 右侧栏
   const slotRight = <SideRight {...props} />
   const headerSlot = (
@@ -298,7 +313,7 @@ const LayoutSlug = props => {
       showTag={false}
       slotRight={slotRight}
     >
-      <div className="w-full max-w-5xl lg:hover:shadow lg:border rounded-2xl lg:px-2 lg:py-4 bg-white dark:bg-[#18171d] dark:border-gray-600 article">
+      <div className={`w-full xl:max-w-5xl ${hasCode ? 'xl:w-[73.15vw]' : ''} lg:hover:shadow lg:border rounded-2xl lg:px-2 lg:py-4 bg-white dark:bg-[#18171d] dark:border-gray-600 article`}>
         {lock && <ArticleLock validPassword={validPassword} />}
 
         {!lock && (

diff --git a/themes/plog/components/BlogPost.js b/themes/plog/components/BlogPost.js
@@ -36,10 +36,10 @@ const BlogPost = (props) => {
 
             <LazyImage src={pageThumbnail} className='aspect-[16/9] w-full h-full object-cover filter contrast-120' />
 
-            <h2 className="text-md absolute left-0 bottom-0 m-4 text-black dark:text-gray-100 text-shadow">
+            <h2 className="text-md absolute left-0 bottom-0 m-4 text-gray-100 shadow-text">
                 {post?.title}
             </h2>
-            {post?.category && <div className='text-xs rounded-lg absolute left-0 top-0 m-4 px-2 py-1 bg-black bg-opacity-25 hover:bg-blue-700 hover:text-white duration-200'>
+            {post?.category && <div className='text-xs rounded-lg absolute left-0 top-0 m-4 px-2 py-1 bg-gray-200 dark:bg-black dark:bg-opacity-25 hover:bg-blue-700 hover:text-white duration-200'>
                 <Link href={`/category/${post?.category}`}>
                 {post?.category}
                 </Link>

diff --git a/themes/plog/components/BottomNav.js b/themes/plog/components/BottomNav.js
@@ -13,7 +13,7 @@ import LogoBar from './LogoBar'
  */
 const BottomNav = props => {
   return <>
-        <div id="bottom-nav" style={{ backgroundColor: 'rgba(0, 0, 0, 0.5)' }} className={'z-20 px-4 hidden glassmorphism md:fixed bottom-0 w-screen py-4 md:flex flex-row justify-between items-center'}>
+        <div id="bottom-nav" className={'dark:bg-black dark:bg-opacity-50z-20 px-4 hidden glassmorphism md:fixed bottom-0 w-screen py-4 md:flex flex-row justify-between items-center'}>
             {/* 左侧logo文字栏 */}
             <LogoBar {...props}/>
             {/* 右下角菜单栏 */}

diff --git a/themes/plog/index.js b/themes/plog/index.js
@@ -18,7 +18,6 @@ import ShareBar from '@/components/ShareBar'
 import Link from 'next/link'
 import { Transition } from '@headlessui/react'
 import BottomNav from './components/BottomNav'
-import { saveDarkModeToCookies } from '@/themes/theme'
 import Modal from './components/Modal'
 import { Style } from './style'
 import replaceSearchResult from '@/components/Mark'
@@ -36,29 +35,13 @@ export const usePlogGlobal = () => useContext(ThemeGlobalPlog)
  */
 const LayoutBase = props => {
   const { children, topSlot, meta } = props
-  const { onLoading, updateDarkMode } = useGlobal()
+  const { onLoading } = useGlobal()
   const [showModal, setShowModal] = useState(false)
   const [modalContent, setModalContent] = useState(null)
 
-  // 用户手动设置主题
-  const setDarkMode = () => {
-    saveDarkModeToCookies(true)
-    updateDarkMode(true)
-    const htmlElement = document.getElementsByTagName('html')[0]
-    htmlElement.classList?.remove('light')
-    htmlElement.classList?.add('dark')
-  }
-
-  // plog主题默认 深色模式
-  useEffect(() => {
-    setTimeout(() => {
-      setDarkMode()
-    }, 100)
-  }, [])
-
   return (
     <ThemeGlobalPlog.Provider value={{ showModal, setShowModal, modalContent, setModalContent }}>
-        <div id='theme-plog' className='plog relative dark:text-gray-300 w-full bg-black min-h-screen'>
+        <div id='theme-plog' className='plog relative dark:text-gray-300 w-full dark:bg-black min-h-screen'>
             {/* SEO相关 */}
             <CommonHead meta={meta}/>
             <Style/>