Toggle Button

The toggle button component is a special button that can be used to toggle between two states. The button is derived from the call button component and can be used in the same way.

Usage

The toggle button component search an element with the given reference and calls the function toggle. This is very helpful in combination with the collapse component.

<monster-collapse id="my-collapse">
  <monster-reload data-monster-url="./nav.html"></monster-reload>
</monster-collapse>

<monster-call-button data-monster-reference="#my-collapse">
    toggle
</monster-call-button>

Layout

The toggle control can be customized to your own needs. For this purpose, the control can be designed via CSS.

The different parts of the control can be designed using CSS. Since the internals of the component are in a shadow tree, access is via css pseudo-element parts.