From ec20dcf3cdd339951ffefd16cb4acf1da3d5b996 Mon Sep 17 00:00:00 2001 From: titusfortner Date: Thu, 16 Nov 2023 21:03:24 -0600 Subject: [PATCH] keep height of all panes consistent --- static/js/tabpane-persist.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/static/js/tabpane-persist.js b/static/js/tabpane-persist.js index 2362130754..58f7754130 100644 --- a/static/js/tabpane-persist.js +++ b/static/js/tabpane-persist.js @@ -15,6 +15,28 @@ const _tdStoragePersistKey = (tabKey) => const _tdSupportsLocalStorage = () => typeof Storage !== 'undefined'; +function adjustTabContentHeights() { + const contentTabs = document.querySelectorAll('.tab-content'); + + // Loop through each tabpane + contentTabs.forEach(contentTab => { + let maxHeight = 0; + const tabPanes = contentTab.querySelectorAll('.tab-pane'); + + // Loop through each tab in the tabpanes list to find max + tabPanes.forEach(tab => { + tab.style.display = 'block'; + maxHeight = Math.max(maxHeight, tab.clientHeight); + tab.style.display = ''; + }); + + // Loop through each tab in the tabpanes list to set height + tabPanes.forEach(tab => { + tab.style.height = maxHeight + 'px'; + }); + }); +} + // Helpers function tdPersistKey(key, value) { @@ -93,6 +115,9 @@ function tdGetAndActivatePersistedTabs(tabs) { tdActivateTabsWithKey(key); }); + // Adjust tab content heights + adjustTabContentHeights(); + return key_ageList; }