XeNote/components/ListItem.tsx

23 lines
715 B
TypeScript

import ExternalLinkIcon from "./ExternalLinkIcon";
export interface ListItemProps {
label: string
date?: string
url: string
}
export default function ListItem({ label, date, url }: ListItemProps) {
return (
<div className="hover:bg-white hover:bg-opacity-15 hover:px-3 hover:rounded transition-all duration-200 flex flex-row items-baseline justify-between gap-2">
<p className="text-sm ">{label}</p>
<div className="border border-dashed flex-1 border-gray-500 h-0"></div>
<div className="flex gap-1 items-baseline">
{!!date && <i className="text-xs">{date}</i>}
<a href={url} target="_blank">
<ExternalLinkIcon />
</a>
</div>
</div>
)
}