diff --git a/src/app/faqs/page.tsx b/src/app/faqs/page.tsx index 18d43ae..e3dbc0f 100644 --- a/src/app/faqs/page.tsx +++ b/src/app/faqs/page.tsx @@ -2,6 +2,7 @@ import { FiBookOpen, FiDollarSign, FiEdit, FiFileText, FiSend } from "react-icons/fi" import AccordionList from "@/components/accordion-list" +import CalloutItem from "@/components/callout-item" import TabsNavigation from "@/components/tabs" import { Tabs } from "@/components/tabs/tabs" import { TabsContent } from "@/components/tabs/tabs-content" @@ -96,6 +97,14 @@ export default function FAQsPage() { ))} +
+ +
) } diff --git a/src/components/callout-item/index.tsx b/src/components/callout-item/index.tsx new file mode 100644 index 0000000..4bf26e3 --- /dev/null +++ b/src/components/callout-item/index.tsx @@ -0,0 +1,28 @@ +"use client" + +import Link from "next/link" +import { FiArrowUpRight } from "react-icons/fi" +import { Button } from "@/components/ui/button" +import { Item, ItemActions, ItemContent, ItemInner, ItemTitle } from "@/components/ui/item" +import { cn } from "@/lib/utils" +import type { CalloutItemProps } from "./types" + +export default function CalloutItem({ title, href, buttonText, className }: CalloutItemProps) { + return ( + + + + {title} + + + + + + + ) +} diff --git a/src/components/callout-item/types.ts b/src/components/callout-item/types.ts new file mode 100644 index 0000000..e4d35f8 --- /dev/null +++ b/src/components/callout-item/types.ts @@ -0,0 +1,6 @@ +export type CalloutItemProps = { + title: string + href: string + buttonText: string + className?: string +} diff --git a/src/components/ui/item.tsx b/src/components/ui/item.tsx new file mode 100644 index 0000000..9ee61ab --- /dev/null +++ b/src/components/ui/item.tsx @@ -0,0 +1,37 @@ +import type * as React from "react" +import { Glass } from "@/components/glass" +import { cn } from "@/lib/utils" + +function Item({ className, ...props }: React.ComponentProps<"div">) { + return ( + + ) +} + +function ItemInner({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function ItemContent({ className, ...props }: React.ComponentProps<"div">) { + return
+} + +function ItemTitle({ className, ...props }: React.ComponentProps<"p">) { + return

+} + +function ItemActions({ className, ...props }: React.ComponentProps<"div">) { + return

+} + +export { Item, ItemInner, ItemContent, ItemTitle, ItemActions }