Minor changes to animated terminal toggler

docs/getting_started/are.md

@@ -0,0 +1,24 @@
+# Australian Research Environment (ARE)
+
+<a href="https://are-auth.nci.org.au/" target="_blank">ARE</a> is a web-based graphical interface for performing your computational research, provided by <a href="https://nci.org.au/" target="_blank">NCI</a>.
+<br>
+ARE can give you access to NCI’s <i>Gadi</i> supercomputer and data collections.
+
+
+There are three main applications included in ARE: <a href="#vdi">Virtual Desktop (VDI)</a>, <a href="#jupyterlab">JupyterLab</a>, <a href="#gadi-terminal">Gadi Terminal</a>.
+
+<!-- Tab labels -->
+<div class="tabLabels" label="are-apps">
+    <button id="vdi">Virtual Desktop (VDI)</i></button>
+    <button id="jupyterlab"><i>JupyterLab</i></button>
+    <button id="gadi-terminal"><i>Gadi Terminal</i></button>
+</div>
+
+
+<br>
+<h6>References</h6>
+<ul class="references">
+    <li>
+        <a href = "https://opus.nci.org.au/display/Help/ARE+User+Guide" target="_blank">https://opus.nci.org.au/display/Help/ARE+User+Guide</a>
+    </li>
+</ul>

docs/js/miscellaneous.js

@@ -172,9 +172,12 @@ function toggleTerminalAnimations() {
     let onclick = state == 'active' ? 'disable' : 'enable';
     terminalAnimationsSwitch.setAttribute('title',`Terminal animations ${current}.\nClick to ${onclick} them.`);
     terminalAnimationsSwitch.setAttribute('id','terminalSwitch');
-    let h1 = document.querySelector('h1');
-    h1.parentElement.insertBefore(terminalAnimationsSwitch, h1);
-    terminalAnimationsSwitch.addEventListener('click', toggleState, false);
+    document.querySelectorAll('h1').forEach(h1 => {
+      let _switch = terminalAnimationsSwitch.cloneNode(true);
+      _switch.addEventListener('click', toggleState, false);
+      h1.parentElement.insertBefore(_switch, h1);
+    })
+    terminalAnimationsSwitch.remove();
   }
 }
 

docs/models/run-a-model/run-access-cm.md

@@ -4,8 +4,19 @@
     <button id="are">ARE / <i>Gadi workflow</i></button>
     <button id="accessdev"><i>accessdev workflow</i></button>
 </div>
+<!-- Tab content -->
+<div class="tabContents" label="workflow">
+    <!-- ARE/Gadi-->
+    <div>
+        <h1>Run {{ model }} from ARE / <i>Gadi</i></h1>
+    </div>
+    <!-- accessdev -->
+    <div>     
+        <h1>Run {{ model }} from <i>accessdev</i></h1>
+    </div>
+</div>
+<!-- End of tab content -->
 
-# Run {{ model }}
 <div class="note">
     The workflow to run ACCESS_CM is currently in transition from <i>accessdev</i> to ARE/<i>Gadi</i>.
     <br>