ACCESS-NRI · atteggiani · Sep 3, 2023 · Aug 30, 2023 · Aug 30, 2023 · Aug 30, 2023
diff --git a/docs/assets/ACCESS_icon_case_studies.png b/docs/assets/ACCESS_icon_case_studies.png
diff --git a/docs/assets/ACCESS_icon_publications.png b/docs/assets/ACCESS_icon_publications.png
diff --git a/docs/assets/ACCESS_icon_training.png b/docs/assets/ACCESS_icon_training.png
diff --git a/docs/community_resources/access_workshop_2023/index.md b/docs/community_resources/access_workshop_2023/index.md
@@ -0,0 +1,41 @@
+# ACCESS Community Workshop 2023
+
+<div class="card-container workshop-page">
+    <a href="https://www.access-nri.org.au/access-training-day-program/" class="horizontal-card" target="_blank">
+        <div class="card-image-container">
+            <img src="/assets/ACCESS_icon_case_studies.png" class="img-contain"></img> 
+        </div>
+        <div class="card-text-container">
+            <span class="bold" >Training Day Program<br>(4 Sep)</span>
+        </div>
+    </a>
+    <a href="training_materials" class="horizontal-card">
+        <div class="card-image-container">
+            <img src="/assets/ACCESS_icon_training.png" class="img-contain"></img> 
+        </div>
+        <div class="card-text-container">
+            <span class="bold" >Training materials</span>
+        </div>
+    </a>
+</div>
+<br>
+<div class="card-container workshop-page">
+    <a href="https://www.access-nri.org.au/access-workshop-2023-program/" class="horizontal-card" target="_blank">
+        <div class="card-image-container">
+            <img src="/assets/ACCESS_icon_publications.png" class="img-contain"></img> 
+        </div>
+        <div class="card-text-container">
+            <span class="bold" >Main Workshop Program<br>(5-6 Sep)</span>
+        </div>
+    </a>
+    <a href="https://forum.access-hive.org.au/c/access-workshop-2023/61/none" class="horizontal-card" target="_blank">
+        <div class="card-image-container">
+            <img src="/assets/access_hive_forum_icon.png" class="img-contain" style="padding: 0;"></img> 
+        </div>
+        <div class="card-text-container">
+            <span class="bold" >Workshop Interactions and Posters</span>
+        </div>
+    </a>
+</div>
+
+To find out more information about the workshop, check the <a href="https://www.access-nri.org.au/access-community-workshop-2023/" target="_blank">ACCESS Community Workshop 2023 page</a> on the ACCESS-NRI website.
diff --git a/docs/community_resources/access_workshop_2023/training_materials.md b/docs/community_resources/access_workshop_2023/training_materials.md
@@ -0,0 +1,35 @@
+# ACCESS-NRI Training Day 4 September 2023
+
+## ACCESS Models
+1. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/access_rose_cylc/rose_cylc_example.md" target="_blank">Running ACCESS-CM2 from ARE/Gadi</a>
+2. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/access_rose_cylc/ex1_runlength.md" target="_blank">Changing a suite run length</a>
+3. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/access_rose_cylc/ex2_co2.md" target="_blank">Changing model physics options</a>
+4. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/access_rose_cylc/ex3_troubleshooting.md" target="_blank">Troubleshooting example</a>
+
+## ACCESS-NRI Intake Catalog
+1. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/intake/ARE_setup_guide.md" target="_blank">Getting set up on the ARE</a>
+2. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/intake/Intake_tutorial_p1.ipynb" target="_blank">Using the ACCESS-NRI Intake catalog</a>
+3. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/intake/Intake_tutorial_p2.ipynb" target="_blank">Indexing a new model run</a>
+
+## ILAMB
+1. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/ilamb/ILAMB_training.md" target="_blank">Working with ILAMB</a>
+
+## ESMValTool
+1. <a href="https://github.com/ACCESS-NRI/workshop-training-2023/blob/main/esmvaltool/ESMValTool_training_VDI.md" target="_blank">Working with ESMValTool</a>
+
+## Cloning the GitHub repository
+
+For the training on Intake, ILAMB and ESMValTool, you will need to clone <a href="https://github.com/ACCESS-NRI/workshop-training-2023" target="_blank">this Github repo</a> to <i>Gadi</i> as follows:
+
+1. Log in to <i>Gadi</i>
+   ```
+   ssh <your_nci_username>@gadi.nci.org.au
+   ```
+   If you don't have an <code>ssh</code> connection setup for <i>Gadi</i>, you can use ARE's <a href="https://are.nci.org.au/pun/sys/shell/ssh/gadi.nci.org.au" target="_blank">Gadi Terminal</a>.
+
+2. Clone <a href="https://github.com/ACCESS-NRI/workshop-training-2023" target="_blank">this Github repo</a> to your user directory within `/scratch/nf33` on <i>Gadi</i>. Depending on whether or not you've used the nf33 project before, your user directory may or may not already exist.
+   ```
+   mkdir -p /scratch/nf33/$USER
+   cd /scratch/nf33/$USER
+   git clone https://github.com/ACCESS-NRI/workshop-training-2023.git
+   ```
diff --git a/docs/community_resources/index.md b/docs/community_resources/index.md
@@ -1,6 +1,14 @@
 # Community Resources
 
 <div class="card-container">
