40 lines
1.7 KiB
JavaScript
40 lines
1.7 KiB
JavaScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
|
|
export default function TestimonialCard({ src, alt, url, innerText, user }) {
|
|
const finalsrc = Boolean(src) ? src : "/images/logo.png";
|
|
let testimonialarray = innerText.split("\n");
|
|
testimonialarray = testimonialarray.slice(0, testimonialarray.length - 1);
|
|
const testimonialdict = Object.assign({}, testimonialarray);
|
|
|
|
return (
|
|
<div className="rounded-sm ring-2 ring-alice-werefox-red-dark dark:ring-alice-werefox-red hover:ring-alice-werefox-blue-dark dark:hover:ring-alice-werefox-blue text-alice-werefox-red-dark dark:text-alice-werefox-red-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:animate-yip transition">
|
|
<Link href={url} target="_blank">
|
|
<div className="min-w-full flex overflow-hidden">
|
|
<div className="order-1 flex-1 flex-shrink-0 pt-4 pb-4 pl-4">
|
|
<span className="relative inline-block sm:w-32 w-16 sm:h-32 h-16">
|
|
<Image
|
|
className="rounded-sm"
|
|
src={finalsrc}
|
|
layout="fill"
|
|
objectFit="contain"
|
|
alt={alt}
|
|
/>
|
|
</span>
|
|
</div>
|
|
<div className="order-2 flex flex-5 p-4 items-center justify-center min-h-full">
|
|
<div className="animate-wiggle sm:text-lg text-xs text-center">
|
|
{Object.keys(testimonialdict).map((t) => (
|
|
<p className="overflow-auto" key={t}>
|
|
{testimonialdict[t] == "" ? <br /> : testimonialdict[t]}
|
|
</p>
|
|
))}
|
|
{`- @${user}`}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
</div>
|
|
);
|
|
}
|