feature: 封装Card组件

This commit is contained in:
tangly1024
2022-01-13 14:27:48 +08:00
parent 6e7d47184d
commit c98538e56f
12 changed files with 62 additions and 43 deletions

View File

@@ -1,9 +1,10 @@
import BLOG from '@/blog.config'
import { useGlobal } from '@/lib/global'
import { faAngleDoubleRight, faAngleRight, faTags, faThList } from '@fortawesome/free-solid-svg-icons'
import { faAngleDoubleRight, faAngleRight, faTag, faThList } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import Link from 'next/link'
import React from 'react'
import Card from './Card'
import CategoryGroup from './CategoryGroup'
import TagGroups from './TagGroups'
@@ -38,25 +39,25 @@ const SideAreaRight = ({
return (<aside id='right' className='hidden 2xl:block flex-col w-60 ml-4'>
<section className="shadow mb-5 py-4 px-2 bg-white dark:bg-gray-800 hover:shadow-xl duration-200">
{/* 展示广告 */}
<ins
className="adsbygoogle"
style={{ display: 'block' }}
data-adtest="on"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="8807314373"
data-ad-format="auto"
data-full-width-responsive="true"
></ins>
</section>
<Card>
{/* 展示广告 */}
<ins
className="adsbygoogle"
style={{ display: 'block' }}
data-adtest="on"
data-ad-client="ca-pub-2708419466378217"
data-ad-slot="8807314373"
data-ad-format="auto"
data-full-width-responsive="true"
></ins>
</Card>
<div className="sticky top-8">
<div className="sticky top-4">
{/* 分类 */}
{widget?.showCategoryList && categories && (
<section className='shadow py-4 mb-5 bg-white dark:bg-gray-800 hover:shadow-xl duration-200'>
<div className='text-sm px-5 mb-2 flex flex-nowrap justify-between font-light'>
<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'><FontAwesomeIcon icon={faThList} className='mr-2' />{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'>
@@ -65,16 +66,16 @@ const SideAreaRight = ({
</Link>
</div>
<CategoryGroup currentCategory={currentCategory} categories={categories} />
</section>
</Card>
)}
{slot}
{widget?.showTagList && tags && (
<section className="shadow py-4 mb-5 bg-white dark:bg-gray-800 hover:shadow-xl duration-200">
<div className="text-sm pb-1 px-5 flex flex-nowrap justify-between font-light dark:text-gray-200">
<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">
<FontAwesomeIcon icon={faTags} className="mr-2" />
<FontAwesomeIcon icon={faTag} className="mr-2" />
{locale.COMMON.TAGS}
</div>
<Link href="/tag" passHref>
@@ -84,10 +85,10 @@ const SideAreaRight = ({
</a>
</Link>
</div>
<div className="px-5 pt-2">
<div className="px-2 pt-2">
<TagGroups tags={tags} currentTag={currentTag} />
</div>
</section>
</Card>
)}
</div>