Skip to content

Conversation

@choldgraf
Copy link
Member

@choldgraf choldgraf commented Feb 10, 2022

This adds toggle groups so that you can define subsets of toggle buttons based on a selector.
You can define them like so:

togglebutton_groups = {
  "grouponename": ".groupone-selector",
  "grouptwoname": ".grouptwo-selector"
}

This allows people to define subsets of groups that they want to open/close with distinct buttons.
For example, to create two buttons that toggle each group separately:

Toggle group one:

```{toggle-group} grouponename
```

Toggle group two:

```{toggle-group} grouptwoname
```

Toggle all groups:
```{toggle-group}
```

It also updates a bit of the usage documentation to be clearer.

This is meant to make it easier for us to add "toggle input / output" behavior to MyST-NB. We could do so by updating the togglebutton_groups config, like so:

app.config.togglebutton_groups.update({
  "cell-inputs": ".cell.tag_hide-input .cell_input",
  "cell-outputs": ".cell.tag_hide-output .cell_output",
}

and we could then create buttons that trigger each like so:

Toggle cell inputs:

```{toggle-group} cell-inputs
```

Toggle cell outputs:

```{toggle-group} cell-outputs
```

However, in practice I think we should build a header button / dropdown that controls this for us.

To do

  • Add a test
  • Do another pass through the javascript to make sure it works as expected
  • Fix reference examples

@choldgraf choldgraf changed the title Add button to toggle all elements Toggle groups of elements Feb 12, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants