Skip to content

Commit f7258fd

Browse files
committed
heo 主题 一点点细节
1 parent 2372dde commit f7258fd

14 files changed

+203
-136
lines changed

lib/lang/en-US.js

+3
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,9 @@ export default {
3333
COPYRIGHT: 'Copyright',
3434
AUTHOR: 'Author',
3535
URL: 'URL',
36+
NOW: 'NOW',
37+
RECOMMEND_BADGES: 'Recommend',
38+
BLOG: 'Blog',
3639
POSTS: 'Posts',
3740
ARTICLE: 'Article',
3841
VISITORS: 'Visitors',

lib/lang/zh-CN.js

+3
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,9 @@ export default {
3535
AUTHOR: '作者',
3636
URL: '链接',
3737
ANALYTICS: '统计',
38+
RECOMMEND_BADGES: '荐',
39+
BLOG: '博客',
40+
NOW: '此刻',
3841
POSTS: '篇文章',
3942
ARTICLE: '文章',
4043
VISITORS: '位访客',

styles/notion.css

+1
Original file line numberDiff line numberDiff line change
@@ -1451,6 +1451,7 @@ code[class*='language-'] {
14511451

14521452
.notion-collection-card-property .notion-page-title-text {
14531453
border-bottom: 0 none;
1454+
@apply dark:text-gray-200;
14541455
}
14551456

14561457
.notion-collection-card-property

themes/heo/components/BlogPostCard.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -50,11 +50,11 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => {
5050
{/* 分类 */}
5151
{post?.category && (
5252
<div
53-
className={`flex mb-1 items-center ${showPreview ? 'justify-center' : 'justify-start'} hidden md:block flex-wrap dark:text-gray-500 text-gray-600 `}>
53+
className={`flex mb-1 items-center ${showPreview ? 'justify-center' : 'justify-start'} hidden md:block flex-wrap dark:text-gray-300 text-gray-600 hover:text-indigo-700 dark:hover:text-yellow-500`}>
5454
<Link
5555
passHref
5656
href={`/category/${post.category}`}
57-
className='cursor-pointer text-xs font-normal menu-link hover:text-indigo-700 dark:hover:text-yellow-700 dark:text-gray-600 transform'>
57+
className='cursor-pointer text-xs font-normal menu-link '>
5858
{post.category}
5959
</Link>
6060
</div>

themes/heo/components/CategoryBar.js

+35-15
Original file line numberDiff line numberDiff line change
@@ -29,23 +29,40 @@ export default function CategoryBar(props) {
2929
}
3030
}
3131

32-
return <div id='category-bar' className={`flex flex-nowrap justify-between items-center h-12 mb-4 space-x-2 w-full lg:bg-white dark:lg:bg-[#1e1e1e]
32+
return (
33+
<div
34+
id='category-bar'
35+
className={`flex flex-nowrap justify-between items-center h-12 mb-4 space-x-2 w-full lg:bg-white dark:lg:bg-[#1e1e1e]
3336
${border ? 'lg:border lg:hover:border dark:lg:border-gray-800 hover:border-indigo-600 dark:hover:border-yellow-600 ' : ''} py-2 lg:px-2 rounded-xl transition-colors duration-200`}>
37+
<div
38+
id='category-bar-items'
39+
ref={categoryBarItemsRef}
40+
className='scroll-smooth max-w-4xl rounded-lg scroll-hidden flex justify-start flex-nowrap items-center overflow-x-scroll'>
41+
<MenuItem href='/' name={locale.NAV.INDEX} />
42+
{categoryOptions?.map((c, index) => (
43+
<MenuItem key={index} href={`/category/${c.name}`} name={c.name} />
44+
))}
45+
</div>
3446

35-
<div id='category-bar-items' ref={categoryBarItemsRef} className='scroll-smooth max-w-4xl rounded-lg scroll-hidden flex justify-start flex-nowrap items-center overflow-x-scroll'>
36-
<MenuItem href='/' name={locale.NAV.INDEX} />
37-
{categoryOptions?.map((c, index) => <MenuItem key={index} href={`/category/${c.name}`} name={c.name} />)}
38-
</div>
39-
40-
<div id='category-bar-next' className='flex items-center justify-center'>
41-
<div id='right' className='cursor-pointer mx-2' onClick={handleToggleScroll}>
42-
{scrollRight ? <ChevronDoubleLeft className={'w-5 h-5'} /> : <ChevronDoubleRight className={'w-5 h-5'} /> }
43-
</div>
44-
<Link href='/category' className='whitespace-nowrap font-bold text-gray-900 dark:text-white transition-colors duration-200 hover:text-indigo-600'>
45-
{locale.MENU.CATEGORY}
46-
</Link>
47+
<div id='category-bar-next' className='flex items-center justify-center'>
48+
<div
49+
id='right'
50+
className='cursor-pointer mx-2 dark:text-gray-300 dark:hover:text-yellow-600 hover:text-indigo-600'
51+
onClick={handleToggleScroll}>
52+
{scrollRight ? (
53+
<ChevronDoubleLeft className={'w-5 h-5'} />
54+
) : (
55+
<ChevronDoubleRight className={'w-5 h-5'} />
56+
)}
4757
</div>
58+
<Link
59+
href='/category'
60+
className='whitespace-nowrap font-bold text-gray-900 dark:text-white transition-colors duration-200 hover:text-indigo-600 dark:hover:text-yellow-600'>
61+
{locale.MENU.CATEGORY}
62+
</Link>
63+
</div>
4864
</div>
65+
)
4966
}
5067

5168
/**
@@ -57,7 +74,10 @@ const MenuItem = ({ href, name }) => {
5774
const router = useRouter()
5875
const { category } = router.query
5976
const selected = category === name
60-
return <div className={`whitespace-nowrap mr-2 duration-200 transition-all font-bold px-2 py-0.5 rounded-md text-gray-900 dark:text-white hover:text-white hover:bg-indigo-600 dark:hover:bg-yellow-600 ${selected ? 'text-white bg-indigo-600 dark:bg-yellow-600' : ''}`}>
61-
<Link href={href}>{name}</Link>
77+
return (
78+
<div
79+
className={`whitespace-nowrap mr-2 duration-200 transition-all font-bold px-2 py-0.5 rounded-md text-gray-900 dark:text-white hover:text-white hover:bg-indigo-600 dark:hover:bg-yellow-600 ${selected ? 'text-white bg-indigo-600 dark:bg-yellow-600' : ''}`}>
80+
<Link href={href}>{name}</Link>
6281
</div>
82+
)
6383
}

themes/heo/components/Hero.js

+10-5
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import { ArrowSmallRight, PlusSmall } from '@/components/HeroIcons'
33
import LazyImage from '@/components/LazyImage'
44
import { siteConfig } from '@/lib/config'
5+
import { useGlobal } from '@/lib/global'
56
import Link from 'next/link'
67
import { useRouter } from 'next/router'
78
import { useImperativeHandle, useRef, useState } from 'react'
@@ -206,6 +207,7 @@ function GroupMenu() {
206207
*/
207208
function TopGroup(props) {
208209
const { latestPosts, allNavPages, siteInfo } = props
210+
const { locale } = useGlobal()
209211
const todayCardRef = useRef()
210212
function handleMouseLeave() {
211213
todayCardRef.current.coverUp()
@@ -238,7 +240,7 @@ function TopGroup(props) {
238240
</div>
239241
{/* hover 悬浮的 ‘荐’ 字 */}
240242
<div className='opacity-0 group-hover:opacity-100 -translate-x-4 group-hover:translate-x-0 duration-200 transition-all absolute -top-2 -left-2 bg-indigo-600 dark:bg-yellow-600 text-white rounded-xl overflow-hidden pr-2 pb-2 pl-4 pt-4 text-xs'>
241-
243+
{locale.COMMON.RECOMMEND_BADGES}
242244
</div>
243245
</div>
244246
</Link>
@@ -304,6 +306,7 @@ function getTopPosts({ latestPosts, allNavPages }) {
304306
function TodayCard({ cRef, siteInfo }) {
305307
const router = useRouter()
306308
const link = siteConfig('HEO_HERO_TITLE_LINK', null, CONFIG)
309+
const { locale } = useGlobal()
307310
// 卡牌是否盖住下层
308311
const [isCoverUp, setIsCoverUp] = useState(true)
309312

@@ -348,7 +351,7 @@ function TodayCard({ cRef, siteInfo }) {
348351
isCoverUp
349352
? 'opacity-100 cursor-pointer'
350353
: 'opacity-0 transform scale-110 pointer-events-none'
351-
} shadow transition-all duration-200 today-card h-full bg-[#0E57D5] rounded-xl relative overflow-hidden flex items-end`}>
354+
} shadow transition-all duration-200 today-card h-full bg-[#0E57D5] dark:bg-yellow-500 rounded-xl relative overflow-hidden flex items-end`}>
352355
<div
353356
id='today-card-info'
354357
className='z-10 flex justify-between w-full relative text-white p-10 items-end'>
@@ -364,12 +367,14 @@ function TodayCard({ cRef, siteInfo }) {
364367
onClick={handleClickMore}
365368
className={`'${
366369
isCoverUp ? '' : 'hidden pointer-events-none '
367-
} flex items-center px-3 h-10 justify-center bg-[#425aef] hover:bg-[#4259efcb] transition-colors duration-100 rounded-3xl`}>
370+
} flex items-center px-3 h-10 justify-center bg-[#425aef] hover:bg-[#4259efcb] dark:bg-yellow-500 dark:hover:bg-yellow-600 transition-colors duration-100 rounded-3xl`}>
368371
<PlusSmall
369-
className={'w-6 h-6 mr-2 bg-white rounded-full stroke-indigo-400'}
372+
className={
373+
'w-6 h-6 mr-2 bg-white rounded-full stroke-indigo-400 dark:stroke-yellow-400'
374+
}
370375
/>
371376
<div id='more' className='select-none'>
372-
更多推荐
377+
{locale.COMMON.MORE}
373378
</div>
374379
</div>
375380
</div>

themes/heo/components/LatestPostsGroupMini.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -50,13 +50,13 @@ export default function LatestPostsGroupMini({ latestPosts, siteInfo }) {
5050
</div>
5151
<div
5252
className={
53-
(selected ? ' text-indigo-400 ' : 'dark:text-gray-400 ') +
53+
(selected ? ' text-indigo-400 ' : 'dark:text-gray-200') +
5454
' text-sm overflow-x-hidden hover:text-indigo-600 px-2 duration-200 w-full rounded ' +
55-
' hover:text-indigo-400 cursor-pointer items-center flex'
55+
' hover:text-indigo-400 dark:hover:text-yellow-600 cursor-pointer items-center flex'
5656
}>
5757
<div>
5858
<div className='line-clamp-2 menu-link'>{post.title}</div>
59-
<div className='text-gray-500'>{post.lastEditedDay}</div>
59+
<div className='text-gray-400'>{post.lastEditedDay}</div>
6060
</div>
6161
</div>
6262
</Link>

themes/heo/components/MenuItemCollapse.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export const MenuItemCollapse = ({ link }) => {
2828
return (
2929
<>
3030
<div
31-
className='select-none w-full px-2 py-2 border rounded-xl text-left dark:bg-hexo-black-gray'
31+
className='select-none w-full p-2 border dark:border-gray-600 rounded-lg text-left dark:bg-[#1e1e1e]'
3232
onClick={toggleShow}>
3333
{!hasSubMenu && (
3434
<Link
@@ -62,7 +62,7 @@ export const MenuItemCollapse = ({ link }) => {
6262
return (
6363
<div
6464
key={index}
65-
className='dark:bg-black dark:text-gray-200 text-left px-3 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 py-3 pr-6'>
65+
className='dark:bg-hexo-black-gray dark:text-gray-200 text-left px-3 justify-start bg-gray-50 hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200 py-3 pr-6'>
6666
<Link href={sLink.href} target={link?.target}>
6767
<span className='text-sm ml-4 whitespace-nowrap'>
6868
{link?.icon && <i className={sLink.icon + ' mr-2'} />}{' '}

themes/heo/components/MenuItemDrop.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -36,12 +36,12 @@ export const MenuItemDrop = ({ link }) => {
3636
{hasSubMenu && (
3737
<ul
3838
style={{ backdropFilter: 'blur(3px)' }}
39-
className={`${show ? 'visible opacity-100 top-14' : 'invisible opacity-0 top-20'} drop-shadow-md overflow-hidden rounded-xl bg-white transition-all duration-300 z-20 absolute`}>
39+
className={`${show ? 'visible opacity-100 top-14' : 'invisible opacity-0 top-20'} drop-shadow-md overflow-hidden rounded-xl bg-white dark:bg-[#1e1e1e] border dark:border-gray-700 transition-all duration-300 z-20 absolute`}>
4040
{link.subMenus.map((sLink, index) => {
4141
return (
4242
<li
4343
key={index}
44-
className='cursor-pointer hover:bg-blue-600 hover:text-white text-gray-900 tracking-widest transition-all duration-200 dark:border-gray-700 py-1 pr-6 pl-3'>
44+
className='cursor-pointer hover:bg-blue-600 dark:hover:bg-yellow-600 hover:text-white text-gray-900 dark:text-gray-100 tracking-widest transition-all duration-200 dark:border-gray-700 py-1 pr-6 pl-3'>
4545
<Link href={sLink.href} target={link?.target}>
4646
<span className='text-sm text-nowrap font-extralight'>
4747
{link?.icon && <i className={sLink?.icon}> &nbsp; </i>}

themes/heo/components/MenuListSide.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ export const MenuListSide = props => {
4848
}
4949

5050
return (
51-
<nav className='flex-col space-y-2'>
51+
<nav className='flex-col space-y-1'>
5252
{links?.map((link, index) => (
5353
<MenuItemCollapse key={index} link={link} />
5454
))}

themes/heo/components/NoticeBar.js

+13-10
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
1-
21
import { ArrowRightCircle } from '@/components/HeroIcons'
2+
import { siteConfig } from '@/lib/config'
3+
import { useGlobal } from '@/lib/global'
34
import CONFIG from '../config'
45
import Swipe from './Swipe'
5-
import { siteConfig } from '@/lib/config'
66

77
/**
88
* 通知横幅
99
*/
1010
export function NoticeBar() {
1111
let notices = siteConfig('HEO_NOTICE_BAR', null, CONFIG)
12+
const { locale } = useGlobal()
1213
if (typeof notices === 'string') {
1314
notices = JSON.parse(notices)
1415
}
@@ -17,14 +18,16 @@ export function NoticeBar() {
1718
}
1819

1920
return (
20-
<div className="max-w-[86rem] w-full mx-auto flex h-12 mb-4 px-5 font-bold">
21-
<div className="animate__animated animate__fadeIn animate__fast group cursor-pointer bg-white dark:bg-[#1e1e1e] dark:text-white hover:border-indigo-600 dark:hover:border-yellow-600 border dark:border-gray-700 duration-200 hover:shadow-md transition-all rounded-xl w-full h-full flex items-center justify-between px-5">
22-
<span className='whitespace-nowrap'>此刻</span>
23-
<div className="w-full h-full hover:text-indigo-600 flex justify-center items-center">
24-
<Swipe items={notices} />
25-
</div>
26-
<div><ArrowRightCircle className={'w-5 h-5'} /></div>
27-
</div>
21+
<div className='max-w-[86rem] w-full mx-auto flex h-12 mb-4 px-5 font-bold'>
22+
<div className='animate__animated animate__fadeIn animate__fast group cursor-pointer bg-white dark:bg-[#1e1e1e] dark:text-white hover:border-indigo-600 dark:hover:border-yellow-600 border dark:border-gray-700 duration-200 hover:shadow-md transition-all rounded-xl w-full h-full flex items-center justify-between px-5'>
23+
<span className='whitespace-nowrap'>{locale.COMMON.NOW}</span>
24+
<div className='w-full h-full hover:text-indigo-600 dark:hover:text-yellow-600 flex justify-center items-center'>
25+
<Swipe items={notices} />
26+
</div>
27+
<div>
28+
<ArrowRightCircle className={'w-5 h-5'} />
2829
</div>
30+
</div>
31+
</div>
2932
)
3033
}

themes/heo/components/PostHeader.js

+6-5
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export default function PostHeader({ post, siteInfo, isDarkMode }) {
1818
}
1919
// 文章头图
2020
const headerImage = post?.pageCover ? post.pageCover : siteInfo?.pageCover
21-
21+
const ANALYTICS_BUSUANZI_ENABLE = siteConfig('ANALYTICS_BUSUANZI_ENABLE')
2222
return (
2323
<div
2424
id='post-bg'
@@ -67,7 +67,7 @@ export default function PostHeader({ post, siteInfo, isDarkMode }) {
6767
className='mr-4'
6868
passHref
6969
legacyBehavior>
70-
<div className='cursor-pointer font-sm font-bold px-3 py-1 rounded-lg bg-blue-500 hover:bg-white text-white hover:text-blue-500 duration-200 '>
70+
<div className='cursor-pointer font-sm font-bold px-3 py-1 rounded-lg hover:bg-white text-white bg-blue-500 dark:bg-yellow-500 hover:text-blue-500 duration-200 '>
7171
{post.category}
7272
</div>
7373
</Link>
@@ -103,8 +103,8 @@ export default function PostHeader({ post, siteInfo, isDarkMode }) {
103103
</div>
104104

105105
{/* 标题底部补充信息 */}
106-
<section className='flex-wrap shadow-text-md flex text-sm justify-center md:justify-start mt-4 text-white dark:text-gray-400 font-light leading-8'>
107-
<div className='flex justify-center dark:text-gray-200 text-opacity-70'>
106+
<section className='flex-wrap dark:text-gray-200 text-opacity-70 shadow-text-md flex text-sm justify-center md:justify-start mt-4 text-white font-light leading-8'>
107+
<div className='flex justify-center '>
108108
<div className='mr-2'>
109109
<WordCount />
110110
</div>
@@ -126,7 +126,8 @@ export default function PostHeader({ post, siteInfo, isDarkMode }) {
126126
</div>
127127
</div>
128128

129-
{JSON.parse(siteConfig('ANALYTICS_BUSUANZI_ENABLE')) && (
129+
{/* 阅读统计 */}
130+
{ANALYTICS_BUSUANZI_ENABLE && (
130131
<div className='busuanzi_container_page_pv font-light mr-2'>
131132
<i className='fa-solid fa-fire-flame-curved'></i>{' '}
132133
<span className='mr-2 busuanzi_value_page_pv' />

0 commit comments

Comments
 (0)