@violetprotocol/nudge-components
Version:
Components for Nudge's websites and applications.
119 lines (118 loc) • 4.49 kB
JavaScript
import { jsx, jsxs } from "react/jsx-runtime";
import fullWhiteLogo from "../../assets/nudge-white-hand.png.esm.js";
import { clsx } from "clsx";
import { Typography } from "../../atoms/Typography/Typography.esm.js";
import { Button } from "../../atoms/Button/Button.esm.js";
import { ButtonVariant } from "../../atoms/Button/types.esm.js";
import { SocialIcon } from "../../atoms/SocialIcon/SocialIcon.esm.js";
import { SocialIconVariant } from "../../atoms/SocialIcon/types.esm.js";
const ScoreAppFooter = ({
links,
LinkComponent,
ImageComponent,
withCtaButton = false,
ctaText,
onCtaClick,
className
}) => {
return /* @__PURE__ */ jsx("footer", { className: `bg-neutral-950 ${clsx(className)}`, children: /* @__PURE__ */ jsxs("div", { className: "max-w-screen-xl mx-auto", children: [
/* @__PURE__ */ jsxs(
"div",
{
className: `flex justify-between mb-10 ${clsx({ "md:mb-16": withCtaButton })}`,
children: [
/* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
/* @__PURE__ */ jsx(
Typography,
{
variant: "p-subheading",
breakpointVariants: { sm: "h4" },
className: "mb-6 md:mb-10 text-neutral-0",
children: "Find your true value"
}
),
withCtaButton && ctaText && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, { onClick: onCtaClick, variant: ButtonVariant.DEFAULT, children: ctaText }) })
] }),
/* @__PURE__ */ jsx(
ImageComponent,
{
src: fullWhiteLogo,
alt: "Hand Image",
width: 80,
height: 104,
className: "w-[53px] h-[64px] md:w-[80px] md:h-[104px]"
}
)
]
}
),
/* @__PURE__ */ jsxs("div", { className: "flex justify-between flex-wrap mb-10 md:mb-16", children: [
/* @__PURE__ */ jsxs("div", { className: "max-w-sm mr-24", children: [
/* @__PURE__ */ jsx(
Typography,
{
variant: "p-leading",
className: "text-neutral-600 font-medium mb-4",
children: "Nudge"
}
),
/* @__PURE__ */ jsx(
Typography,
{
variant: "p-sm",
breakpointVariants: { md: "p" },
className: "text-neutral-800 mb-10",
children: "Programmable Nudges financialize every decision and redistribute value to users. In return, protocols receive a scalable customer acquisition funnel & retention mechanism."
}
)
] }),
/* @__PURE__ */ jsx("div", { className: "flex flex-col sm:items-start md:items-end", children: links.map(({ title, href }, index) => /* @__PURE__ */ jsx(
Typography,
{
variant: "p-sm",
className: `text-neutral-800 font-medium mb-5 ${index === 0 ? "mt-2" : ""}`,
children: /* @__PURE__ */ jsx(LinkComponent, { href, children: title })
},
title
)) })
] }),
/* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse md:flex-row justify-between md:items-end", children: [
/* @__PURE__ */ jsxs("div", { children: [
/* @__PURE__ */ jsx(
Typography,
{
variant: "p-leading",
className: "text-neutral-600 font-medium mb-4",
children: "Contact"
}
),
/* @__PURE__ */ jsxs("div", { className: "flex flex-nowrap mr-4", children: [
/* @__PURE__ */ jsx("a", { href: "https://x.com/nudgexyz", "aria-label": "x", target: "_blank", children: /* @__PURE__ */ jsx(SocialIcon, { variant: SocialIconVariant.X }) }),
/* @__PURE__ */ jsx(
"a",
{
href: "https://t.me/+WpBYXE_HIzY0ZmEx",
"aria-label": "Telegram",
target: "_blank",
className: "px-3",
children: /* @__PURE__ */ jsx(SocialIcon, { variant: SocialIconVariant.TELEGRAM })
}
)
] })
] }),
/* @__PURE__ */ jsx(
Typography,
{
variant: "p-sm",
breakpointVariants: { md: "p" },
className: "text-neutral-800 mb-10 md:mb-0",
children: "Copyright © 2024 Nudge. All rights reserved."
}
)
] })
] }) });
};
export {
ScoreAppFooter
};
//# sourceMappingURL=ScoreAppFooter.esm.js.map