feat(web): articles list page and route
This commit is contained in:
parent
1b1cf75c73
commit
671b774ead
|
|
@ -0,0 +1,24 @@
|
||||||
|
import { history } from '@umijs/max'
|
||||||
|
import { articles } from '@/common/articles'
|
||||||
|
|
||||||
|
export default function ArticleList() {
|
||||||
|
return (
|
||||||
|
<div style={{ maxWidth: 820, margin: '0 auto', padding: '32px 16px 64px' }}>
|
||||||
|
<a onClick={() => history.push('/landing')} style={{ color: '#888' }}>← 返回首页</a>
|
||||||
|
<h1 style={{ fontSize: 24, margin: '16px 0 24px' }}>健康装修科普</h1>
|
||||||
|
<div style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
|
||||||
|
{articles.map(a => (
|
||||||
|
<article
|
||||||
|
key={a.id}
|
||||||
|
onClick={() => history.push('/article/' + a.id)}
|
||||||
|
style={{ cursor: 'pointer', padding: 20, border: '1px solid #eee', borderRadius: 8, transition: 'box-shadow .2s' }}
|
||||||
|
>
|
||||||
|
<div style={{ color: '#B43533', fontSize: 13 }}>{a.tag} · {a.date}</div>
|
||||||
|
<h2 style={{ fontSize: 18, margin: '8px 0' }}>{a.title}</h2>
|
||||||
|
<p style={{ color: '#666', fontSize: 14, lineHeight: 1.7, margin: 0 }}>{a.summary}</p>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue