mirror of
https://github.com/empayre/fleet.git
synced 2024-11-06 17:05:18 +00:00
0f02fa012e
I notices we were reusing styles alot for the card like container UI so I created a reusable `Card` component The component is used like this: ```tsx // default card is white background <Card> <p>whatever JSX you want</p> </Card> <Card color="gray"> <p>whatever JSX you want</p> </Card> <Card color="yellow"> <p>whatever JSX you want</p> </Card> <Card color="purple"> <p>whatever JSX you want</p> </Card> ``` **white** ![image](https://github.com/fleetdm/fleet/assets/1153709/53ee43a7-982b-480b-8bcf-0c585e0e01b5) **gray** ![image](https://github.com/fleetdm/fleet/assets/1153709/5afa85df-d63f-4c5a-8f31-d7d6d9174862) **yellow** ![image](https://github.com/fleetdm/fleet/assets/1153709/334291d6-c5af-4caa-adcb-b28696a054d7) **purple** ![image](https://github.com/fleetdm/fleet/assets/1153709/0cc87478-f507-4c7f-9807-328e2384a8b1) - [x] Manual QA for all new/changed functionality
18 lines
298 B
TypeScript
18 lines
298 B
TypeScript
import { Meta, StoryObj } from "@storybook/react";
|
|
|
|
import Card from ".";
|
|
|
|
const meta: Meta<typeof Card> = {
|
|
component: Card,
|
|
title: "Components/Card",
|
|
args: {
|
|
children: "card content",
|
|
},
|
|
};
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof Card>;
|
|
|
|
export const Default: Story = {};
|