card组件多余 直接移除

This commit is contained in:
tangly1024
2025-01-01 15:32:08 +08:00
parent eb9d757a91
commit 9069348fd7
2 changed files with 41 additions and 31 deletions

View File

@@ -1,10 +0,0 @@
const Card = ({ children, headerSlot, className }) => {
return <div className={className}>
<>{headerSlot}</>
<section className="card shadow-md hover:shadow-md dark:text-gray-300 border dark:border-black rounded-xl lg:p-6 p-4 bg-white dark:bg-hexo-black-gray lg:duration-100">
{children}
</section>
</div>
}
export default Card

View File

@@ -1,16 +1,15 @@
import Card from '@./HexoCard'
import { useGlobal } from '@/lib/global'
import Link from 'next/link'
import { RecentComments } from '@waline/client'
import { useEffect, useState } from 'react'
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import { RecentComments } from '@waline/client'
import Link from 'next/link'
import { useEffect, useState } from 'react'
/**
* @see https://waline.js.org/guide/get-started.html
* @param {*} props
* @returns
*/
const HexoRecentComments = (props) => {
const HexoRecentComments = props => {
const [comments, updateComments] = useState([])
const { locale } = useGlobal()
const [onLoading, changeLoading] = useState(true)
@@ -25,22 +24,43 @@ const HexoRecentComments = (props) => {
}, [])
return (
<Card >
<div className=" mb-2 px-1 justify-between">
<i className="mr-2 fas fas fa-comment" />
{locale.COMMON.RECENT_COMMENTS}
<section className='card shadow-md hover:shadow-md dark:text-gray-300 border dark:border-black rounded-xl lg:p-6 p-4 bg-white dark:bg-hexo-black-gray lg:duration-100'>
<div className=' mb-2 px-1 justify-between'>
<i className='mr-2 fas fas fa-comment' />
{locale.COMMON.RECENT_COMMENTS}
</div>
{onLoading && (
<div>
Loading...
<i className='ml-2 fas fa-spinner animate-spin' />
</div>
)}
{!onLoading && comments && comments.length === 0 && (
<div>No Comments</div>
)}
{!onLoading &&
comments &&
comments.length > 0 &&
comments.map(comment => (
<div key={comment.objectId} className='pb-2 pl-1'>
<div
className='dark:text-gray-200 text-sm waline-recent-content wl-content'
dangerouslySetInnerHTML={{ __html: comment.comment }}
/>
<div className='dark:text-gray-400 text-gray-400 text-sm text-right cursor-pointer hover:text-red-500 hover:underline pt-1 pr-2'>
<Link
href={{
pathname: comment.url,
hash: comment.objectId,
query: { target: 'comment' }
}}>
--{comment.nick}
</Link>
</div>
{onLoading && <div>Loading...<i className='ml-2 fas fa-spinner animate-spin' /></div>}
{!onLoading && comments && comments.length === 0 && <div>No Comments</div>}
{!onLoading && comments && comments.length > 0 && comments.map((comment) => <div key={comment.objectId} className='pb-2 pl-1'>
<div className='dark:text-gray-200 text-sm waline-recent-content wl-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
<div className='dark:text-gray-400 text-gray-400 text-sm text-right cursor-pointer hover:text-red-500 hover:underline pt-1 pr-2'>
<Link href={{ pathname: comment.url, hash: comment.objectId, query: { target: 'comment' } }}>--{comment.nick}</Link>
</div>
</div>)}
</Card>
</div>
))}
</section>
)
}