When and how to use it
Use a Section expander to minimise the length of a long section in a page. This gives us the possibility to present more content if the user chooses to, without leaving the actual context.
Could be used for showing additional rows in a list instead of relying on a pagination.
If you want to hide a complete section, use an Accordion instead.
Make sure the component follow-up on a context (as oppose to being used stand-alone).
Note that the arrow is pointing in the direction the content is moving (up or down) and is animated when clicked on.
- Text: Default link (Dark blue 2), medium
- Hover: Dark blue 2
- Arrow: Dark blue 2
- Line: Grey 200 #E9E9E9