Table of Contents

About

collapse is a menubar component that will collapse its children on a smaller screen making them only visible by clicking on the sandwich icon.

Other component have collapsible behavior such as:

Syntax

All the element that are inside a collapse will be collapsed when the width of the page is lower than defined breakpoint on the menu bar.

<menubar breakpoint="md">
<collapse>
  .......... The element in the collapse container will collapse below the max screen width (breakpoint attribute) defined in the menubar
</collapse>
</menubar>

More… see the page ComboStrap UI - Menu bar

Example

Below is a menubar where all elements are collapsed because the screen is always greater than the xs breakpoint (extra-small screen).

<menubar breakpoint="xs">
<collapse>
<group>
[[#|Home]]
[[#|Features]]
[[#|Release]]
Line
</group>
</collapse>
</menubar>
  • Click on the sandwich icon to expand and see the elements.