crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-19 07:56:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update stories.tsx

Browse Source
This commit is contained in:
Sol Irvine 2023-08-21 08:40:22 +09:00
parent 9435addd45
commit 9fc2c779e3
1 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/layout/stories.tsx
View File

@ -28,11 +28,16 @@ export default async function Stories({
<div className="px-6 py-24"> <div className="px-6 py-24">
<div className="mx-auto flex max-w-screen-lg flex-col space-y-6"> <div className="mx-auto flex max-w-screen-lg flex-col space-y-6">
<h3 className="font-serif text-5xl">stories</h3> <h3 className="font-serif text-5xl">stories</h3>
<div className={clsx('font-multilingual font-extralight', 'flex flex-col space-y-px')}> <div
className={clsx(
'font-multilingual font-extralight',
'flex flex-col space-y-6 md:space-y-px'
)}
>
{blog?.articles?.map((article) => ( {blog?.articles?.map((article) => (
<Link href={`/stories/${article.handle}`}> <Link href={`/stories/${article.handle}`}>
<div className="flex flex-row space-x-2 bg-white text-black md:col-span-1"> <div className="flex flex-col space-y-2 bg-white text-black md:col-span-1 md:flex-row md:space-x-2 md:space-y-0">
<div className="relative aspect-[4/3] min-w-[480px] overflow-hidden"> <div className="relative aspect-[4/3] min-w-full overflow-hidden md:min-w-[480px]">
{!!article?.image?.url && ( {!!article?.image?.url && (
<Image <Image
src={article?.image?.url} src={article?.image?.url}
@ -46,7 +51,7 @@ export default async function Stories({
/> />
)} )}
</div> </div>
<div className="flex grow flex-col space-y-4 p-12"> <div className="flex grow flex-col space-y-4 p-6 md:p-12">
<div className="text-sm"> <div className="text-sm">
{format(new Date(article?.publishedAt), 'yyyy-MM-dd')} {format(new Date(article?.publishedAt), 'yyyy-MM-dd')}
</div> </div>