Triston Armstrong
fd51f273f4
- removes tailwind (was cool but dont need it) - reworks a lot of the html - utilize a no css... library? css file? idk - add a few details - rework the navigation on the built notes pages - write a bunch of tailwind like css classes - ... maybe some more, too lazy
42 lines
820 B
TypeScript
42 lines
820 B
TypeScript
import { useRef, useEffect, type ElementType } from "react";
|
|
import { Border } from "./Border";
|
|
import ExternalLinkIcon from "./ExternalLinkIcon";
|
|
|
|
export interface ListItemProps {
|
|
label: string
|
|
date?: string
|
|
url: string
|
|
}
|
|
|
|
export default function ListItem({ label, date, url }: ListItemProps) {
|
|
return (
|
|
<div className="flex-row flex-between y-bottom gap-1">
|
|
<Link {...{ url, label }} />
|
|
<Divider />
|
|
<Date {...{ date }} />
|
|
<ExternalLinkIcon />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function Link({ url, label }) {
|
|
return (
|
|
<a href={url} target="_blank">
|
|
{label}
|
|
</a>
|
|
|
|
)
|
|
}
|
|
|
|
function Divider() {
|
|
return (
|
|
<div style={{ border: '1px dashed #fff2' }} className="flex-1" />
|
|
)
|
|
}
|
|
|
|
function Date({ date }) {
|
|
if (!date) return null
|
|
return <i className="font-muted" >{date}</i>
|
|
|
|
}
|