Card (1.x)

Web — React, from @krizaka/orazaka-design-system. The Orazaka mobile app takes the kit's tokens, not its components. Deprecated: kept for the apps that still use it, removed in its next major.

Why it exists above Krizaka UI

Kept so that the apps written against 1.x keep their look while they migrate: no markup of its own any more.

Built onCard

Installation

Install

npm install @krizaka/orazaka-design-system && npm install -D tailwindcss

Styles

@import "tailwindcss";
@import "@krizaka/orazaka-design-system/theme.css";

The package ships its TypeScript sources: add it to transpilePackages (with @krizaka/orazaka-shared and @krizaka/ui).

Import

import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from "@krizaka/orazaka-design-system";

Props

This module has no component props: see the import and the preview above.

Accessibility

• The primitive's: plain blocks; give a heading level to the title.

Best practices

• Migrate part by part: Card → Card.Root, CardContent → Card.Body padding="lg", CardTitle → Card.Title.

Related components

• Card · Krizaka UIThe composed chassis of every card: a media with overlays, a body with a title, a description, stats and a footer.

Generated from the code of @krizaka/orazaka-design-system 2.5.0: its meta.ts, its examples and its types.Edit this documentation on GitHub