d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-28 07:26:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

NEXT主题，分类标签调整

Browse Source
This commit is contained in:
tangly1024
2022-03-01 12:49:38 +08:00
parent 0b2046b658
commit b89177644f
10 changed files with 69 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
themes/NEXT/LayoutCategoryIndex.js
View File

@@ -12,16 +12,16 @@ export const LayoutCategoryIndex = (props) => {
type: 'website'
}
return <LayoutBase meta={meta} totalPosts={allPosts} {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
<div className='dark:text-gray-200 mb-5'>
<i className='mr-4 fas faTh' />{locale.COMMON.CATEGORY}:
</div>
<div id='category-list' className='duration-200 flex flex-wrap'>
{Object.keys(categories).map(category => {
return <Link key={category} href={`/category/${category}`} passHref>
{categories.map(category => {
return <Link key={category.name} href={`/category/${category.name}`} passHref>
<div
className={'hover:text-black dark:hover:text-white dark:text-gray-300 dark:hover:bg-gray-600 px-5 cursor-pointer py-2 hover:bg-gray-100'}>
<i className='mr-4 fas fa-folder' />{category}({categories[category]})
<i className='mr-4 fas fa-folder' />{category.name}({category.count})
</div>
</Link>
})}

2
themes/NEXT/LayoutTagIndex.js
View File

@@ -12,7 +12,7 @@ export const LayoutTagIndex = (props) => {
type: 'website'
}
return <LayoutBase meta={meta} {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
<div className='dark:text-gray-200 mb-5'><i className='fas fa-tags mr-4'/>{locale.COMMON.TAGS}:</div>
<div id='tags-list' className='duration-200 flex flex-wrap'>
{ tags.map(tag => {

9
themes/NEXT/components/CategoryGroup.js
View File

@@ -2,16 +2,17 @@ import Link from 'next/link'
import React from 'react'
const CategoryGroup = ({ currentCategory, categories }) => {
if (!categories) return <></>
return <>
<div id='category-list' className='dark:border-gray-600 flex flex-wrap'>
{Object.keys(categories).map(category => {
const selected = currentCategory === category
return <Link key={category} href={`/category/${category}`} passHref>
{categories.map(category => {
const selected = currentCategory === category.name
return <Link key={category.name} href={`/category/${category.name}`} passHref>
<a className={(selected
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-gray-400 text-gray-500 hover:text-white hover:bg-gray-500 dark:hover:text-white') +
' text-sm w-full items-center duration-300 px-2 cursor-pointer py-1 font-light'}>
<i className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-400 fa-folder '} mr-2 fas`} />{category}({categories[category]})
<i className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-400 fa-folder '} mr-2 fas`} />{category.name}({category.count})
</a>
</Link>
})}

8
themes/NEXT/components/CategoryList.js
View File

@@ -10,10 +10,10 @@ const CategoryList = ({ currentCategory, categories }) => {
return <ul className='flex py-1 space-x-3'>
<li className='w-16 py-2 dark:text-gray-200 whitespace-nowrap'>{locale.COMMON.CATEGORY}</li>
{Object.keys(categories).map(category => {
const selected = category === currentCategory
{categories.map(category => {
const selected = category.name === currentCategory
return (
<Link key={category} href={`/category/${category}`} passHref>
<Link key={category.name} href={`/category/${category.name}`} passHref>
<li
className={`cursor-pointer border rounded-xl duration-200 mr-1 my-1 px-2 py-1 font-light text-sm whitespace-nowrap dark:text-gray-300
${selected
@@ -23,7 +23,7 @@ const CategoryList = ({ currentCategory, categories }) => {
>
<a>
<i className={`${selected ? 'fa-folder-open ' : 'fa-folder '} fas mr-1`}/>
{`${category} `}
{`${category.name} (${category.count})`}
</a>
</li>
</Link>)

23
themes/NEXT/components/SideAreaRight.js
View File

@@ -5,6 +5,7 @@ import Card from './Card'
import CategoryGroup from './CategoryGroup'
import TagGroups from './TagGroups'
import CONFIG_NEXT from '../config_next'
import { useRouter } from 'next/router'
/**
* 侧边平铺
@@ -16,18 +17,13 @@ import CONFIG_NEXT from '../config_next'
* @returns {JSX.Element}
* @constructor
*/
const SideAreaRight = ({
tags,
currentTag,
slot,
categories,
currentCategory
}) => {
const SideAreaRight = (props) => {
const { tags, currentTag, slot, categories, currentCategory } = props
const { locale } = useGlobal()
if (!CONFIG_NEXT.RIGHT_BAR) {
return <></>
}
const router = useRouter()
return (<aside id='right' className='hidden 2xl:block flex-col w-60 ml-4'>
{CONFIG_NEXT.RIGHT_AD && <Card className='mb-2'>
@@ -44,15 +40,16 @@ const SideAreaRight = ({
</Card>}
<div className="sticky top-4">
{slot}
{/* 分类 */}
{CONFIG_NEXT.RIGHT_CATEGORY_LIST && categories && (
{CONFIG_NEXT.RIGHT_CATEGORY_LIST && router.asPath !== '/category' && categories && (
<Card>
<div className='text-sm px-2 flex flex-nowrap justify-between font-light'>
<div className='pb-1 text-gray-600 dark:text-gray-300'><i icon={faThList} className='mr-2' />{locale.COMMON.CATEGORY}</div>
<div className='pb-1 text-gray-600 dark:text-gray-300'><i className='mr-2 fas fa-th-list' />{locale.COMMON.CATEGORY}</div>
<Link href={'/category'} passHref>
<a className='text-gray-400 hover:text-black dark:text-gray-400 dark:hover:text-white hover:underline cursor-pointer'>
{locale.COMMON.MORE} <i icon={faAngleRight} />
{locale.COMMON.MORE} <i className='fas fa-angle-right' />
</a>
</Link>
</div>
@@ -60,9 +57,7 @@ const SideAreaRight = ({
</Card>
)}
{slot}
{CONFIG_NEXT.RIGHT_TAG_LIST && tags && (
{CONFIG_NEXT.RIGHT_TAG_LIST && router.asPath !== '/tag' && tags && (
<Card>
<div className="text-sm pb-1 px-2 flex flex-nowrap justify-between font-light dark:text-gray-200">
<div className="text-gray-600 dark:text-gray-200">