Skip to main content
Search

Concertina block

What is a concertina block?

A concertina block allows the user to show or hide content depending on the need. It's commonly used for FAQs or nesting large amounts of tertiary content such as terms and conditions.

Concertina blocks can also be known as accordions or pods.

Related

View all blocks

Anatomy

Concertina block

concertina-block.svg

Specification

  • Container header (optional)
  • Title (required)
  • Text (required)
 

Usage guidelines

Do's

  • Concertinas can be a single item or collection of multiple items
  • Should be used to display FAQs

Dont's

  • Primary content should never be nested within a concertina block

Behaviour

  • The concertina title, icon and entire panel should collapse/expand when interacted with via the mouse/keyoard or other assitive device
  • If there are multiple concertinas on the page these can be configured to have one or many open at a time.