Card
A raised surface: neutral, info, warning and error.
Neutral
A raised surface.
Info
The build runs on every push.
Warning
Two gates are slow.
Features
- Neutral, info, warning and error.
Use it for
- Grouping, callouts.
Installation
- Get runets.
git clone https://github.com/ziyam-khan/runets - Copy these files into your project, keeping their folders.
- Install what they use.
pnpm add react - Load the styles once. Bring your own base tokens, or use runets’ default theme.
import 'runets/styles/theme.css' import 'runets/styles/kit.css'
Usage
import { Card } from 'runets'
<Card tone="warning" title="Warning">Two gates are slow.</Card>API
| Prop | Type | What it does |
|---|---|---|
tone | string | Colour. |
title | string | Heading. |
Accessibility
- Warning and error cards are alerts.
Source
The code is in src/kit/surfaces.tsx in runets, MIT licensed.