35 lines
944 B
TypeScript
35 lines
944 B
TypeScript
import { ArrowIcon } from "./icons/ArrowIcon";
|
|
|
|
interface ScrollDownProps {
|
|
href?: string;
|
|
className?: string;
|
|
text?: string;
|
|
light?: boolean;
|
|
}
|
|
|
|
/**
|
|
* ScrollDown — interactive scroll indicator.
|
|
* Matches original tenext reference animation and styling.
|
|
*/
|
|
export function ScrollDown({
|
|
href = "#scroll-down",
|
|
className = "",
|
|
text = "Scroll down",
|
|
light = true,
|
|
}: ScrollDownProps) {
|
|
return (
|
|
<span className={`scroll-btn-decoration ${className}`}>
|
|
<a
|
|
href={href}
|
|
className={`inline-flex h-[78px] w-[190px] items-center justify-center gap-2 rounded-b-[25px] ${
|
|
light ? "bg-white text-tenext-dark" : "bg-tenext-dark text-white"
|
|
} text-[14px] font-semibold no-underline transition-all hover:text-tenext-teal hover:shadow-scroll-btn`}
|
|
style={{ fontFamily: "var(--font-sora)" }}
|
|
>
|
|
{text}
|
|
<ArrowIcon className="h-3 w-3" />
|
|
</a>
|
|
</span>
|
|
);
|
|
}
|