Closed astroDimitrios closed 5 months ago
To test the new tab and group-tab you will also need:
Thank you for this PR @astroDimitrios, and for the excellent description and documentation. I do see this feature being very useful, especially for our workshop setup pages (for example https://datacarpentry.org/ecology-workshop/setup-python-workshop.html), which are currently using the spoiler
callout class to hide different setup options. I know @froggleston responded in Slack to let you know we'll be taking a look at this in the next couple of weeks and wanted to also jump in to say I'm excited to dig in and test this new feature!
@astroDimitrios I'm curious! Could you give an example here of how this would be encoded in the source Markdown of an episode, please? Or share a link to documentation where I could learn more on my own?
@astroDimitrios I'm curious! Could you give an example here of how this would be encoded in the source Markdown of an episode, please? Or share a link to documentation where I could learn more on my own?
Hello! Apologies it seems I only added in the .md syntax in the corresponding sandpaper pull request: https://github.com/carpentries/sandpaper/pull/571
But basically:
::: tab
# gnu
1
# Intel
2
# Craaaay
This is some text before the code block.
```fortran
print *, 'WHAT is Cray today'
Text after
:::
or for a group tab:
::: group-tab
1
2
3
:::
::: group-tab
4
5
6
:::
Great, thank you for sharing @astroDimitrios. Sorry I did not think of going to check the other PRs! This looks very simple from an authoring perspective, which is encouraging.
Closes https://github.com/carpentries/varnish/issues/32.
This request adds in css styling and javascript for tab and group-tab panels.
The css currently styles the panels like this:
(with an outline on hover for non-active tabs which I forgot to screenshot)
The javascript makes the tabs navigable using a keyboard and syncs any group-tabs. The selected group-tab persists over the session. So say if you have group-tabs with names Linux, and Windows etc like below, and select Windows on one page the JS will:
I have made the decision to autoload tabs when clicked or navigated to using the keyboard arrows. Not sure if this was correct so happy to hear thoughts on this.
The JS was adapted from sphinx-tabs which is MIT license.