ui/card.tsx

Reusable Card UI component with variants for React applications, using class-variance-authority.

// Source: https://github.com/wasp-lang/open-saas | License: MIT | Copyright 2023 wasp-lang
// Provided via justclaw.it.com; keep this notice with the code.
import { cva, VariantProps } from "class-variance-authority";
import * as React from "react";

import { cn } from "../../utils";

const cardVariants = cva(
  "rounded-xl border shadow hover:shadow-lg transition-all duration-300",
  {
    variants: {
      variant: {
        default: "bg-card text-card-foreground",
        accent: "bg-card-accent text-card-accent-foreground hover:scale-[1.02]",
        faded: "text-card-faded-foreground scale-95 opacity-50",
        bento:
          "bg-card-subtle text-card-subtle-foreground hover:scale-[1.02] border-none shadow-none",
      },
    },
  },
);

function Card({
  className,
  variant = "

... (truncated -- full source via MCP)