# Containers

## Purpose

Cards, panels, dialogs, sheets and lists.

## Decisions

### Trackpad-style card

A card with a main body and, optionally, a full-width row attached to the top and/or the bottom, like the buttons on a trackpad:

- **Top row:** a 100% width list of tabs.
- **Bottom row:** a 100% width list of buttons.
- The rows butt directly up against the main body (no gap), so they follow the touching rule: square corners where they meet.
- The **outside corners use the card radius** (`r-4`, 16px) rather than the tab or button radius. Inner tab corners keep the tab design (8px).
- Tabs are equal width.