Design v2: Components

[Gladear]

Why?

Related to #239. Once the mock-ups are done, let's start extracting and implementing common components.

To do

• Anchor
  • PR: feat(v2): add <.anchor> component #244
• Alert
  • type = warning, error
  • chevron-right icon = with, without
  • PR: feat(v2): add <.alert> component #246
• Avatar
  • size = sm (32px), hero (128px)
  • PR: feat(v2): add <.avatar> component #247
• Breadcrumbs
  • size = xs (24px)
  • PR: feat(v2): add <.breadcrumbs> component #248
• Button
  • color = primary, secondary, ghost
  • icon = none (default), left, right
  • size = md (40px)
  • PR: feat: update <.button> core component #249
• Card
  • color = secondary, positive, negative, neutral
  • PR: feat: create <.card> core component #250
• Card button
  • color = primary, secondary (default)
  • PR: feat: create <.card> core component #250
• Card grid
  • PR: feat: create <.card> core component #250
• Divider
  • PR: feat: add <.divider> core component #257
• Icon
  • size = xs (24px)
  • PR: chore: drop support for old icons #251
• List
  • PR: feat: add <.list> core component and related #258
• Tile (e.g. a book in "Books" page)
  • color = primary, white (default)
  • PR: feat: add <.tile> core component #260
• Transfer tile (variant of "Tile" with background and text color)
  • left slot = icon, checkbox
  • PR: feat: add <.transfer_tile> transfer component #261
• Transfer accordion (variant of "Transfer tile" with details on click)
  • PR: feat: add <.transfer_details> transfers component #262
• Form
  • Checkbox
    • PR: feat: add <.checkbox> core component #263
  • Select input
    • PR: feat: add <.text_input> and <.select> core component #266
  • Text input
    • helper or error text
    • PR: feat: add <.text_input> and <.select> core component #266
  • Money input
• Typography
  • Title 1 (page title)
  • Title 2 (auth page title)
  • Label (bold text)
  • Paragraph (default text)
  • PR: feat: add typography components #259