mirror of
https://github.com/imfing/hextra.git
synced 2025-06-20 01:01:18 -04:00
feat: add tabs implementation
chore: use filename by default in sidebar
This commit is contained in:
20
assets/js/tabs.js
Normal file
20
assets/js/tabs.js
Normal file
@ -0,0 +1,20 @@
|
||||
document.querySelectorAll('.tabs-toggle').forEach(function (button) {
|
||||
button.addEventListener('click', function (e) {
|
||||
// set parent tabs to unselected
|
||||
const tabs = Array.from(e.target.parentElement.querySelectorAll('.tabs-toggle'));
|
||||
tabs.map(tab => tab.setAttribute('data-state', ''));
|
||||
|
||||
// set current tab to selected
|
||||
e.target.setAttribute('data-state', 'selected');
|
||||
|
||||
// set all panels to unselected
|
||||
const panelsContainer = e.target.parentElement.nextElementSibling;
|
||||
Array.from(panelsContainer.children).forEach(function (panel) {
|
||||
panel.setAttribute('data-state', '');
|
||||
});
|
||||
|
||||
const panelId = e.target.getAttribute('aria-controls');
|
||||
const panel = panelsContainer.querySelector(`#${panelId}`);
|
||||
panel.setAttribute('data-state', 'selected');
|
||||
});
|
||||
});
|
Reference in New Issue
Block a user