automatically set the height of the tabs across the languages (#1157)

Author: titusfortner

website_and_docs/layouts/shortcodes/tabpane.html

@@ -30,7 +30,7 @@
 <!-- Scratchpad gets populated through call to .Inner -->
 {{- .Inner -}}
 
-<ul class="nav nav-tabs" id="tabs-{{- $.Ordinal -}}" role="tablist">
+<ul class="nav nav-tabs{{ if $persistLang }} persist{{ end }}" id="tabs-{{- $.Ordinal -}}" role="tablist">
   {{- range $index, $element := $.Scratch.Get "tabs" -}}
 
     {{- $lang := $langPane -}}
@@ -75,7 +75,7 @@
 {{ $activeSet = false }}
 
 <!-- Inner content -->
-<div class="tab-content" id="tabs-{{- $.Ordinal -}}-content">
+<div class="tab-content{{ if $persistLang }} persist{{ end }}" id="tabs-{{- $.Ordinal -}}-content">
   {{- range $index, $element := $.Scratch.Get "tabs" -}}
 
     {{- $lang := $langPane -}}

website_and_docs/static/js/tabpane-persist.js

@@ -1,4 +1,30 @@
 <!-- Upstream docsy commit — ecd4be87ea48e8e94684e32c925049e9bdf7f127-->
+var tabContents = document.querySelectorAll('.tab-content.persist');
+if (tabContents.length > 1) {
+    const persistTab = document.querySelector('ul.persist').querySelectorAll('.nav-link');
+    var heightMap = {};
+
+    // select each persist tab and store calculated heights
+    persistTab.forEach((langTab) => {
+        langTab.click();
+        tabContents.forEach((tabContent) => {
+            heightMap[tabContent.id] ||= [];
+            heightMap[tabContent.id].push(tabContent.clientHeight);
+        })
+        // everything ends up active unless classes removed
+        document.querySelectorAll('.active.show').forEach((activeTab) => {
+            activeTab.classList.remove('active');
+            activeTab.classList.remove('show');
+        })
+    })
+    // need to make something active/shown again
+    persistTab[0].click();
+
+    tabContents.forEach((tabContent) => {
+        tabContent.style.height = Math.max.apply(Math, heightMap[tabContent.id]).toString() + 'px';
+    })
+}
+
 if (typeof Storage !== 'undefined') {
     let activeLanguage = localStorage.getItem('active_language');