25 lines
1 KiB
TypeScript
25 lines
1 KiB
TypeScript
import { useState } from "react"
|
|
import { Quote } from "./pocketbase-types"
|
|
|
|
interface QuoteInfoProps {
|
|
quote: Quote;
|
|
}
|
|
export default function QuoteInfo({ quote }: QuoteInfoProps) {
|
|
|
|
return (
|
|
//TODO: Bettes Colors
|
|
<div className="dark:bg-slate-800 shadow-(--box) m-1 p-2">
|
|
<p className="border-4 border-black bg-slate-300 text-black p-1 my-1">{quote.quote}</p>
|
|
{quote.context && <p className="border-4 border-black bg-slate-300 text-black p-1 my-1">{quote.context}</p>}
|
|
<div className="flex flex-row">
|
|
<p className="bg-lime-400 text-zinc-800 p-1 border-4 border-r-2 border-black w-20">Author:</p>
|
|
<p className="bg-slate-300 border-4 border-l-2 border-black text-black p-1 grow">{quote.author}</p>
|
|
</div>
|
|
<div className="flex flex-row">
|
|
<p className="bg-lime-400 text-zinc-800 p-1 border-4 border-r-2 border-black w-20">Date:</p>
|
|
<p className="bg-slate-300 border-4 border-l-2 border-black text-black p-1 grow">{quote.date}</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|