diff options
Diffstat (limited to 'examples/with-tailwind/packages/ui/src/Card.tsx')
| -rw-r--r-- | examples/with-tailwind/packages/ui/src/Card.tsx | 27 |
1 files changed, 27 insertions, 0 deletions
diff --git a/examples/with-tailwind/packages/ui/src/Card.tsx b/examples/with-tailwind/packages/ui/src/Card.tsx new file mode 100644 index 0000000..6083de2 --- /dev/null +++ b/examples/with-tailwind/packages/ui/src/Card.tsx @@ -0,0 +1,27 @@ +import * as React from "react"; + +export const Card = ({ + title, + cta, + href, +}: { + title: string; + cta: string; + href: string; +}) => { + return ( + <a + target="_blank" + rel="noopener noreferrer" + href={href} + className="ui-group ui-mt-4 ui-rounded-lg ui-border ui-border-transparent ui-overflow-hidden ui-bg-origin-border ui-bg-gradient-to-r ui-from-brandred ui-to-brandblue ui-text-[#6b7280]" + > + <div className="ui-p-4 ui-bg-zinc-900 ui-h-full"> + <p className="ui-inline-block ui-text-xl ui-text-white">{title}</p> + <div className="ui-text-xs ui-mt-4 group-hover:ui-underline"> + {cta} → + </div> + </div> + </a> + ); +}; |
