werefox-cafe/src/info/components/testimonial-card.js

54 lines
1.8 KiB
JavaScript

import Link from "next/link";
export default function TestimonialCard({ src, alt, url, innerText, user }) {
const finalsrc = Boolean(src) ? src : "/images/logo.png";
const isMe =
user == "Shadow8t4"
? "text-werefox-blue-dark dark:text-werefox-blue"
: "text-werefox-pink-dark dark:text-werefox-pink";
const isMeLink =
user == "Shadow8t4"
? "hover:text-werefox-pink-dark dark:hover:text-werefox-pink"
: "hover:text-werefox-blue-dark dark:hover:text-werefox-blue";
let testimonialarray = innerText.split("\n");
testimonialarray = testimonialarray.slice(0, testimonialarray.length - 1);
const testimonialdict = Object.assign({}, testimonialarray);
return (
<div className="rounded-lg min-w-full flex overflow-hidden ring-2 ring-werefox-grey dark:ring-werefox-grey-darker bg-werefox-grey-light dark:bg-werefox-grey">
<Link href={url}>
<a>
<div className="flex-1 pt-4 pb-4 pl-4">
{" "}
<img
className="rounded-lg sm:w-32 w-16"
src={finalsrc}
alt={alt}
/>{" "}
</div>
</a>
</Link>{" "}
<div className="flex flex-5 p-4 items-center justify-center min-h-full">
<div
className={`animate-wiggle sm:text-lg text-xs text-center ${isMe}`}
>
{Object.keys(testimonialdict).map((t) => (
<p className="overflow-auto" key={t}>
{testimonialdict[t] == "" ? <br /> : testimonialdict[t]}
</p>
))}
<p>
{"- "}
<Link href={url}>
<a
target="_blank"
className={`transition ${isMeLink}`}
>{`@${user}`}</a>
</Link>
</p>
</div>
</div>
</div>
);
}