Dropdown Group¶
About¶
This is an extension to sphinx-design dropdowns, intending to implement a
similar behavior like using CSS toggle-group
to group exclusive toggles.
If you have multiple dropdown elements, you can group them together, in order to make only one toggle from the group active at a time, effectively defining exclusive dropdowns.
This is similar to how HTML radio buttons behave, where two buttons cannot be checked at the same time.
Usage¶
In order define a group of multiple dropdown elements that should exclusively
open when toggled, wrap them into a container element using the dropdown-group
class.
::::{div} dropdown-group
:::{dropdown} Dropdown A
Dropdown content A
:::
:::{dropdown} Dropdown B
Dropdown content B
:::
::::
.. div:: dropdown-group
.. dropdown:: Dropdown A
Dropdown content A
.. dropdown:: Dropdown B
Dropdown content B
Example¶
Dropdown A
Dropdown content A
Dropdown B
Dropdown content B