+    <!-- TEMPORARY for Workshop -->
+    <a href="access_workshop_2023" class="vertical-card aspect-ratio1to1">
+        <div class="card-image-container">
+            <img class="img-contain white-background" src="/assets/ACCESS_logo_rgb.png" alt="ACCESS Workshop 2023">
+        </div>
+        <div class="card-text-container   bold">ACCESS Community Workshop 2023</div>
+    </a>
+    <!-- TEMPORARY for Workshop -->
     <a href="https://forum.access-hive.org.au/" class="vertical-card aspect-ratio1to1" target="_blank">
         <div class="card-image-container">
             <img class="img-contain white-background" src="/assets/access_hive_forum_icon.png" alt="ACCESS-Hive Forum">

diff --git a/docs/css/access-nri.css b/docs/css/access-nri.css
@@ -1052,7 +1052,6 @@ img.intro-img {
 }
 
 
-
 /* =============================================================== 
   Media queries for website responsiveness
 */
@@ -1088,7 +1087,7 @@ img.intro-img {
     height: 11rem;
   }
 }
-@media screen and (width <= 550px) {
+@media screen and (width <= 600px) {
   .vertical-card {
     width: 40%;
   }
@@ -1177,144 +1176,91 @@ img.intro-img {
   }
 }
 
-/* =============================================================== 
-  Media queries for website responsiveness
-*/
-
-@media screen and (width < 800px) {
-  /* Make gap scale with viewport width */
-  .homepage-buttons {
-    gap: 5vw;
-  }
-  /* Hide upper text in homepage buttons */
-  .homepage-buttons > .vertical-card > :first-child {
+@media screen and (width > 400px) {
+  /* Hide logo in title */
+  .md-header__img {
     display: none;
   }
-  /* Lower text in homepage buttons */
-  .homepage-buttons > .vertical-card > :last-child {
-    font-size: calc(2.9vw + 0.15rem);
-  }
-  /* Homepage buttons Cards */
-  .homepage-buttons > .vertical-card {
-    background-color: var(--md-primary-fg-color--dark);
-    height: 8vw;
-    border-radius: 2vw;
+}
+
+@media screen and (width <= 400px) {
+  /* Show logo in title */
+  .md-header__title {
+    display: none;
   }
-  .homepage-buttons .card-text-container {
-    padding: 0;
+  /* Hide text in title */
+  .md-header__img {
+    display: flex;
   }
 }
 
 
-@media screen and (width <= 608px) {
-  /* Footer */
-  .md-footer-meta.md-typeset.md-grid {
-    height: 11rem;
+/* =============================================================== 
+  TEMPORARY for workshop
+*/
+
+/* Homepage button */
+.card-container.homepage-buttons.workshop {
+  max-width: 60%;
+  margin: 1.5rem auto;
+}
+.card-container.homepage-buttons.workshop > .horizontal-card {
+  max-height: 5rem;
+}
+.card-container.homepage-buttons.workshop .card-text-container {
+  height: 100%;
+  padding: 0.4rem 0.4rem 0.4rem 0;
+}
+.card-container.homepage-buttons.workshop .card-text-container > span {
+  background-color: var(--nri-orange);
+  color: rgb(10,10,10);
+}
+
+/* Workshop page */
+.card-container.workshop-page {
+  justify-content: space-around;
+}
+
+/* Training materials page */
+.workshop-training {
+  display: flex;
+  flex-direction: column;
+  gap: 0.6rem;
+}
+.workshop-training > * {
+  width: fit-content;
+}
+
+@media screen and (width > 550px) {
+  .card-container.workshop-page > .horizontal-card {
+    max-width: 40%;
+    max-height: 5rem;
   }
 }
-@media screen and (width <= 600px) {
-  .vertical-card {
-    width: 40%;
+@media screen and (width < 800px) {
+  .card-container.homepage-buttons.workshop > .horizontal-card > :first-child {
+    display: none;
   }
-
-  /* Change the horizontal card to be rendered as a vertical one with aspect-ratio 1 */
-  .horizontal-card {
-    flex-direction: column;
-    height: auto;
-    align-items: center;
-    width: 40%;
+  .card-container.homepage-buttons.workshop .card-text-container {
+    flex-basis: 100%;
+    padding: 0;
+  }
+}
+@media screen and (width <= 550px) {
+  .homepage-buttons.workshop > .horizontal-card {
+    flex-direction: row;
+    height: 15vw;
+    width: 100%;
+    align-items: stretch;
     min-height: 0;
-    aspect-ratio: 1;
+    aspect-ratio: unset;
     container-type: inline-size;
   }
-  .horizontal-card > .card-text-container {
-    height: 30%;
-    flex: 0 0 auto;
+  .homepage-buttons.workshop > .horizontal-card > .card-text-container {
     font-size: 10cqi;
     font-weight: 600;
-    padding: 3.5%;
   }
-  .horizontal-card > .card-image-container {
-    padding: 3.5%;
-  }
-  .horizontal-card > .card-text-container:last-child {
-    padding-top: 0;
-  }
-  .horizontal-card > .card-text-container > *:last-child:not(:only-child) {
-    display: none;
-  }
-  .horizontal-card > .card-text-container > *:first-child:not(:only-child) {
-    margin-bottom: 0;
-  }
-  .horizontal-card > .card-image-container {
-    flex-basis: 70%;
-  }
-  /* Wrap homepage navigation cards */
-  .homepage-navigation {
-    flex-wrap: wrap;
-  }
-
-  /* Forum, ACCESS-NRI and Github buttons */
-  .header-btn-container {
-    flex-grow: 0;
-  }
-  /* Make squared btn */
-  .header-btn {
-    flex-basis: 0;
-    flex-grow: 0;
-    aspect-ratio: 1;
-    justify-self: start;
-    height: 2rem;
-  }
-  /* Increase btn Logos */
-  .header-btn > :first-child > * {
-    font-size: 1.8em;
-  }
-  /* Hide btn Text */
-  .header-btn >:last-child {
-    display: none;
-  }
-
-  /* Homepage introduction paragraph */
-  /* Upper text */
-  .introduction > :first-child > :first-child {
-    font-size: calc(4.9vw + 0.15rem);
-  }
-  /* Lower text */
-  .introduction > :first-child > :last-child {
-    font-size: calc(2.9vw + 0.15rem);
-   }
-
-  /* Footer */
-  :is(.funding,.partners) > *:first-child {
-    font-size: calc(1vw + 0.5rem);
-  }
-  :is(.funding,.partners) > *:last-child a {
-    max-width: calc(6vw + 2rem);
-  }
-
-  .md-footer-meta__inner {
-    flex-direction: column;
-  }
-  .md-footer-meta__inner > * {
-    gap: 1rem;
-  }
-}
-
-@media screen and (width > 400px) {
-  /* Hide logo in title */
-  .md-header__img {
-    display: none;
+  .card-container.workshop-page img {
+    padding: 0.4rem;
   }
 }
-
-@media screen and (width <= 400px) {
-  /* Show logo in title */
-  .md-header__title {
-    display: none;
-  }
-  /* Hide text in title */
-  .md-header__img {
-    display: flex;
-  }
-}
diff --git a/docs/index.md b/docs/index.md
@@ -14,6 +14,20 @@ hide:
     </div>
 </div>
 
+<!-- TEMPORARY for workshop -->
+<div class="card-container homepage-buttons workshop">
+    <a href="/community_resources/access_workshop_2023" class="horizontal-card">
+        <div class="card-image-container">
+            <img src="/assets/ACCESS_logo_rgb.png" class="white-background img-contain"></img>
+        </div>
+        <div class="card-text-container">
+            <span class="bold">
+                ACCESS Community Workshop 2023</span>
+        </div>
+    </a>
+</div>
+<!-- TEMPORARY for workshop -->
+
 <div class="card-container homepage-buttons">
     <a href="/getting_started" class="vertical-card">
         <div class="bold">New to ACCESS-Hive?</div>

diff --git a/mkdocs.yml b/mkdocs.yml
@@ -152,6 +152,11 @@ nav:
 
   - Community Resources:
     - community_resources/index.md
+    # TEMPORARY for Workshop
+    - ACCESS Community Workshop 2023: 
+      - Overwview: community_resources/access_workshop_2023/index.md
+      - Training materials: community_resources/access_workshop_2023/training_materials.md
+    # TEMPORARY for Workshop
     - Working Groups: community_resources/community_working_groups.md
     - Model Evaluation Links:
       - community_resources/community_med/index.md