feat: display title and icon; notification item

This commit is contained in:
DIYgod 2024-04-16 17:03:36 +08:00
parent 1cd242532d
commit 7555a17828
No known key found for this signature in database
5 changed files with 45 additions and 7 deletions

View File

@ -10,13 +10,17 @@ export function ArticleItem({
<div className='flex my-5 px-2 py-3'>
<SiteIcon url={entry.feed.site_url} />
<div className="line-clamp-5 text-sm flex-1 -mt-0.5 leading-tight">
<div className="text-zinc-500 text-[13px]">
{dayjs
.duration(dayjs(entry.published_at).diff(dayjs(), 'minute'), 'minute')
.humanize()}
<div className='text-zinc-500 text-[10px] space-x-1'>
<span>{entry.feed.title}</span>
<span>·</span>
<span>
{dayjs
.duration(dayjs(entry.published_at).diff(dayjs(), 'minute'), 'minute')
.humanize()}
</span>
</div>
<div className="font-medium">{entry.title}</div>
<div className="text-zinc-500 text-[13px] mt-0.5">{entry.text}</div>
<div className="font-medium my-0.5">{entry.title}</div>
<div className="text-zinc-500 text-[13px]">{entry.text}</div>
</div>
{entry.images?.[0] && (
<img

View File

@ -6,6 +6,7 @@ import { ArticleItem } from './article-item'
import { SocialMediaItem } from './social-media-item'
import { PictureItem } from './picture-item'
import { VideoItem } from './video-item'
import { NotificationItem } from './notification-item'
const gridMode = ['Pictures', 'Videos']
@ -37,6 +38,9 @@ export function EntryColumn({
case 'Videos':
Item = VideoItem
break
case 'Notifications':
Item = NotificationItem
break
default:
Item = ArticleItem
}

View File

@ -0,0 +1,26 @@
import dayjs from '@renderer/lib/dayjs'
import { SiteIcon } from '../site-icon'
export function NotificationItem({
entry,
}: {
entry: any,
}) {
return (
<div className='flex my-5 px-2 py-3'>
<SiteIcon url={entry.feed.site_url} />
<div className="line-clamp-5 text-sm flex-1 -mt-0.5 leading-tight">
<div className='text-zinc-500 text-[10px] space-x-1'>
<span>{entry.feed.title}</span>
<span>·</span>
<span>
{dayjs
.duration(dayjs(entry.published_at).diff(dayjs(), 'minute'), 'minute')
.humanize()}
</span>
</div>
<div className="my-0.5">{entry.title}</div>
</div>
</div>
)
}

View File

@ -1,4 +1,5 @@
import dayjs from '@renderer/lib/dayjs'
import { SiteIcon } from '../site-icon'
export function PictureItem({
entry,
@ -21,7 +22,8 @@ export function PictureItem({
<div className="line-clamp-5 text-sm flex-1 px-2 pb-3 pt-1">
<div className="font-medium line-clamp-2">{entry.title}</div>
<div className='space-x-1 text-[13px]'>
<span>{entry.author}</span>
<SiteIcon className='w-3.5 h-3.5 inline-block mr-0 align-sub' url={entry.feed.site_url} />
<span>{entry.feed.title}</span>
<span className="text-zinc-500">·</span>
<span className="text-zinc-500">
{dayjs

View File

@ -1,4 +1,5 @@
import dayjs from '@renderer/lib/dayjs'
import { SiteIcon } from '../site-icon'
export function VideoItem({
entry,
@ -21,6 +22,7 @@ export function VideoItem({
<div className="line-clamp-5 text-sm flex-1 px-2 pb-3 pt-1">
<div className="font-medium line-clamp-2">{entry.title}</div>
<div className='space-x-1 text-[13px]'>
<SiteIcon className='w-3.5 h-3.5 inline-block mr-0 align-sub' url={entry.feed.site_url} />
<span>{entry.author}</span>
<span className="text-zinc-500">·</span>
<span className="text-zinc-500">