mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-05 13:17:23 +02:00
5ce85e5b5e
* Try to find a way to recognize the codeblock tabs, its title, and where it ends - I try using DOCUSAURUS_CODE_TABS to mark the start - Use TAB_TITLE to mark the title of the tab - END_TAB to mark the end of that tab - END_DOCUSAURUS_CODE_TABS to mark the end of the whole code blocks then parse using regex and render accordingly * Added on click hook * Added example on how to write it, how to use it, how it will look like can be reverted later * Fix css error * - Move addEventListener part to lib/static - Remove comments * Add documentation * Remove examples * Change syntax of the codetabs
24 lines
839 B
JavaScript
24 lines
839 B
JavaScript
// Turn off ESLint for this file because it's sent down to users as-is.
|
|
/* eslint-disable */
|
|
window.addEventListener('load', function() {
|
|
// add event listener for all tab
|
|
document.querySelectorAll('.nav-link').forEach(function(el) {
|
|
el.addEventListener('click', function(e) {
|
|
const groupId = e.target.getAttribute('data-group');
|
|
document
|
|
.querySelectorAll(`.nav-link[data-group=${groupId}]`)
|
|
.forEach(function(el) {
|
|
el.classList.remove('active');
|
|
});
|
|
document
|
|
.querySelectorAll(`.tab-pane[data-group=${groupId}]`)
|
|
.forEach(function(el) {
|
|
el.classList.remove('active');
|
|
});
|
|
e.target.classList.add('active');
|
|
document
|
|
.querySelector(`#${e.target.getAttribute('data-tab')}`)
|
|
.classList.add('active');
|
|
});
|
|
});
|
|
});
|