Accordion - Web Component

...

Browser support

Parameters

The Web component uses a <z-accordion> tag.

The parametrization of the component can be done with the following custom HTML params:

Name	Type	Description
config	string	Sets the size of the accordion item. Default is m. You can also set it as l.
summary	string	The title of the accordion item
content	string	The content of the accordion item

Playground

Customization

HTML Examples

Imports

<link rel="stylesheet" href="/0.3.7/@zurich/web-components/styles.css" />
<script type="module" src="/0.3.7/@zurich/web-components/accordion.js"></script>

Code

<z-accordion summary="Accordion item" size="l">
  Body text lorem ipsum dolor sit amet, consectetur adipiscing elit,
  sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</z-accordion>