Files
tenext-next/components/shared/ScrollDown.tsx
2026-06-18 16:32:31 +05:30

36 lines
941 B
TypeScript

import { ArrowIcon } from "./icons/ArrowIcon";
interface ScrollDownProps {
href?: string;
className?: string;
text?: string;
light?: boolean;
}
/**
* ScrollDown — interactive scroll indicator.
* Matches original Aiero 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-aiero-dark" : "bg-aiero-dark text-white"
} text-[14px] font-semibold no-underline transition-all hover:text-aiero-teal hover:shadow-scroll-btn`}
style={{ fontFamily: "var(--font-sora)" }}
>
{text}
<ArrowIcon className="h-3 w-3" />
</a>
</span>
);
}