Share

To Work with Collapsible Sections (Markdown)

Enclose the content in a collapsible section and add a title section and a content section inside the collapsible section.

To create a collapsible section

  • Wrap the content a style helper with a ui-x-collapsible label
  • Title the section
  • Add content to the collapsible section

Markdown for the collapsible section above 

{{#style "ui-x-collapsible"}}
{{#style "ui-x-collapsible__title"}}To create a collapsible section{{/style}}
{{#style "ui-x-collapsible__content"}}
- Wrap the content a `style` helper with a `ui-x-collapsible` label
- Title the section
- Add content to the collapsible section
{{/style}}
{{/style}}

To title a collapsible section

Wrap the title in a style helper with a ui-x-collapsible__title label

Markdown for the collapsible section above

{{#style "ui-x-collapsible"}}
{{#style "ui-x-collapsible__title"}}To title a collapsible section{{/style}}
{{#style "ui-x-collapsible__content"}}
Wrap the title in a `style` helper with a `ui-x-collapsible__title` label
{{/style}}
{{/style}}

To add content to a collapsible section

Wrap the content in a style helper with a ui-x-collapsible__content label

Note: All manner of formatting and content can appear in the collapsible content section

Markdown for the collapsible section above 

{{#style "ui-x-collapsible"}}
{{#style "ui-x-collapsible__title"}}To add content to a collapsible section{{/style}}
{{#style "ui-x-collapsible__content"}}
Wrap the content in a `style` helper with a `ui-x-collapsible__content` label

Note: All manner of formatting and content can appear in the collapsible content section
{{/style}}
{{/style}}

To create a link to this section use the id anchor-to-collpasible-section

This is interesting as pertains to anchored links to this section.

The id is specified in the same ui-x-collapsible style string.

Markdown for the collapsible section above 

{{#style "ui-x-collapsible anchor-to-collpasible-section"}}
{{#style "ui-x-collapsible__title"}}To create a link to this section use the id "anchor-to-collpasible-section"{{/style}}
{{#style "ui-x-collapsible__content"}}
This is interesting as pertains to anchored links to this section.

The id is specified in the same ui-x-collapsible style string.
{{/style}}
{{/style}}

Was this information helpful?