Merge branch 'development' into 310-write-content-for-how-to-run-acce…

…ss-om

docs/call_contribute.md

@@ -1,2 +1,2 @@
 ???+ warning "The documentation on Hive is work in progress!"
-    The ACCESS-Hive is a community resource that is a work in progress. We’d love to receive your contribution. Please see the [contributing guidelines](contribute/index.md) below for how to make contributions to the **Hive** page content. You can also [open an issue](https://github.com/ACCESS-Hive/access-hive.github.io/issues) highlighting any content you’d like us to provide but aren’t able to contribute yourself.
+    The ACCESS-Hive is a community resource that is a work in progress. We’d love to receive your contribution. Please see the [contributing guidelines](/contribute/index.md) below for how to make contributions to the **Hive** page content. You can also [open an issue](https://github.com/ACCESS-Hive/access-hive.github.io/issues) highlighting any content you’d like us to provide but aren’t able to contribute yourself.

docs/community_resources/community_med_recipes.md

@@ -360,4 +360,23 @@ IOMB uses the same code base as the International Land Model Benchmarking (ILAMB
 </td>
 </tr>
 
+
+<tr>
+<td width="25%">
+    <div align='center' width="100%">
+    <a href="https://cookbooks.projectpythia.org">Pythia Cookbooks {{ community }}</a>
+    </div>
+</td>
+<td width="10%">
+</td>
+<td width="64%">
+    <div align='center' width="100%" >
+        <a href="https://cookbooks.projectpythia.org">Documentation</a> |
+        <a href="https://github.com/ProjectPythia">Source </a>
+        <!-- The Afterburner project is a multi-year initiative of the UK Met Office to develop a suite of robust, reusable scientific software tools and applications which can be integrated into climate model runs to deliver commonly needed in-line (as a model is running) and post-processing functionality. The project is funded by the UK government through a combination of direct grant and the ​[Newton Fund](http://www.newtonfund.ac.uk). -->
+    </div>
+</td>
+</tr>
+
+
 <table/>

docs/community_resources/glossaries/index.md

@@ -7,10 +7,4 @@ Here you can find a compilation of common terms and acronyms used by the Austral
 
  [IPCC Acronyms](https://www.ipcc.ch/site/assets/uploads/sites/2/2022/06/SR15_AnnexI.pdf): Contains a comprehensive list of acronyms published in the scientific report SR15 of the Intergovernmental Panel on Climate Change (IPCC). The IPCC is the United Nations body for assessing the science related to climate change.
 
- [CSSR Acronyms and Units](https://science2017.globalchange.gov/chapter/appendix-d/): The Climate Science Special Report (CSSR) is an assessment of the science of climate change with particular focus on the United States.
-
- [CMIP(6)](#):  
-
- [ERA(5)](#):  
-
- [UM](#): 
+ [CSSR Acronyms and Units](https://science2017.globalchange.gov/chapter/appendix-d/): The Climate Science Special Report (CSSR) is an assessment of the science of climate change with particular focus on the United States.

docs/community_resources/index.md

@@ -7,7 +7,6 @@ In this area of the Hive, we collect content that is not currated by us, but may
 Currently, we provide pointers to the following categories:  
 - [Working Groups](community_working_groups.md)    
 - [Glossaries](./glossaries/index.md)  
-- [Variables](./glossaries/glossary_cmip.md)  
 - [Model Evaluation Links](community_model_catalogs)  
 - [Training](training/)  
 - [Events](./events/index.md)  

docs/css/access-nri.css

@@ -11,9 +11,9 @@
   --nri-dark-blue: #115D97;
   --nri-blue: #06AEEF;
   --nri-light-blue: #8ED7F8;
-  --default-fg-color: 255, 255, 255;  /* Color for main text in body, navigation, table of content*/
+  --default-fg-color: 230, 230, 230;  /* Color for main text in body, navigation, table of content*/
   --md-default-fg-color: rgb(var(--default-fg-color)); /* Main text in body, navigation, table of content*/ 
-  --md-default-fg-color--light: rgba(var(--default-fg-color),.65); /* Inactive tabs */
+  --md-default-fg-color--light: rgba(var(--default-fg-color),.7); /* Inactive tabs */
   --md-default-fg-color--lighter: rgba(var(--default-fg-color),.3); /* pencil for editing page, passed toc items text */
   --md-default-fg-color--lightest: rgba(var(--default-fg-color),.07);
   --default-bg-color: 46, 51, 62; /* Color for main background */
@@ -173,7 +173,7 @@ h3 {
 */
 .introduction {
   font-size: 1.2em;
-  padding: 1em;
+  padding: .7em;
   display: flex;
   align-items: center;
 }
@@ -397,11 +397,16 @@ h3 {
   display: flex;
   justify-content: center;
   align-items: center;
-  border: 1px solid var(--card-borders);
+  border: 1.3px solid var(--card-borders);
   border-radius: 15px;
   box-shadow: 6px 6px 10px var(--card-shadows);
 }
 
+.card-container > * > * {
+  flex-grow: 1;
+}
+
+
 /* Single card hover */
 .card-container > *:hover {
   border-color: var(--md-accent-fg-color);
@@ -414,21 +419,24 @@ h3 {
   flex-direction: column;
   max-width: 30%;
   aspect-ratio: 1;
-  flex-grow: 1;
 }
 
-.squared-card-image {
-  flex: 1;
+.squared-card-image-container {
+  height: 75%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0.6em 0.6em 0 0.6em;
   overflow: hidden;
-  border-radius: 15px 15px 0 0;
-  object-fit: cover;
+  border-radius: 8px;
 }
 
-.squared-card-image >img {
-  width: 80%
+.squared-card-image-container > img {
+  width: 100%;
+  height: 100%;
 }
 
-.squared-card-text {
+.squared-card-text-container {
   height: 25%;
   display: flex;
   flex-direction: column;
@@ -442,25 +450,32 @@ h3 {
   width: 100%;
   height: 10em;
   overflow: hidden;
+  align-items: stretch;
 }
 
-.rectangular-card-image {
-  height: 100%;
+.rectangular-card-image-container {
+  width: 35%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0.6em 0 0.6em 0.6em;
+  overflow: hidden;
+  border-radius: 8px;
 }
 
-.rectangular-card-image > img {
-  height: inherit;
+.rectangular-card-image-container > img {
+  height: 100%;
+  width: 100%;
 }
 
-.rectangular-card-text {
+.rectangular-card-text-container {
   padding: 0 1em;
   height: 100%;
   width: 65%;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
   align-items: center;
-  text-align: justify;
 }
 
 .configuration-card {
@@ -641,7 +656,7 @@ pre>code {
 /* With borders */
 .with-border {
   border-radius: 7px;
-  border: 1px solid var(--card-borders);
+  border: 1.3px solid var(--card-borders);
   box-sizing: border-box;
 }
 
@@ -652,4 +667,9 @@ pre>code {
 
 .bold {
   font-weight: 600 !important;
+}
+
+/* image cover */
+.img-cover {
+  object-fit: cover;
 }

docs/index.md

@@ -16,24 +16,34 @@
 ## Navigating ACCESS-Hive
 <div class="card-container">
     <a href="models" class="squared-card default-text-color">
-        <img src="assets/ACCESS-MODEL.png" alt="Models" class="squared-card-image"></img>
-        <div class="squared-card-text highlight-bg bg-color-like-tab bold">Models</div>
+        <div class="squared-card-image-container">
+            <img class="img-cover" src="assets/ACCESS-MODEL.png" alt="Models">
+        </div>
+        <div class="squared-card-text-container highlight-bg bg-color-like-tab bold">Models</div>
     </a>
     <a href="models/run-a-model" class="squared-card default-text-color">
-        <img src="assets/get_started_example.png" alt="Run a Model" class="squared-card-image"></img>
-        <div class="squared-card-text highlight-bg bg-color-like-tab bold">Run a Model</div>
+        <div class="squared-card-image-container">
+            <img class="img-cover" src="assets/get_started_example.png" alt="Run a Model">
+        </div>
+        <div class="squared-card-text-container highlight-bg bg-color-like-tab bold">Run a Model</div>
     </a>
     <a href="model_evaluation" class="squared-card default-text-color">
-        <img src="assets/resources_example.png" alt="Model Evaluation" class="squared-card-image"></img>
-        <div class="squared-card-text highlight-bg bg-color-like-tab bold">Model Evaluation</div>
+        <div class="squared-card-image-container">
+            <img class="img-cover" src="assets/resources_example.png" alt="Model Evaluation">
+        </div>
+        <div class="squared-card-text-container highlight-bg bg-color-like-tab bold">Model Evaluation</div>
     </a>
     <a href="community_resources" class="squared-card default-text-color">
-        <img src="assets/community-forum-homepage.png" alt="Community Resources" class="squared-card-image"></img>
-        <div class="squared-card-text highlight-bg bg-color-like-tab bold">Community Resources</div>
+        <div class="squared-card-image-container">
+            <img class="img-cover" src="assets/community-forum-homepage.png" alt="Community Resources">
+        </div>
+        <div class="squared-card-text-container highlight-bg bg-color-like-tab bold">Community Resources</div>
     </a>
     <a href="https://forum.access-hive.org.au" target="_blank" class="squared-card default-text-color">
-        <img src="assets/forum_screenshot.png" alt="Community Forum" class="squared-card-image"></img>
-        <div class="squared-card-text highlight-bg bg-color-like-tab bold">Community Forum</div>
+        <div class="squared-card-image-container">
+            <img class="img-cover" src="assets/forum_screenshot.png" alt="Community Forum">
+        </div>
+        <div class="squared-card-text-container highlight-bg bg-color-like-tab bold">Community Forum</div>
     </a>
 </div>
 
@@ -43,10 +53,10 @@
 ## Contribute to ACCESS-Hive [^1]
 <div class="card-container">
     <a href="contribute/" target="_blank" class="rectangular-card default-text-color">
-        <div class="rectangular-card-image">
+        <div class="rectangular-card-image-container">
             <img src="assets/how-to-contribute-img.jpg" class="cover"></img>
         </div>
-        <div class="rectangular-card-text">
+        <div class="rectangular-card-text-container">
             <span class="highlight-bg bg-color-like-tab bold">Contribute</span>
             <span class="">Join the ACCESS-Hive team and have your contributions onboard!</span>
         </div>

docs/js/miscellaneous.js

@@ -4,6 +4,7 @@ function sortTables() {
   tables.forEach(table => new Tablesort(table));
 }
 
+
 // Remove 'Made with Material for MkDocs' from copyright
 function removeMkDocs() {
   let copyright = document.querySelector(".md-copyright");
@@ -16,9 +17,31 @@ function removeMkDocs() {
   }
 }
 
+
+/*
+  Adjust the scrolling so that the paragraph's titles is not 
+  partially covered by the sticky banner when clicking on a toc link
+*/
+function adjustScrollingToId() {
+  let header = document.querySelector('header');
+  let links = document.querySelectorAll("a[href^='#'].md-nav__link");
+
+  const clickEvent = e => {
+      e.preventDefault();
+      window.scrollTo(0, document.querySelector(e.target.hash).offsetTop - header.offsetHeight);
+  }
+
+  links.forEach(link => {
+    link.addEventListener('click', clickEvent)
+  })
+}
+
+// Join all functions
 function main() {
   sortTables();
   removeMkDocs();
+  adjustScrollingToId();
 }
 
+// Run all functions
 window.onload = () => document$.subscribe(() => main());

docs/js/terminal_animation.js

@@ -579,8 +579,6 @@ class TerminalAnimation extends HTMLElement {
         let margin = `${parseInt(getComputedStyle(this.container).marginBottom) - 5}px` // Margin of the intersectionObserver computed as bottom margin - 5px (5px padding)
         let intersectionObserver = new IntersectionObserver(entries => {
             entries.forEach(entry => {
-                console.log(entry.intersectionRatio)
-                console.log(this.container.scrollTop)
                 intersectionFunction(entry)
             })
         },