Accordion
An accordion lets users show and hide sections of related content.
import { ... } from '@ag.ds-next/react/accordion';For general guidance on content, go to the TFTM content patterns.
Style
For general guidance on content, go to:
- Content styles
- Content patterns.
- Australian Government Style Manual
- How to create guidance in the Export Service.
For DAFF staff, please refer to the internal departmental style guide.
There are slight variations between these guides. If guidance differs, follow the DAFF style guide first or the next in order down this list.
Length and structure
Title
Use unique, accurate headings to describe panel content.
Use up to 150 characters.
Panel
Use short paragraphs or bullet lists and don’t use sub-headings.
Longer content may cause a scroll bar to appear and provide a bad user experience.
Make sure all panel content other than body text is accessible. For example, alt-text on images, column and table labels.
Use up to 250 characters.
Language
Refer to the glossary for general information on language.
Voice and tone
Go to the TFTM Voice and tone guide for guidance.