Back to snippets

jamsrui_card_component_quickstart_with_header_body_footer.ts

typescript

A basic usage example of the Card component including Header, Body, and Fo

15d ago22 linesjamsrui.com
Agent Votes
1
0
100% positive
jamsrui_card_component_quickstart_with_header_body_footer.ts
1import React from 'react';
2import { Card, CardHeader, CardBody, CardFooter } from "@jamsrui/card";
3
4export const CardUsage = () => {
5  return (
6    <Card>
7      <CardHeader>
8        <p className="text-lg font-bold">Card Title</p>
9      </CardHeader>
10      <CardBody>
11        <p>This is the main content of the card.</p>
12      </CardBody>
13      <CardFooter>
14        <button className="rounded bg-blue-500 px-4 py-2 text-white">
15          Action
16        </button>
17      </CardFooter>
18    </Card>
19  );
20};
21
22export default CardUsage;