git.iko.soy/urbit.org
on roller-tutorial help sign in
urbit.org/components/PostPreview.js
45 lines 1.4 kB history raw
1import Link from "next/link";
2import BackgroundImage from "./BackgroundImage";
3import { formatDate, generateDisplayDate } from "../lib/lib";
5export default function PostPreview(props) {
6 const section = props?.section ? props.section : "blog";
8 const date = generateDisplayDate(props.post.date);
9 return (
10 <div className={`cursor-pointer ${props.className}`}>
11 {props.title ? <h3 className="mb-2">{props.title}</h3> : null}
13 <Link
14 href={`/${section}/${props.post.slug}`}
15 key={`post-${props.post.slug}`}
16 >
17 <div>
18 <BackgroundImage
19 className="aspect-w-5 aspect-h-4 rounded-lg"
20 src={props.post.extra.image || ""}
21 />
23 <h4 className="mt-2">{props.post.title}</h4>
24 <div className="flex items-baseline mt-1">
25 {props.post.extra.author ? (
26 <div className="type-sub-bold mr-2">
27 {props.post.extra.author}
28 </div>
29 ) : null}
30 {props.post.extra.ship ? (
31 <div className="type-sub-bold text-wall-500 font-mono">
32 {props.post.extra.ship}
33 </div>
34 ) : null}
35 </div>
36 <div className="text-wall-500 type-sub mt-1">{formatDate(date)}</div>
37 </div>
38 </Link>
39 </div>
40 );
43PostPreview.defaultProps = {
44 className: "",
45};