+ >
+ )
}
/**
@@ -127,21 +148,23 @@ const PaginationNumber = ({ page, totalPage }) => {
*/
function getPageElement(page, currentPage, pagePrefix) {
const selected = page + '' === currentPage + ''
+ if (!page) {
+ return <>>
+ }
return (
- (
+ {page}
+
)
}
@@ -171,7 +194,11 @@ function generatePages(pagePrefix, page, currentPage, totalPage) {
startPage = totalPage - dynamicGroupCount
}
if (startPage > 2) {
- pages.push(
...
+ )
}
for (let i = 0; i < dynamicGroupCount; i++) {
diff --git a/themes/hexo/components/ArticleRecommend.js b/themes/hexo/components/ArticleRecommend.js
index a3a40b7d..0bbcd937 100644
--- a/themes/hexo/components/ArticleRecommend.js
+++ b/themes/hexo/components/ArticleRecommend.js
@@ -1,9 +1,9 @@
-import Link from 'next/link'
-import CONFIG from '../config'
+import LazyImage from '@/components/LazyImage'
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
-import LazyImage from '@/components/LazyImage'
import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
+import Link from 'next/link'
+import CONFIG from '../config'
/**
* 关联推荐文章
@@ -13,50 +13,52 @@ import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
export default function ArticleRecommend({ recommendPosts, siteInfo }) {
const { locale } = useGlobal()
- if (
- !siteConfig('HEXO_ARTICLE_RECOMMEND', null, CONFIG) ||
- !recommendPosts ||
- recommendPosts.length === 0
- ) {
+ if (!siteConfig('HEXO_ARTICLE_RECOMMEND', null, CONFIG) || !recommendPosts || recommendPosts.length === 0) {
return <>>
}
return (
-
-
-
-
- {locale.COMMON.RELATE_POSTS}
-
-
-
- {recommendPosts.map(post => {
- const headerImage = post?.pageCoverThumbnail
- ? post.pageCoverThumbnail
- : siteInfo?.pageCover
- const url = checkContainHttp(post.slug) ? sliceUrlFromHttp(post.slug) : `${siteConfig('SUB_PATH', '')}/${post.slug}`
-
- return (
- (
-
-
-
- )
- )
- })}
-
+
+
+
+
+ {locale.COMMON.RELATE_POSTS}
+
+
+ {recommendPosts.map(post => {
+ const headerImage = post?.pageCoverThumbnail ? post.pageCoverThumbnail : siteInfo?.pageCover
+ const url = checkContainHttp(post.slug)
+ ? sliceUrlFromHttp(post.slug)
+ : `${siteConfig('SUB_PATH', '')}/${post.slug}`
+
+ return (
+
+
+
+
+
+ {/* 卡片的阴影遮罩,为了凸显图片上的文字 */}
+
+
+
+ )
+ })}
+
+
)
}
diff --git a/themes/movie/components/Announcement.js b/themes/movie/components/Announcement.js
new file mode 100644
index 00000000..1f265417
--- /dev/null
+++ b/themes/movie/components/Announcement.js
@@ -0,0 +1,22 @@
+import { useGlobal } from '@/lib/global'
+import dynamic from 'next/dynamic'
+
+const NotionPage = dynamic(() => import('@/components/NotionPage'))
+
+const Announcement = ({ post, className }) => {
+ const { locale } = useGlobal()
+ if (!post || Object.keys(post).length === 0) {
+ return <>>
+ }
+ return
+}
+export default Announcement
diff --git a/themes/movie/components/ArchiveDateList.js b/themes/movie/components/ArchiveDateList.js
new file mode 100644
index 00000000..cd389028
--- /dev/null
+++ b/themes/movie/components/ArchiveDateList.js
@@ -0,0 +1,38 @@
+import { useGlobal } from '@/lib/global'
+import { formatDateFmt } from '@/lib/utils/formatDate'
+import Link from 'next/link'
+
+export default function ArchiveDateList(props) {
+ const postsSortByDate = Object.create(props.allNavPages)
+ const { locale } = useGlobal()
+
+ postsSortByDate.sort((a, b) => {
+ return b?.publishDate - a?.publishDate
+ })
+
+ let dates = []
+ postsSortByDate.forEach(post => {
+ const date = formatDateFmt(post.publishDate, 'yyyy-MM')
+ if (!dates[date]) {
+ dates.push(date)
+ }
+ })
+ dates = dates.slice(0, 5)
+ return (
+
+
{locale.NAV.ARCHIVE}
+ {dates?.map((date, index) => {
+ return (
+
+
+ {date}
+
+
+ )
+ })}
+
+ )
+}
diff --git a/themes/movie/components/ArticleInfo.js b/themes/movie/components/ArticleInfo.js
new file mode 100644
index 00000000..9997579a
--- /dev/null
+++ b/themes/movie/components/ArticleInfo.js
@@ -0,0 +1,46 @@
+import { useGlobal } from '@/lib/global'
+import { formatDateFmt } from '@/lib/utils/formatDate'
+import Link from 'next/link'
+
+export const ArticleInfo = props => {
+ const { post } = props
+ const { locale } = useGlobal()
+
+ return (
+
+ {post?.title}
+
+
+
+ {post?.publishDay}
+
+
+ {post?.type !== 'Page' && (
+ <>
+
+ {post?.category}
+
+ >
+ )}
+
+
+ {post?.tags?.length > 0 && (
+ <>
+ {locale.COMMON.TAGS} :
+ >
+ )}
+ {post?.tags?.map(tag => {
+ return (
+
+ {tag}
+
+ )
+ })}
+
+
+
+ )
+}
diff --git a/themes/movie/components/ArticleLock.js b/themes/movie/components/ArticleLock.js
new file mode 100644
index 00000000..3744c183
--- /dev/null
+++ b/themes/movie/components/ArticleLock.js
@@ -0,0 +1,52 @@
+import { useGlobal } from '@/lib/global'
+import { useEffect, useRef } from 'react'
+
+/**
+ * 加密文章校验组件
+ * @param {password, validPassword} props
+ * @param password 正确的密码
+ * @param validPassword(bool) 回调函数,校验正确回调入参为true
+ * @returns
+ */
+export const ArticleLock = props => {
+ const { validPassword } = props
+ const { locale } = useGlobal()
+
+ const submitPassword = () => {
+ const p = document.getElementById('password')
+ if (!validPassword(p?.value)) {
+ const tips = document.getElementById('tips')
+ if (tips) {
+ tips.innerHTML = ''
+ tips.innerHTML = `
${locale.COMMON.PASSWORD_ERROR}
`
+ }
+ }
+ }
+ const passwordInputRef = useRef(null)
+ useEffect(() => {
+ // 选中密码输入框并将其聚焦
+ passwordInputRef.current.focus()
+ }, [])
+
+ return
+
+
{locale.COMMON.ARTICLE_LOCK_TIPS}
+
+
{
+ if (e.key === 'Enter') {
+ submitPassword()
+ }
+ }}
+ ref={passwordInputRef} // 绑定ref到passwordInputRef变量
+ className='outline-none w-full text-sm pl-5 rounded-l transition focus:shadow-lg font-light leading-10 text-black dark:bg-gray-500 bg-gray-50'
+ >
+
+ {locale.COMMON.SUBMIT}
+
+
+
+
+
+
+}
diff --git a/themes/movie/components/BlogListGroupByDate.js b/themes/movie/components/BlogListGroupByDate.js
new file mode 100644
index 00000000..7a8fe083
--- /dev/null
+++ b/themes/movie/components/BlogListGroupByDate.js
@@ -0,0 +1,38 @@
+import { siteConfig } from '@/lib/config'
+import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
+import Link from 'next/link'
+
+/**
+ * 按照日期将文章分组
+ * 归档页面用到
+ * @param {*} param0
+ * @returns
+ */
+export default function BlogListGroupByDate({ archiveTitle, archivePosts }) {
+ return
+
+ {archiveTitle}
+
+
+
+
+}
diff --git a/themes/movie/components/BlogListPage.js b/themes/movie/components/BlogListPage.js
new file mode 100644
index 00000000..648f2ee2
--- /dev/null
+++ b/themes/movie/components/BlogListPage.js
@@ -0,0 +1,25 @@
+import { siteConfig } from '@/lib/config'
+import CONFIG from '../config'
+import BlogPostCard from './BlogPostCard'
+import PaginationNumber from './PaginationNumber'
+
+export const BlogListPage = props => {
+ const { page = 1, posts, postCount } = props
+ const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+
+ const showPageCover = siteConfig('MOVIE_POST_LIST_COVER', null, CONFIG)
+
+ return (
+
+
+ {posts?.map(post => (
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/themes/movie/components/BlogListScroll.js b/themes/movie/components/BlogListScroll.js
new file mode 100644
index 00000000..597ba7dc
--- /dev/null
+++ b/themes/movie/components/BlogListScroll.js
@@ -0,0 +1,60 @@
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import throttle from 'lodash.throttle'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import CONFIG from '../config'
+import BlogPostCard from './BlogPostCard'
+
+export const BlogListScroll = props => {
+ const { posts } = props
+ const { locale } = useGlobal()
+
+ const [page, updatePage] = useState(1)
+
+ let hasMore = false
+ const postsToShow = posts ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page) : []
+
+ if (posts) {
+ const totalCount = posts.length
+ hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ }
+ const handleGetMore = () => {
+ if (!hasMore) return
+ updatePage(page + 1)
+ }
+
+ const targetRef = useRef(null)
+
+ // 监听滚动自动分页加载
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef ? (targetRef.current ? targetRef.current.clientHeight : 0) : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
+ const showPageCover = siteConfig('MOVIE_POST_LIST_COVER', null, CONFIG)
+
+ useEffect(() => {
+ window.addEventListener('scroll', scrollTrigger)
+
+ return () => {
+ window.removeEventListener('scroll', scrollTrigger)
+ }
+ })
+
+ return (
+
+ {postsToShow?.map(post => (
+
+ ))}
+
+
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
+ )
+}
diff --git a/themes/movie/components/BlogPostCard.js b/themes/movie/components/BlogPostCard.js
new file mode 100644
index 00000000..61954610
--- /dev/null
+++ b/themes/movie/components/BlogPostCard.js
@@ -0,0 +1,60 @@
+import LazyImage from '@/components/LazyImage'
+import NotionIcon from '@/components/NotionIcon'
+import { siteConfig } from '@/lib/config'
+import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
+import Link from 'next/link'
+import TagItemMini from './TagItemMini'
+
+const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
+ // 主题默认强制显示图片
+ if (post && !post.pageCoverThumbnail) {
+ post.pageCoverThumbnail = siteInfo?.pageCover || siteConfig('RANDOM_IMAGE_URL')
+ }
+
+ const url = checkContainHttp(post.slug) ? sliceUrlFromHttp(post.slug) : `${siteConfig('SUB_PATH', '')}/${post.slug}`
+
+ return (
+
+
+ {/* 固定高度 ,空白用图片拉升填充 */}
+
+ {/* 图片 填充卡片 */}
+
+
+
+
+
+ {post?.tagItems && post?.tagItems.length > 0 && (
+ <>
+
+ {post.tagItems.map(tag => (
+
+ ))}
+
+ >
+ )}
+
+ {/* 阴影遮罩 */}
+
+
+ {post.title}
+
+
+
+ {post?.summary}
+
+
+
+
+
+
+ )
+}
+
+export default BlogPostCard
diff --git a/themes/movie/components/BlogRecommend.js b/themes/movie/components/BlogRecommend.js
new file mode 100644
index 00000000..9e434558
--- /dev/null
+++ b/themes/movie/components/BlogRecommend.js
@@ -0,0 +1,62 @@
+import LazyImage from '@/components/LazyImage'
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
+import Link from 'next/link'
+import CONFIG from '../config'
+
+/**
+ * 关联推荐文章
+ * @param {prev,next} param0
+ * @returns
+ */
+export default function BlogRecommend(props) {
+ const { recommendPosts, siteInfo } = props
+ const { locale } = useGlobal()
+ if (!siteConfig('MOVIE_ARTICLE_RECOMMEND', null, CONFIG) || !recommendPosts || recommendPosts.length === 0) {
+ return <>>
+ }
+
+ return (
+
+
+
+
+ {locale.COMMON.RELATE_POSTS}
+
+
+
+ {recommendPosts.map(post => {
+ const headerImage = post?.pageCoverThumbnail ? post.pageCoverThumbnail : siteInfo?.pageCover
+ const url = checkContainHttp(post.slug)
+ ? sliceUrlFromHttp(post.slug)
+ : `${siteConfig('SUB_PATH', '')}/${post.slug}`
+
+ return (
+
+
+
+ {/* 卡片的阴影遮罩,为了凸显图片上的文字 */}
+
+
+
+
+
+ )
+ })}
+
+
+ )
+}
diff --git a/themes/movie/components/CategoryGroup.js b/themes/movie/components/CategoryGroup.js
new file mode 100644
index 00000000..63c3917c
--- /dev/null
+++ b/themes/movie/components/CategoryGroup.js
@@ -0,0 +1,43 @@
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+
+const CategoryGroup = props => {
+ const { currentCategory, categoryOptions } = props
+ const { locale } = useGlobal()
+ if (!categoryOptions || categoryOptions.length === 0) return <>>
+ const categoryCount = siteConfig('PREVIEW_CATEGORY_COUNT')
+ const categories = categoryOptions.slice(0, categoryCount)
+ return (
+ <>
+
+
{locale.COMMON.CATEGORY}
+
+ {categories.map(category => {
+ const selected = currentCategory === category.name
+ return (
+
+
+ {category.name}({category.count})
+
+ )
+ })}
+
+
+ >
+ )
+}
+
+export default CategoryGroup
diff --git a/themes/movie/components/CategoryItem.js b/themes/movie/components/CategoryItem.js
new file mode 100644
index 00000000..1190965b
--- /dev/null
+++ b/themes/movie/components/CategoryItem.js
@@ -0,0 +1,20 @@
+import Link from 'next/link'
+
+/**
+ * 文章分类
+ * @param {*} param0
+ * @returns
+ */
+export default function CategoryItem({ category }) {
+ return (
+
+
+ {category.name}({category.count})
+
+
+ )
+}
diff --git a/themes/movie/components/ExampleRecentComments.js b/themes/movie/components/ExampleRecentComments.js
new file mode 100644
index 00000000..9dbdfa7f
--- /dev/null
+++ b/themes/movie/components/ExampleRecentComments.js
@@ -0,0 +1,35 @@
+import { useEffect, useState } from 'react'
+import { siteConfig } from '@/lib/config'
+import Link from 'next/link'
+import { RecentComments } from '@waline/client'
+
+/**
+ * @see https://waline.js.org/guide/get-started.html
+ * @param {*} props
+ * @returns
+ */
+const ExampleRecentComments = (props) => {
+ const [comments, updateComments] = useState([])
+ const [onLoading, changeLoading] = useState(true)
+ useEffect(() => {
+ RecentComments({
+ serverURL: siteConfig('COMMENT_WALINE_SERVER_URL'),
+ count: 5
+ }).then(({ comments }) => {
+ changeLoading(false)
+ updateComments(comments)
+ })
+ }, [])
+
+ return <>
+ {onLoading &&
Loading...
}
+ {!onLoading && comments && comments.length === 0 &&
No Comments
}
+ {!onLoading && comments && comments.length > 0 && comments.map((comment) =>
)}
+
+ >
+}
+
+export default ExampleRecentComments
diff --git a/themes/movie/components/Footer.js b/themes/movie/components/Footer.js
new file mode 100644
index 00000000..77c8bad6
--- /dev/null
+++ b/themes/movie/components/Footer.js
@@ -0,0 +1,26 @@
+import DarkModeButton from '@/components/DarkModeButton'
+import { siteConfig } from '@/lib/config'
+
+export const Footer = (props) => {
+ const d = new Date()
+ const currentYear = d.getFullYear()
+ const since = siteConfig('SINCE')
+ const copyrightDate = parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
+
+ return
+}
diff --git a/themes/movie/components/Header.js b/themes/movie/components/Header.js
new file mode 100644
index 00000000..a0f2d78c
--- /dev/null
+++ b/themes/movie/components/Header.js
@@ -0,0 +1,166 @@
+import Collapse from '@/components/Collapse'
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { useEffect, useState } from 'react'
+import { useMovieGlobal } from '..'
+import CONFIG from '../config'
+import { MenuItemCollapse } from './MenuItemCollapse'
+import { MenuItemDrop } from './MenuItemDrop'
+
+/**
+ * 网站顶部
+ * @returns
+ */
+export const Header = props => {
+ const { collapseRef, searchModal } = useMovieGlobal()
+ const router = useRouter()
+ const { customNav, customMenu } = props
+ const { locale } = useGlobal()
+ const [isOpen, setIsOpen] = useState(false)
+ const [showSearch, setShowSearch] = useState(false)
+ const toggleMenuOpen = () => {
+ setIsOpen(!isOpen)
+ }
+ let links = [
+ {
+ id: 1,
+ icon: 'fa-solid fa-house',
+ name: locale.NAV.INDEX,
+ to: '/',
+ show: siteConfig('MOVIE_MENU_INDEX', null, CONFIG)
+ },
+ {
+ id: 2,
+ icon: 'fas fa-search',
+ name: locale.NAV.SEARCH,
+ to: '/search',
+ show: siteConfig('MOVIE_MENU_SEARCH', null, CONFIG)
+ },
+ {
+ id: 3,
+ icon: 'fas fa-archive',
+ name: locale.NAV.ARCHIVE,
+ to: '/archive',
+ show: siteConfig('MOVIE_MENU_ARCHIVE', null, CONFIG)
+ }
+ // { icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MENU_CATEGORY', null, CONFIG) },
+ // { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MENU_TAG', null, CONFIG) }
+ ]
+
+ if (customNav) {
+ links = links.concat(customNav)
+ }
+
+ for (let i = 0; i < links.length; i++) {
+ if (links[i].id !== i) {
+ links[i].id = i
+ }
+ }
+
+ // 如果 开启自定义菜单,则覆盖Page生成的菜单
+ if (siteConfig('CUSTOM_MENU')) {
+ links = customMenu
+ }
+
+ // 展示搜索框
+ const toggleShowSearchInput = () => {
+ if (siteConfig('ALGOLIA_APP_ID')) {
+ searchModal.current.openSearch()
+ } else {
+ setShowSearch(!showSearch)
+ }
+ }
+
+ useEffect(() => {
+ if (showSearch) {
+ setTimeout(() => {
+ document.getElementById('search').focus()
+ }, 100)
+ }
+ }, [showSearch])
+
+ const onKeyUp = e => {
+ if (e.keyCode === 13) {
+ const search = document.getElementById('search').value
+ if (search) {
+ router.push({ pathname: '/search/' + search })
+ }
+ }
+ }
+
+ const handleSearch = () => {
+ const search = document.getElementById('search').value
+ if (search) {
+ router.push({ pathname: '/search/' + search })
+ }
+ }
+
+ return (
+ <>
+
+
+
+ {/* 移动端菜单 */}
+
+
+ >
+ )
+}
diff --git a/themes/movie/components/JumpToTopButton.js b/themes/movie/components/JumpToTopButton.js
new file mode 100644
index 00000000..f5e22b61
--- /dev/null
+++ b/themes/movie/components/JumpToTopButton.js
@@ -0,0 +1,18 @@
+import { useGlobal } from '@/lib/global'
+
+/**
+ * 跳转到网页顶部
+ * 当屏幕下滑500像素后会出现该控件
+ * @param targetRef 关联高度的目标html标签
+ * @param showPercent 是否显示百分比
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const JumpToTopButton = () => {
+ const { locale } = useGlobal()
+ return
window.scrollTo({ top: 0, behavior: 'smooth' })}
+ >
+
+}
+
+export default JumpToTopButton
diff --git a/themes/movie/components/LatestPostsGroup.js b/themes/movie/components/LatestPostsGroup.js
new file mode 100644
index 00000000..b7ada599
--- /dev/null
+++ b/themes/movie/components/LatestPostsGroup.js
@@ -0,0 +1,62 @@
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { checkContainHttp, sliceUrlFromHttp } from '@/lib/utils'
+
+/**
+ * 最新文章列表
+ * @param posts 所有文章数据
+ * @param sliceCount 截取展示的数量 默认6
+ * @constructor
+ */
+const LatestPostsGroup = ({ latestPosts }) => {
+ // 获取当前路径
+ const currentPath = useRouter().asPath
+ const { locale } = useGlobal()
+
+ if (!latestPosts) {
+ return <>>
+ }
+
+ return (
+
+
+
+
+ {locale.COMMON.LATEST_POSTS}
+
+
+
+ {latestPosts.map(post => {
+ const selected =
+ currentPath === `${siteConfig('SUB_PATH', '')}/${post.slug}`
+ const url = checkContainHttp(post.slug)
+ ? sliceUrlFromHttp(post.slug)
+ : `${siteConfig('SUB_PATH', '')}/${post.slug}`
+ return (
+
+
+
{post.title}
+
+
+ )
+ })}
+
+ )
+}
+export default LatestPostsGroup
diff --git a/themes/movie/components/LoadingCover.js b/themes/movie/components/LoadingCover.js
new file mode 100644
index 00000000..75976180
--- /dev/null
+++ b/themes/movie/components/LoadingCover.js
@@ -0,0 +1,8 @@
+
+export default function LoadingCover() {
+ return
+}
diff --git a/themes/movie/components/MenuItemCollapse.js b/themes/movie/components/MenuItemCollapse.js
new file mode 100644
index 00000000..0f91f1d4
--- /dev/null
+++ b/themes/movie/components/MenuItemCollapse.js
@@ -0,0 +1,77 @@
+import Collapse from '@/components/Collapse'
+import Link from 'next/link'
+import { useState } from 'react'
+
+/**
+ * 折叠菜单
+ * @param {*} param0
+ * @returns
+ */
+export const MenuItemCollapse = props => {
+ const { link } = props
+ const [show, changeShow] = useState(false)
+ const hasSubMenu = link?.subMenus?.length > 0
+
+ const [isOpen, changeIsOpen] = useState(false)
+
+ const toggleShow = () => {
+ changeShow(!show)
+ }
+
+ const toggleOpenSubMenu = () => {
+ changeIsOpen(!isOpen)
+ }
+
+ if (!link || !link.show) {
+ return null
+ }
+
+ return (
+ <>
+
+ {!hasSubMenu && (
+
+
+ {link?.icon && }
+ {link?.name}
+
+
+ )}
+ {hasSubMenu && (
+
+
+ {link?.icon && }
+ {link?.name}
+
+
+
+ )}
+
+
+ {/* 折叠子菜单 */}
+ {hasSubMenu && (
+
+ {link.subMenus.map((sLink, index) => {
+ return (
+
+
+
+ {link?.icon && } {sLink.title}
+
+
+
+ )
+ })}
+
+ )}
+ >
+ )
+}
diff --git a/themes/movie/components/MenuItemDrop.js b/themes/movie/components/MenuItemDrop.js
new file mode 100644
index 00000000..93f27f44
--- /dev/null
+++ b/themes/movie/components/MenuItemDrop.js
@@ -0,0 +1,67 @@
+import Link from 'next/link'
+import { useState } from 'react'
+
+export const MenuItemDrop = ({ link }) => {
+ const [show, changeShow] = useState(false)
+ const hasSubMenu = link?.subMenus?.length > 0
+
+ if (!link || !link.show) {
+ return null
+ }
+
+ return (
+
changeShow(true)}
+ onMouseOut={() => changeShow(false)}
+ >
+ {!hasSubMenu && (
+
+ {link?.icon &&
} {link?.name}
+ {hasSubMenu &&
}
+
+ )}
+
+ {hasSubMenu && (
+ <>
+
+ {link?.icon && } {link?.name}
+
+
+ >
+ )}
+
+ {/* 子菜单 */}
+ {hasSubMenu && (
+
+ {link.subMenus.map((sLink, index) => {
+ return (
+ -
+
+
+ {link?.icon && }
+ {sLink.title}
+
+
+
+ )
+ })}
+
+ )}
+
+ )
+}
diff --git a/themes/movie/components/NormalMenuItem.js b/themes/movie/components/NormalMenuItem.js
new file mode 100644
index 00000000..aec74837
--- /dev/null
+++ b/themes/movie/components/NormalMenuItem.js
@@ -0,0 +1,14 @@
+import Link from 'next/link'
+
+/**
+ * 旧的普通菜单
+ * @param {*} props
+ * @returns
+ */
+export const NormalMenuItem = (props) => {
+ const { link } = props
+ return link?.show &&
+ {link.name}
+
+}
diff --git a/themes/movie/components/PaginationNumber.js b/themes/movie/components/PaginationNumber.js
new file mode 100644
index 00000000..effc1835
--- /dev/null
+++ b/themes/movie/components/PaginationNumber.js
@@ -0,0 +1,220 @@
+import { ChevronDoubleRight } from '@/components/HeroIcons'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { useState } from 'react'
+
+/**
+ * 数字翻页插件
+ * @param page 当前页码
+ * @param showNext 是否有下一页
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const PaginationNumber = ({ page, totalPage }) => {
+ const router = useRouter()
+ const [value, setValue] = useState('')
+ const { locale } = useGlobal()
+ const currentPage = +page
+ const showNext = page < totalPage
+ const showPrev = currentPage !== 1
+ const pagePrefix = router.asPath
+ .split('?')[0]
+ .replace(/\/page\/[1-9]\d*/, '')
+ .replace(/\/$/, '')
+ const pages = generatePages(pagePrefix, page, currentPage, totalPage)
+ if (pages?.length <= 1) {
+ return <>>
+ }
+
+ const handleInputChange = event => {
+ const newValue = event.target.value.replace(/[^0-9]/g, '')
+ setValue(newValue)
+ }
+
+ /**
+ * 调到指定页
+ */
+ const jumpToPage = () => {
+ if (value) {
+ router.push(
+ value === 1 ? `${pagePrefix}/` : `${pagePrefix}/page/${value}`
+ )
+ }
+ }
+
+ return (
+ <>
+ {/* pc端分页按钮 */}
+
+ {/* 上一页 */}
+
+
+
+
+ {locale.PAGINATION.PREV}
+
+
+
+
+ {/* 分页 */}
+
+ {pages}
+
+ {/* 跳转页码 */}
+
+
+
+ {/* 下一页 */}
+
+
+
+
+ {locale.PAGINATION.NEXT}
+
+
+
+
+
+ {/* 移动端分页 */}
+
+
+ {/* 上一页 */}
+
+ {locale.PAGINATION.PREV}
+
+
+ {showPrev && showNext &&
}
+
+ {/* 下一页 */}
+
+ {locale.PAGINATION.NEXT}
+
+
+ >
+ )
+}
+
+/**
+ * 页码按钮
+ * @param {*} page
+ * @param {*} currentPage
+ * @param {*} pagePrefix
+ * @returns
+ */
+function getPageElement(page, currentPage, pagePrefix) {
+ const selected = page + '' === currentPage + ''
+ if (!page) {
+ return <>>
+ }
+ return (
+
+ {page}
+
+ )
+}
+
+/**
+ * 获取所有页码
+ * @param {*} pagePrefix
+ * @param {*} page
+ * @param {*} currentPage
+ * @param {*} totalPage
+ * @returns
+ */
+function generatePages(pagePrefix, page, currentPage, totalPage) {
+ const pages = []
+ const groupCount = 7 // 最多显示页签数
+ if (totalPage <= groupCount) {
+ for (let i = 1; i <= totalPage; i++) {
+ pages.push(getPageElement(i, page, pagePrefix))
+ }
+ } else {
+ pages.push(getPageElement(1, page, pagePrefix))
+ const dynamicGroupCount = groupCount - 2
+ let startPage = currentPage - 2
+ if (startPage <= 1) {
+ startPage = 2
+ }
+ if (startPage + dynamicGroupCount > totalPage) {
+ startPage = totalPage - dynamicGroupCount
+ }
+ if (startPage > 2) {
+ pages.push(
+
+ ...{' '}
+
+ )
+ }
+
+ for (let i = 0; i < dynamicGroupCount; i++) {
+ if (startPage + i < totalPage) {
+ pages.push(getPageElement(startPage + i, page, pagePrefix))
+ }
+ }
+
+ if (startPage + dynamicGroupCount < totalPage) {
+ pages.push(
...
)
+ }
+
+ pages.push(getPageElement(totalPage, page, pagePrefix))
+ }
+ return pages
+}
+export default PaginationNumber
diff --git a/themes/movie/components/SearchInput.js b/themes/movie/components/SearchInput.js
new file mode 100644
index 00000000..4f375d4e
--- /dev/null
+++ b/themes/movie/components/SearchInput.js
@@ -0,0 +1,87 @@
+import { useRouter } from 'next/router'
+import { useGlobal } from '@/lib/global'
+import { useImperativeHandle, useRef, useState } from 'react'
+
+let lock = false
+
+const SearchInput = ({ currentTag, keyword, cRef }) => {
+ const { locale } = useGlobal()
+ const router = useRouter()
+ const searchInputRef = useRef(null)
+ useImperativeHandle(cRef, () => {
+ return {
+ focus: () => {
+ searchInputRef?.current?.focus()
+ }
+ }
+ })
+ const handleSearch = () => {
+ const key = searchInputRef.current.value
+ if (key && key !== '') {
+ router.push({ pathname: '/search/' + key }).then(r => {
+ console.log('搜索', key)
+ })
+ } else {
+ router.push({ pathname: '/' }).then(r => {
+ })
+ }
+ }
+ const handleKeyUp = (e) => {
+ if (e.keyCode === 13) { // 回车
+ handleSearch(searchInputRef.current.value)
+ } else if (e.keyCode === 27) { // ESC
+ cleanSearch()
+ }
+ }
+ const cleanSearch = () => {
+ searchInputRef.current.value = ''
+ setShowClean(false)
+ }
+ function lockSearchInput () {
+ lock = true
+ }
+
+ function unLockSearchInput () {
+ lock = false
+ }
+ const [showClean, setShowClean] = useState(false)
+ const updateSearchKey = (val) => {
+ if (lock) {
+ return
+ }
+ searchInputRef.current.value = val
+ if (val) {
+ setShowClean(true)
+ } else {
+ setShowClean(false)
+ }
+ }
+
+ return
+}
+
+export default SearchInput
diff --git a/themes/movie/components/SideBar.js b/themes/movie/components/SideBar.js
new file mode 100644
index 00000000..ea0531b7
--- /dev/null
+++ b/themes/movie/components/SideBar.js
@@ -0,0 +1,68 @@
+import { siteConfig } from '@/lib/config'
+import Live2D from '@/components/Live2D'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import dynamic from 'next/dynamic'
+import Announcement from './Announcement'
+const ExampleRecentComments = dynamic(() => import('./ExampleRecentComments'))
+
+export const SideBar = (props) => {
+ const { locale } = useGlobal()
+ const { latestPosts, categoryOptions, notice } = props
+ return (
+
+
+
+
+
+
+
+
+ {siteConfig('COMMENT_WALINE_SERVER_URL') && siteConfig('COMMENT_WALINE_RECENT') && }
+
+
+
+
+ )
+}
diff --git a/themes/movie/components/SlotBar.js b/themes/movie/components/SlotBar.js
new file mode 100644
index 00000000..e3bed727
--- /dev/null
+++ b/themes/movie/components/SlotBar.js
@@ -0,0 +1,34 @@
+import { useGlobal } from '@/lib/global'
+
+/**
+ * 博客列表上方嵌入条
+ * @param {*} props
+ * @returns
+ */
+export default function SlotBar(props) {
+ const { tag, category } = props
+ const { locale } = useGlobal()
+
+ if (tag) {
+ return (
+
+
+
+ {locale.COMMON.TAGS} : {tag}{' '}
+
+
+
+
+ )
+ } else if (category) {
+ return (
+
+
+ {locale.COMMON.CATEGORY} : {category}
+
+
+
+ )
+ }
+ return <>>
+}
diff --git a/themes/movie/components/TagGroups.js b/themes/movie/components/TagGroups.js
new file mode 100644
index 00000000..597cddc1
--- /dev/null
+++ b/themes/movie/components/TagGroups.js
@@ -0,0 +1,51 @@
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+
+/**
+ * 标签组
+ * @param tags
+ * @param currentTag
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const TagGroups = ({ tagOptions, className }) => {
+ const router = useRouter()
+ const { locale } = useGlobal()
+ const { tag: currentTag } = router.query
+ if (!tagOptions) return <>>
+
+ return (
+
+
{locale.COMMON.TAGS}
+
+
+ )
+}
+
+export default TagGroups
diff --git a/themes/movie/components/TagItem.js b/themes/movie/components/TagItem.js
new file mode 100644
index 00000000..c608c8cb
--- /dev/null
+++ b/themes/movie/components/TagItem.js
@@ -0,0 +1,23 @@
+import Link from 'next/link'
+
+/**
+ * 标签
+ * @param {*} param0
+ * @returns
+ */
+export default function TagItem({ tag }) {
+ return (
+
+
+
+ {tag.name + (tag.count ? `(${tag.count})` : '')}{' '}
+
+
+
+ )
+}
diff --git a/themes/movie/components/TagItemMini.js b/themes/movie/components/TagItemMini.js
new file mode 100644
index 00000000..a4b7da1c
--- /dev/null
+++ b/themes/movie/components/TagItemMini.js
@@ -0,0 +1,19 @@
+import Link from 'next/link'
+
+const TagItemMini = ({ tag, selected = false }) => {
+ return (
+
+
+ {selected && }{' '}
+ {tag.name + (tag.count ? `(${tag.count})` : '')}{' '}
+
+
+ )
+}
+
+export default TagItemMini
diff --git a/themes/movie/components/Title.js b/themes/movie/components/Title.js
new file mode 100644
index 00000000..73ca9d7f
--- /dev/null
+++ b/themes/movie/components/Title.js
@@ -0,0 +1,20 @@
+import NotionIcon from '@/components/NotionIcon'
+import { siteConfig } from '@/lib/config'
+
+/**
+ * 标题栏
+ * @param {*} props
+ * @returns
+ */
+export const Title = (props) => {
+ const { post } = props
+ const title = post?.title || siteConfig('TITLE')
+ const description = post?.description || siteConfig('AUTHOR')
+
+ return
+
{title}
+
+ {description}
+
+
+}
diff --git a/themes/movie/config.js b/themes/movie/config.js
new file mode 100644
index 00000000..a2c5fd4d
--- /dev/null
+++ b/themes/movie/config.js
@@ -0,0 +1,16 @@
+/**
+ * 主题配置文件
+ */
+const CONFIG = {
+ // 菜单配置
+ MOVIE_MENU_CATEGORY: true, // 显示分类
+ MOVIE_MENU_TAG: true, // 显示标签
+ MOVIE_MENU_ARCHIVE: true, // 显示归档
+ MOVIE_MENU_SEARCH: true, // 显示搜索
+
+ MOVIE_ARTICLE_RECOMMEND: true, // 推荐关联内容在文章底部
+ MOVIE_VIDEO_COMBINE: true, // 聚合视频,开启后一篇文章内的多个含caption的视频会被合并到文章开头,并展示分集按钮
+
+ MOVIE_POST_LIST_COVER: true // 列表显示文章封面
+}
+export default CONFIG
diff --git a/themes/movie/index.js b/themes/movie/index.js
new file mode 100644
index 00000000..5b7f9184
--- /dev/null
+++ b/themes/movie/index.js
@@ -0,0 +1,438 @@
+'use client'
+
+import AlgoliaSearchModal from '@/components/AlgoliaSearchModal'
+import Comment from '@/components/Comment'
+import replaceSearchResult from '@/components/Mark'
+import NotionPage from '@/components/NotionPage'
+import ShareBar from '@/components/ShareBar'
+import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import { loadWowJS } from '@/lib/plugins/wow'
+import { isBrowser } from '@/lib/utils'
+import { Transition } from '@headlessui/react'
+import { useRouter } from 'next/router'
+import { createContext, useContext, useEffect, useRef, useState } from 'react'
+import ArchiveDateList from './components/ArchiveDateList'
+import { ArticleInfo } from './components/ArticleInfo'
+import { ArticleLock } from './components/ArticleLock'
+import BlogListGroupByDate from './components/BlogListGroupByDate'
+import { BlogListPage } from './components/BlogListPage'
+import { BlogListScroll } from './components/BlogListScroll'
+import BlogRecommend from './components/BlogRecommend'
+import CategoryGroup from './components/CategoryGroup'
+import CategoryItem from './components/CategoryItem'
+import { Footer } from './components/Footer'
+import { Header } from './components/Header'
+import JumpToTopButton from './components/JumpToTopButton'
+import LatestPostsGroup from './components/LatestPostsGroup'
+import SlotBar from './components/SlotBar'
+import TagGroups from './components/TagGroups'
+import TagItem from './components/TagItem'
+import CONFIG from './config'
+import { Style } from './style'
+
+// 主题全局状态
+const ThemeGlobalMovie = createContext()
+export const useMovieGlobal = () => useContext(ThemeGlobalMovie)
+
+/**
+ * 基础布局框架
+ * 1.其它页面都嵌入在LayoutBase中
+ * 2.采用左右两侧布局,移动端使用顶部导航栏
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const LayoutBase = props => {
+ const { children, slotTop } = props
+ const { onLoading, fullWidth } = useGlobal()
+ const collapseRef = useRef(null)
+
+ const searchModal = useRef(null)
+ const [expandMenu, updateExpandMenu] = useState(false)
+ useEffect(() => {
+ loadWowJS()
+ }, [])
+
+ return (
+
+
+
+
+ {/* 页头 */}
+
+
+ {/* 主体 */}
+
+ {/* 标题栏 */}
+ {/* {fullWidth ? null :
} */}
+
+
+ {/* 内容 */}
+
+
+ {/* 嵌入模块 */}
+ {slotTop}
+ {children}
+
+
+
+
+
+ {/* 页脚 */}
+
+
+ {/* 搜索框 */}
+
+
+ {/* 回顶按钮 */}
+
+
+
+
+
+ )
+}
+
+/**
+ * 首页
+ * @param {*} props
+ * @returns 此主题首页就是列表
+ */
+const LayoutIndex = props => {
+ return
+}
+
+/**
+ * 文章列表
+ * @param {*} props
+ * @returns
+ */
+const LayoutPostList = props => {
+ return (
+ <>
+
+ {siteConfig('POST_LIST_STYLE') === 'page' ?
:
}
+ >
+ )
+}
+
+/**
+ * 文章详情页
+ * @param {*} props
+ * @returns
+ */
+const LayoutSlug = props => {
+ const { post, lock, validPassword } = props
+ const router = useRouter()
+ useEffect(() => {
+ // 用js 实现将页面中的多个视频聚合为一个分集的视频
+ function combineVideo() {
+ // 找到 id 为 notion-article 的元素
+ const notionArticle = document.getElementById('notion-article')
+ if (!notionArticle) return // 如果找不到对应的元素,则退出函数
+
+ // 找到所有的 .notion-asset-wrapper 元素
+ const assetWrappers = document.querySelectorAll('.notion-asset-wrapper')
+ if (!assetWrappers || assetWrappers.length === 0) return // 如果找不到对应的元素,则退出函数
+
+ // 不要重复创建
+ const exists = document.querySelectorAll('.video-wrapper')
+ if (exists && exists.length > 0) return
+
+ // 创建一个新的容器元素
+ const videoWrapper = document.createElement('div')
+ videoWrapper.className = 'video-wrapper p-2 bg-gray-100 dark:bg-hexo-black-gray max-w-5xl mx-auto'
+
+ // 创建一个新的容器元素
+ const carouselWrapper = document.createElement('div')
+ carouselWrapper.classList.add('notion-carousel-wrapper')
+
+ // 创建一个用于保存 figcaption 文本内容的数组
+ const figCaptionValues = []
+
+ // 遍历所有 .notion-asset-wrapper 元素
+ assetWrappers.forEach((wrapper, index) => {
+ // 检查 .notion-asset-wrapper 元素是否有子元素 figcaption
+ const figCaption = wrapper.querySelector('figcaption')
+ if (!figCaption) return // 如果没有子元素 figcaption,则不处理该元素
+
+ // 检查 .notion-asset-wrapper 元素是否有 notion-asset-wrapper-video 或 notion-asset-wrapper-embed 类
+ if (
+ !wrapper.classList.contains('notion-asset-wrapper-video') &&
+ !wrapper.classList.contains('notion-asset-wrapper-embed')
+ )
+ return
+
+ // 获取 figcaption 的文本内容并添加到数组中
+ const figCaptionValue = figCaption.textContent.trim()
+ figCaptionValues.push(figCaptionValue)
+
+ // 创建一个新的 div 元素用于包裹当前的 .notion-asset-wrapper 元素
+ const carouselItem = document.createElement('div')
+ carouselItem.classList.add('notion-carousel')
+ carouselItem.appendChild(wrapper)
+ // 如果是第一个元素,设置为 active
+ if (index === 0) {
+ carouselItem.classList.add('active')
+ }
+ // 将元素添加到容器中
+ carouselWrapper.appendChild(carouselItem)
+ // 从 DOM 中移除原始的 .notion-asset-wrapper 元素
+ // wrapper.parentNode.removeChild(wrapper)
+ })
+
+ // 创建一个用于保存 figcaption 值的容器元素
+ const figCaptionWrapper = document.createElement('div')
+ figCaptionWrapper.className = 'notion-carousel-route py-2 max-h-36 overflow-y-auto'
+
+ // 遍历 figCaptionValues 数组,并将每个值添加到容器元素中
+ figCaptionValues.forEach(value => {
+ const div = document.createElement('div')
+ div.textContent = value
+ div.addEventListener('click', function () {
+ // 遍历所有的 carouselItem 元素
+ document.querySelectorAll('.notion-carousel').forEach(item => {
+ // 判断当前元素是否包含该 figCaption 的文本内容,如果是则设置为 active,否则取消 active
+ if (item.querySelector('figcaption').textContent.trim() === value) {
+ item.classList.add('active')
+ } else {
+ item.classList.remove('active')
+ // 不活跃窗口暂停播放,仅支持notion上传视频、不支持外链
+ item.querySelectorAll('video')?.forEach(video => {
+ video.pause()
+ })
+ }
+ })
+ })
+ figCaptionWrapper.appendChild(div)
+ })
+
+ // 条件是带有caption的视频数量大于1个,否则不处理
+ if (figCaptionValues.length > 1) {
+ // 将包含 figcaption 值的容器元素添加到 notion-article 的第一个子元素插入
+ videoWrapper.appendChild(carouselWrapper)
+ videoWrapper.appendChild(figCaptionWrapper)
+ notionArticle.insertBefore(videoWrapper, notionArticle.firstChild)
+ }
+ }
+
+ setTimeout(() => {
+ combineVideo()
+ }, 100)
+
+ // 404
+ if (!post) {
+ setTimeout(
+ () => {
+ if (isBrowser) {
+ const article = document.getElementById('notion-article')
+ if (!article) {
+ router.push('/404').then(() => {
+ console.warn('找不到页面', router.asPath)
+ })
+ }
+ }
+ },
+ siteConfig('POST_WAITING_TIME_FOR_404') * 1000
+ )
+ }
+ return () => {
+ // 获取所有 class="video-wrapper" 的元素
+ const videoWrappers = document.querySelectorAll('.video-wrapper')
+
+ // 遍历所有匹配的元素并移除它们
+ videoWrappers.forEach(wrapper => {
+ wrapper.parentNode.removeChild(wrapper) // 从 DOM 中移除元素
+ })
+ }
+ }, [post])
+
+ return (
+ <>
+ {!lock ? (
+
+ {/* 标题 */}
+
+ {/* 页面元素 */}
+
+ {/* 推荐 */}
+
+ {/* 分享栏目 */}
+
+ {/* 评论区 */}
+
+
+ ) : (
+
+ )}
+ >
+ )
+}
+
+/**
+ * 404页
+ * @param {*} props
+ * @returns
+ */
+const Layout404 = props => {
+ const { locale } = useGlobal()
+ const { searchModal } = useMovieGlobal()
+ const router = useRouter()
+ // 展示搜索框
+ const toggleShowSearchInput = () => {
+ if (siteConfig('ALGOLIA_APP_ID')) {
+ searchModal.current.openSearch()
+ }
+ }
+
+ const onKeyUp = e => {
+ if (e.keyCode === 13) {
+ const search = document.getElementById('search').value
+ if (search) {
+ router.push({ pathname: '/search/' + search })
+ }
+ }
+ }
+
+ return (
+ <>
+
+
{locale.COMMON.NO_RESULTS_FOUND}
+
+
+
+
+
+
+ {/* 底部导航 */}
+
+ >
+ )
+}
+
+/**
+ * 搜索页
+ * @param {*} props
+ * @returns
+ */
+const LayoutSearch = props => {
+ const { keyword } = props
+ const router = useRouter()
+ useEffect(() => {
+ if (isBrowser) {
+ // 高亮搜索到的结果
+ const container = document.getElementById('posts-wrapper')
+ if (keyword && container) {
+ replaceSearchResult({
+ doms: container,
+ search: keyword,
+ target: {
+ element: 'span',
+ className: 'text-red-500 border-b border-dashed'
+ }
+ })
+ }
+ }
+ }, [router])
+
+ return
+}
+
+/**
+ * 归档列表
+ * @param {*} props
+ * @returns 按照日期将文章分组排序
+ */
+const LayoutArchive = props => {
+ const { archivePosts } = props
+ return (
+ <>
+
+ {Object.keys(archivePosts).map(archiveTitle => (
+
+ ))}
+
+ >
+ )
+}
+
+/**
+ * 分类列表
+ * @param {*} props
+ * @returns
+ */
+const LayoutCategoryIndex = props => {
+ const { categoryOptions } = props
+ return (
+ <>
+
+ {categoryOptions?.map(category => (
+
+ ))}
+
+ >
+ )
+}
+
+/**
+ * 标签列表
+ * @param {*} props
+ * @returns
+ */
+const LayoutTagIndex = props => {
+ const { tagOptions } = props
+ return (
+ <>
+
+ {tagOptions.map(tag => (
+
+ ))}
+
+ >
+ )
+}
+
+export {
+ Layout404,
+ LayoutArchive,
+ LayoutBase,
+ LayoutCategoryIndex,
+ LayoutIndex,
+ LayoutPostList,
+ LayoutSearch,
+ LayoutSlug,
+ LayoutTagIndex,
+ CONFIG as THEME_CONFIG
+}
diff --git a/themes/movie/style.js b/themes/movie/style.js
new file mode 100644
index 00000000..c619b509
--- /dev/null
+++ b/themes/movie/style.js
@@ -0,0 +1,47 @@
+/* eslint-disable react/no-unknown-property */
+/**
+ * 此处样式只对当前主题生效
+ * 此处不支持tailwindCSS的 @apply 语法
+ * @returns
+ */
+const Style = () => {
+ return (
+
+ )
+}
+
+export { Style }
diff --git a/themes/simple/components/NavBar.js b/themes/simple/components/NavBar.js
index 38df0736..0392c051 100644
--- a/themes/simple/components/NavBar.js
+++ b/themes/simple/components/NavBar.js
@@ -9,7 +9,7 @@ import { MenuList } from './MenuList'
* @param {*} props
* @returns
*/
-export default function NavBar (props) {
+export default function NavBar(props) {
const [showSearchInput, changeShowSearchInput] = useState(false)
const router = useRouter()
const { searchModal } = useSimpleGlobal()
@@ -23,7 +23,7 @@ export default function NavBar (props) {
}
}
- const onKeyUp = (e) => {
+ const onKeyUp = e => {
if (e.keyCode === 13) {
const search = document.getElementById('theme-simple-search').value
if (search) {
@@ -33,19 +33,41 @@ export default function NavBar (props) {
}
return (
-
)
}
diff --git a/yarn.lock b/yarn.lock
index 7935bfbc..8e4cfd52 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -869,6 +869,11 @@
resolved "https://registry.yarnpkg.com/@pkgjs/parseargs/-/parseargs-0.11.0.tgz#a77ea742fab25775145434eb1d2328cf5013ac33"
integrity sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==
+"@pkgr/core@^0.1.0":
+ version "0.1.1"
+ resolved "https://r.cnpmjs.org/@pkgr/core/-/core-0.1.1.tgz#1ec17e2edbec25c8306d424ecfbf13c7de1aaa31"
+ integrity sha512-cq8o4cWH0ibXh9VGi5P20Tu9XF/0fFXl9EUinr9QfTM7a7p0oTA4iJRCQWppXR1Pg8dSM0UCItCkPwsk9qWWYA==
+
"@polka/url@^1.0.0-next.20", "@polka/url@^1.0.0-next.24":
version "1.0.0-next.24"
resolved "https://registry.yarnpkg.com/@polka/url/-/url-1.0.0-next.24.tgz#58601079e11784d20f82d0585865bb42305c4df3"
@@ -2415,6 +2420,11 @@ eslint-config-next@^13.1.1:
eslint-plugin-react "^7.33.2"
eslint-plugin-react-hooks "^4.5.0 || 5.0.0-canary-7118f5dd7-20230705"
+eslint-config-prettier@^9.1.0:
+ version "9.1.0"
+ resolved "https://r.cnpmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz#31af3d94578645966c082fcb71a5846d3c94867f"
+ integrity sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==
+
eslint-config-standard@^16.0.2:
version "16.0.3"
resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-16.0.3.tgz#6c8761e544e96c531ff92642eeb87842b8488516"
@@ -2514,6 +2524,14 @@ eslint-plugin-node@^11.1.0:
resolve "^1.10.1"
semver "^6.1.0"
+eslint-plugin-prettier@^5.1.3:
+ version "5.1.3"
+ resolved "https://r.cnpmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.1.3.tgz#17cfade9e732cef32b5f5be53bd4e07afd8e67e1"
+ integrity sha512-C9GCVAs4Eq7ZC/XFQHITLiHJxQngdtraXaM+LoUFoFp/lHNl2Zn8f3WQbe9HvTBBQ9YnKFB0/2Ajdqwo5D1EAw==
+ dependencies:
+ prettier-linter-helpers "^1.0.0"
+ synckit "^0.8.6"
+
eslint-plugin-promise@^5.1.0:
version "5.2.0"
resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-5.2.0.tgz#a596acc32981627eb36d9d75f9666ac1a4564971"
@@ -2685,6 +2703,11 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
+fast-diff@^1.1.2:
+ version "1.3.0"
+ resolved "https://r.cnpmjs.org/fast-diff/-/fast-diff-1.3.0.tgz#ece407fa550a64d638536cd727e129c61616e0f0"
+ integrity sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==
+
fast-glob@^3.2.9, fast-glob@^3.3.0, fast-glob@^3.3.1:
version "3.3.2"
resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.2.tgz#a904501e57cfdd2ffcded45e99a54fef55e46129"
@@ -4133,6 +4156,13 @@ prelude-ls@^1.2.1:
resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
+prettier-linter-helpers@^1.0.0:
+ version "1.0.0"
+ resolved "https://r2.cnpmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b"
+ integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==
+ dependencies:
+ fast-diff "^1.1.2"
+
prettier@3.2.5:
version "3.2.5"
resolved "https://r.cnpmjs.org/prettier/-/prettier-3.2.5.tgz#e52bc3090586e824964a8813b09aba6233b28368"
@@ -4831,6 +4861,14 @@ supports-preserve-symlinks-flag@^1.0.0:
resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
+synckit@^0.8.6:
+ version "0.8.8"
+ resolved "https://r.cnpmjs.org/synckit/-/synckit-0.8.8.tgz#fe7fe446518e3d3d49f5e429f443cf08b6edfcd7"
+ integrity sha512-HwOKAP7Wc5aRGYdKH+dw0PRRpbO841v2DENBtjnR5HFWoiNByAl7vrx3p0G/rCyYXQsrxqtX48TImFtPcIHSpQ==
+ dependencies:
+ "@pkgr/core" "^0.1.0"
+ tslib "^2.6.2"
+
table@^6.0.9:
version "6.8.1"
resolved "https://registry.yarnpkg.com/table/-/table-6.8.1.tgz#ea2b71359fe03b017a5fbc296204471158080bdf"
@@ -4968,7 +5006,7 @@ tslib@^1.11.1:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
-tslib@^2.1.0, tslib@^2.3.1, tslib@^2.4.0, tslib@^2.5.0:
+tslib@^2.1.0, tslib@^2.3.1, tslib@^2.4.0, tslib@^2.5.0, tslib@^2.6.2:
version "2.6.2"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==