Merge pull request #2351 from tangly1024/release/v4.4.6

Release/v4.4.6
This commit is contained in:
tangly1024
2024-04-29 10:26:51 +08:00
committed by GitHub
12 changed files with 179 additions and 63 deletions

View File

@@ -66,7 +66,7 @@ const Hero = props => {
<div className='text-white absolute bottom-0 flex flex-col h-full items-center justify-center w-full '> <div className='text-white absolute bottom-0 flex flex-col h-full items-center justify-center w-full '>
{/* 站点标题 */} {/* 站点标题 */}
<div className='font-black text-4xl md:text-5xl shadow-text'> <div className='font-black text-4xl md:text-5xl shadow-text'>
{siteConfig('TITLE')} {siteInfo?.title || siteConfig('TITLE')}
</div> </div>
{/* 站点欢迎语 */} {/* 站点欢迎语 */}
<div className='mt-2 h-12 items-center text-center font-medium shadow-text text-lg'> <div className='mt-2 h-12 items-center text-center font-medium shadow-text text-lg'>

View File

@@ -1,11 +1,20 @@
import { siteConfig } from '@/lib/config' import { siteConfig } from '@/lib/config'
import Link from 'next/link' import Link from 'next/link'
/**
* Logo
* 实际值支持文字
* @param {*} props
* @returns
*/
const Logo = props => { const Logo = props => {
const { siteInfo } = props
return ( return (
<Link href='/' passHref legacyBehavior> <Link href='/' passHref legacyBehavior>
<div className='flex flex-col justify-center items-center cursor-pointer space-y-3'> <div className='flex flex-col justify-center items-center cursor-pointer space-y-3'>
<div className='font-medium text-lg p-1.5 rounded dark:border-white dark:text-white menu-link transform duration-200'> {siteConfig('TITLE') }</div> <div className='font-medium text-lg p-1.5 rounded dark:border-white dark:text-white menu-link transform duration-200'>
{' '}
{siteInfo?.title || siteConfig('TITLE')}
</div>
</div> </div>
</Link> </Link>
) )

View File

@@ -29,13 +29,13 @@ export const MenuItemCollapse = props => {
return ( return (
<> <>
<div <div
className='w-full px-8 py-3 text-left dark:bg-hexo-black-gray' className='w-full px-8 py-3 dark:hover:bg-indigo-500 hover:bg-indigo-500 hover:text-white text-left dark:bg-hexo-black-gray'
onClick={toggleShow}> onClick={toggleShow}>
{!hasSubMenu && ( {!hasSubMenu && (
<Link <Link
href={link?.to} href={link?.to}
target={link?.target} target={link?.target}
className='font-extralight flex justify-between pl-2 pr-4 dark:text-gray-200 no-underline tracking-widest pb-1'> className=' font-extralight flex justify-between pl-2 pr-4 dark:text-gray-200 no-underline tracking-widest pb-1'>
<span className=' transition-all items-center duration-200'> <span className=' transition-all items-center duration-200'>
{link?.icon && <i className={link.icon + ' mr-4'} />} {link?.icon && <i className={link.icon + ' mr-4'} />}
{link?.name} {link?.name}
@@ -63,7 +63,7 @@ export const MenuItemCollapse = props => {
return ( return (
<div <div
key={index} key={index}
className='dark:bg-black dark:text-gray-200 text-left px-10 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 py-3 pr-6'> className='dark:hover:bg-indigo-500 hover:bg-indigo-500 hover:text-white dark:bg-black dark:text-gray-200 text-left px-10 justify-start bg-gray-50 tracking-widest transition-all duration-200 py-3 pr-6'>
<Link href={sLink.to} target={link?.target}> <Link href={sLink.to} target={link?.target}>
<span className='text-sm ml-4 whitespace-nowrap'> <span className='text-sm ml-4 whitespace-nowrap'>
{link?.icon && <i className={sLink.icon + ' mr-2'} />}{' '} {link?.icon && <i className={sLink.icon + ' mr-2'} />}{' '}

View File

@@ -1,6 +1,10 @@
import Link from 'next/link' import Link from 'next/link'
import { useState } from 'react' import { useState } from 'react'
/**
* 支持二级展开的菜单
* @param {*} param0
* @returns
*/
export const MenuItemDrop = ({ link }) => { export const MenuItemDrop = ({ link }) => {
const [show, changeShow] = useState(false) const [show, changeShow] = useState(false)
const hasSubMenu = link?.subMenus?.length > 0 const hasSubMenu = link?.subMenus?.length > 0
@@ -25,7 +29,7 @@ export const MenuItemDrop = ({ link }) => {
{hasSubMenu && ( {hasSubMenu && (
<> <>
<div className='cursor-pointer menu-link pl-2 pr-4 no-underline tracking-widest pb-1'> <div className='cursor-pointer menu-link pl-2 pr-4 no-underline tracking-widest pb-1'>
{link?.icon && <i className={link?.icon} />} {link?.name} {link?.icon && <i className={link?.icon} />} {link?.name}
<i <i
className={`px-2 fa fa-angle-down duration-300 ${show ? 'rotate-180' : 'rotate-0'}`}></i> className={`px-2 fa fa-angle-down duration-300 ${show ? 'rotate-180' : 'rotate-0'}`}></i>
@@ -42,7 +46,7 @@ export const MenuItemDrop = ({ link }) => {
return ( return (
<li <li
key={index} key={index}
className='cursor-pointer hover:bg-indigo-300 hover:text-black tracking-widest transition-all duration-200 dark:border-gray-800 py-1 pr-6 pl-3'> className='cursor-pointer hover:bg-indigo-500 hover:text-white tracking-widest transition-all duration-200 dark:border-gray-800 py-1 pr-6 pl-3'>
<Link href={sLink.to} target={link?.target}> <Link href={sLink.to} target={link?.target}>
<span className='text-sm text-nowrap font-extralight'> <span className='text-sm text-nowrap font-extralight'>
{link?.icon && <i className={sLink?.icon}> &nbsp; </i>} {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}

View File

@@ -1,17 +1,41 @@
import { useGlobal } from '@/lib/global'
import { siteConfig } from '@/lib/config' import { siteConfig } from '@/lib/config'
import { MenuItemCollapse } from './MenuItemCollapse' import { useGlobal } from '@/lib/global'
import CONFIG from '../config' import CONFIG from '../config'
import { MenuItemCollapse } from './MenuItemCollapse'
export const MenuListSide = (props) => { /**
* 侧拉抽屉菜单
* @param {*} props
* @returns
*/
export const MenuListSide = props => {
const { customNav, customMenu } = props const { customNav, customMenu } = props
const { locale } = useGlobal() const { locale } = useGlobal()
let links = [ let links = [
{ icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('HEXO_MENU_ARCHIVE', null, CONFIG) }, {
{ icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('HEXO_MENU_SEARCH', null, CONFIG) }, icon: 'fas fa-archive',
{ icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('HEXO_MENU_CATEGORY', null, CONFIG) }, name: locale.NAV.ARCHIVE,
{ icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('HEXO_MENU_TAG', null, CONFIG) } to: '/archive',
show: siteConfig('HEXO_MENU_ARCHIVE', null, CONFIG)
},
{
icon: 'fas fa-search',
name: locale.NAV.SEARCH,
to: '/search',
show: siteConfig('HEXO_MENU_SEARCH', null, CONFIG)
},
{
icon: 'fas fa-folder',
name: locale.COMMON.CATEGORY,
to: '/category',
show: siteConfig('HEXO_MENU_CATEGORY', null, CONFIG)
},
{
icon: 'fas fa-tag',
name: locale.COMMON.TAGS,
to: '/tag',
show: siteConfig('HEXO_MENU_TAG', null, CONFIG)
}
] ]
if (customNav) { if (customNav) {
@@ -34,8 +58,10 @@ export const MenuListSide = (props) => {
} }
return ( return (
<nav> <nav>
{links?.map((link, index) => <MenuItemCollapse key={index} link={link} />)} {links?.map((link, index) => (
</nav> <MenuItemCollapse key={index} link={link} />
))}
</nav>
) )
} }

View File

@@ -1,5 +1,5 @@
import { siteConfig } from '@/lib/config'
import LazyImage from '@/components/LazyImage' import LazyImage from '@/components/LazyImage'
import { siteConfig } from '@/lib/config'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import MenuGroupCard from './MenuGroupCard' import MenuGroupCard from './MenuGroupCard'
import { MenuListSide } from './MenuListSide' import { MenuListSide } from './MenuListSide'
@@ -11,22 +11,33 @@ import { MenuListSide } from './MenuListSide'
* @returns {JSX.Element} * @returns {JSX.Element}
* @constructor * @constructor
*/ */
const SideBar = (props) => { const SideBar = props => {
const { siteInfo } = props const { siteInfo } = props
const router = useRouter() const router = useRouter()
return ( return (
<div id='side-bar'> <div id='side-bar'>
<div className="h-52 w-full flex justify-center"> <div className='h-52 w-full flex justify-center'>
<div> <div>
<div onClick={() => { router.push('/') }} <div
className='justify-center items-center flex hover:rotate-45 py-6 hover:scale-105 dark:text-gray-100 transform duration-200 cursor-pointer'> onClick={() => {
<LazyImage src={siteInfo?.icon} className='rounded-full' width={80} alt={siteConfig('AUTHOR')} /> router.push('/')
</div> }}
<MenuGroupCard {...props} /> className='justify-center items-center flex hover:rotate-45 py-6 hover:scale-105 dark:text-gray-100 transform duration-200 cursor-pointer'>
</div> {/* 头像 */}
</div> <LazyImage
<MenuListSide {...props} /> src={siteInfo?.icon}
className='rounded-full'
width={80}
alt={siteConfig('AUTHOR')}
/>
</div>
{/* 总览 */}
<MenuGroupCard {...props} />
</div> </div>
</div>
{/* 侧拉抽屉的菜单 */}
<MenuListSide {...props} />
</div>
) )
} }

View File

@@ -9,7 +9,8 @@ import CONFIG from '../config'
let wrapperTop = 0 let wrapperTop = 0
/** /**
* * 首页英雄区
* 是一张大图,带个居中按钮
* @returns 头图 * @returns 头图
*/ */
const Hero = props => { const Hero = props => {
@@ -17,7 +18,6 @@ const Hero = props => {
const { siteInfo } = props const { siteInfo } = props
const { locale } = useGlobal() const { locale } = useGlobal()
const GREETING_WORDS = siteConfig('GREETING_WORDS').split(',') const GREETING_WORDS = siteConfig('GREETING_WORDS').split(',')
useEffect(() => { useEffect(() => {
updateHeaderHeight() updateHeaderHeight()
if (!typed && window && document.getElementById('typed')) { if (!typed && window && document.getElementById('typed')) {
@@ -61,7 +61,7 @@ const Hero = props => {
<div className='text-white absolute flex flex-col h-full items-center justify-center w-full '> <div className='text-white absolute flex flex-col h-full items-center justify-center w-full '>
{/* 站点标题 */} {/* 站点标题 */}
<div className='text-4xl md:text-5xl shadow-text'> <div className='text-4xl md:text-5xl shadow-text'>
{siteConfig('TITLE')} {siteInfo?.title || siteConfig('TITLE')}
</div> </div>
{/* 站点欢迎语 */} {/* 站点欢迎语 */}
<div className='mt-2 h-12 items-center text-center shadow-text text-white text-lg'> <div className='mt-2 h-12 items-center text-center shadow-text text-white text-lg'>

View File

@@ -1,11 +1,20 @@
import { siteConfig } from '@/lib/config' import { siteConfig } from '@/lib/config'
import Link from 'next/link' import Link from 'next/link'
/**
* 站点logo
* 这里默认只支持纯文字
* @param {*} props
* @returns
*/
const Logo = props => { const Logo = props => {
const { siteInfo } = props
return ( return (
<Link href='/' passHref legacyBehavior> <Link href='/' passHref legacyBehavior>
<div className='flex flex-col justify-center items-center cursor-pointer space-y-3'> <div className='flex flex-col justify-center items-center cursor-pointer space-y-3'>
<div className=' text-lg p-1.5 rounded dark:border-white hover:scale-110 transform duration-200'> {siteConfig('TITLE') }</div> <div className=' text-lg p-1.5 rounded dark:border-white hover:scale-110 transform duration-200'>
{' '}
{siteInfo?.title || siteConfig('TITLE')}
</div>
</div> </div>
</Link> </Link>
) )

View File

@@ -72,7 +72,7 @@ export const MenuItemCollapse = ({ link }) => {
return ( return (
<div <div
key={index} key={index}
className='cursor-pointer whitespace-nowrap dark:text-gray-200 w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100 hover:bg-indigo-700 hover:text-white dark:hover:bg-gray-900 tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'> className='cursor-pointer whitespace-nowrap dark:text-gray-200 w-full font-extralight dark:bg-black text-left px-5 justify-start bg-gray-100 hover:bg-indigo-500 dark:hover:bg-indigo-500 hover:text-white tracking-widest transition-all duration-200 border-b dark:border-gray-800 py-3 pr-6'>
<Link href={sLink.to} target={link?.target}> <Link href={sLink.to} target={link?.target}>
<span className='text-sm'> <span className='text-sm'>
<i className={`${sLink.icon} w-4 mr-3 text-center`} /> <i className={`${sLink.icon} w-4 mr-3 text-center`} />

View File

@@ -1,6 +1,9 @@
import Link from 'next/link' import Link from 'next/link'
import { useState } from 'react' import { useState } from 'react'
/**
* 菜单
* 支持二级展开的菜单
*/
export const MenuItemDrop = ({ link }) => { export const MenuItemDrop = ({ link }) => {
const [show, changeShow] = useState(false) const [show, changeShow] = useState(false)
const hasSubMenu = link?.subMenus?.length > 0 const hasSubMenu = link?.subMenus?.length > 0
@@ -42,7 +45,7 @@ export const MenuItemDrop = ({ link }) => {
return ( return (
<li <li
key={index} key={index}
className='cursor-pointer hover:bg-indigo-300 text-gray-900 hover:text-black tracking-widest transition-all duration-200 dark:border-gray-800 py-1 pr-6 pl-3'> className='cursor-pointer hover:bg-indigo-500 text-gray-900 hover:text-white tracking-widest transition-all duration-200 dark:border-gray-800 py-1 pr-6 pl-3'>
<Link href={sLink.to} target={link?.target}> <Link href={sLink.to} target={link?.target}>
<span className='text-sm text-nowrap font-extralight'> <span className='text-sm text-nowrap font-extralight'>
{link?.icon && <i className={sLink?.icon}> &nbsp; </i>} {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}

View File

@@ -1,17 +1,42 @@
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global' import { useGlobal } from '@/lib/global'
import CONFIG from '../config' import CONFIG from '../config'
import { MenuItemDrop } from './MenuItemDrop' import { MenuItemDrop } from './MenuItemDrop'
import { siteConfig } from '@/lib/config' /**
* 菜单列表
export const MenuListTop = (props) => { * 顶部导航栏用
* @param {*} props
* @returns
*/
export const MenuListTop = props => {
const { customNav, customMenu } = props const { customNav, customMenu } = props
const { locale } = useGlobal() const { locale } = useGlobal()
let links = [ let links = [
{ icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG) }, {
{ icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: siteConfig('MATERY_MENU_SEARCH', null, CONFIG) }, icon: 'fas fa-archive',
{ icon: 'fas fa-folder', name: locale.COMMON.CATEGORY, to: '/category', show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG) }, name: locale.NAV.ARCHIVE,
{ icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: siteConfig('MATERY_MENU_TAG', null, CONFIG) } to: '/archive',
show: siteConfig('MATERY_MENU_ARCHIVE', null, CONFIG)
},
{
icon: 'fas fa-search',
name: locale.NAV.SEARCH,
to: '/search',
show: siteConfig('MATERY_MENU_SEARCH', null, CONFIG)
},
{
icon: 'fas fa-folder',
name: locale.COMMON.CATEGORY,
to: '/category',
show: siteConfig('MATERY_MENU_CATEGORY', null, CONFIG)
},
{
icon: 'fas fa-tag',
name: locale.COMMON.TAGS,
to: '/tag',
show: siteConfig('MATERY_MENU_TAG', null, CONFIG)
}
] ]
if (customNav) { if (customNav) {
@@ -29,7 +54,9 @@ export const MenuListTop = (props) => {
return ( return (
<nav id='nav' className='leading-8 flex justify-center font-light w-full'> <nav id='nav' className='leading-8 flex justify-center font-light w-full'>
{links?.map((link, index) => <MenuItemDrop key={index} link={link}/>)} {links?.map((link, index) => (
<MenuItemDrop key={index} link={link} />
))}
</nav> </nav>
) )
} }

View File

@@ -5,27 +5,54 @@
* @returns * @returns
*/ */
const Style = () => { const Style = () => {
return <style jsx global>{` return (
// 底色 <style jsx global>{`
body{ // 底色
background-color: #f5f5f5 body {
} background-color: #f5f5f5;
.dark body{ }
.dark body {
background-color: black; background-color: black;
} }
/* 设置了从上到下的渐变黑色 */ /* 设置了从上到下的渐变黑色 */
#theme-matery .header-cover::before { #theme-matery .header-cover::before {
content: ""; content: '';
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 10%, rgba(0,0,0,0) 25%, rgba(0,0,0,0.2) 75%, rgba(0,0,0,0.5) 100%); background: linear-gradient(
} to bottom,
rgba(0, 0, 0, 0.5) 0%,
`}</style> rgba(0, 0, 0, 0.2) 10%,
rgba(0, 0, 0, 0) 25%,
rgba(0, 0, 0, 0.2) 75%,
rgba(0, 0, 0, 0.5) 100%
);
}
// 自定义滚动条
::-webkit-scrollbar {
width: 5px;
height: 5px;
}
::-webkit-scrollbar-track {
background: transparent;
}
::-webkit-scrollbar-thumb {
background-color: #4338ca;
}
* {
scrollbar-width: thin;
scrollbar-color: #4338ca transparent;
}
`}</style>
)
} }
export { Style } export { Style }