add resources / "learn more" section

Author: simonsteiger

index.qmd

@@ -118,3 +118,59 @@ end
 :::
 
 [See all news →](news/)
+
+```{=html}
+<div class="section-start-space pb-3 fs-2 fw-bold">
+  Learn more
+</div>
+<div class="list grid quarto-listing-cols-3">
+  <a class="pseudolisting" href="https://discourse.julialang.org/c/domain/probprog/48">
+    <div class="card-title h5">
+      Discourse
+    </div>
+    <div class="card-text quarto-grid-item">
+      Get support from and discuss with other users.
+    </div>
+  </a>
+  <a class="pseudolisting" href="https://turinglang.org/docs/tutorials/docs-00-getting-started/">
+    <div class="card-title h5">
+      Documentation
+    </div>
+    <div class="card-text quarto-grid-item">
+      Familiarize yourself with the Turing.jl API.
+    </div>
+  </a>
+  <a class="pseudolisting" href="https://turinglang.org/docs/tutorials/00-introduction/">
+    <div class="card-title h5">
+      Official tutorials
+    </div>
+    <div class="card-text quarto-grid-item">
+      Learn to tackle specific problems with Turing.jl.
+    </div>
+  </a>
+  <a class="pseudolisting" href="resources/content/inofficial_tutorials.qmd">
+    <div class="card-title h5">
+      Inofficial tutorials
+    </div>
+    <div class="card-text quarto-grid-item">
+      A list of inofficial tutorials using Turing.jl.
+    </div>
+  </a>
+  <a class="pseudolisting" href="resources/content/talks.qmd">
+    <div class="card-title h5">
+      Talks
+    </div>
+    <div class="card-text quarto-grid-item">
+      A list of talks on the Turing.jl ecosystem.
+    </div>
+  </a>
+  <a class="pseudolisting" href="">
+    <div class="card-title h5">
+      Workshop
+    </div>
+    <div class="card-text quarto-grid-item">
+      Placeholder for Turing-Workshop repo link.
+    </div>
+  </a>
+</div>
+```

resources/content/inofficial_tutorials.qmd

@@ -0,0 +1,5 @@
+---
+title: Inofficial tutorials
+---
+
+TODO: Add a list of inofficial tutorials.

resources/content/talks.qmd

@@ -0,0 +1,5 @@
+---
+title: Talks
+---
+
+TODO: Add a list of inofficial talks.

theming/dark.scss

@@ -3,7 +3,7 @@
 // Bootswatch
 
 $theme: "cosmo" !default;
-@import "variables/greys";
+@import "variables/grays";
 @import "variables/colorsdark";
 @import "variables/borders";
 @import "variables/spacers";

theming/light.scss

@@ -1,6 +1,6 @@
 /*-- scss:defaults --*/
 
-@import "variables/greys";
+@import "variables/grays";
 @import "variables/colorslight";
 @import "variables/borders";
 @import "variables/spacers";

theming/rules/_hoverables-dark.scss

@@ -23,3 +23,9 @@ $hover-border: lighten($color-secondary, 5%);
         flex: 0 1 100%;
     }
 }
+
+.pseudolisting {
+    @extend .card;
+    @extend .quarto-grid-item;
+    text-decoration: none;
+}

theming/rules/_hoverables-light.scss

@@ -23,3 +23,9 @@ $hover-border: darken($color-secondary, 15%);
         flex: 0 1 100%;
     }
 }
+
+.pseudolisting {
+    @extend .card;
+    @extend .quarto-grid-item;
+    text-decoration: none;
+}

theming/rules/_layouts.scss

@@ -5,3 +5,7 @@
 .section-end-space {
     padding-bottom: $large-y-space;
 }
+
+.section-start-space {
+    padding-top: $large-y-space;
+}

theming/rules/_mixins.scss

@@ -1,8 +1,6 @@
 @mixin raw-card {
     border-radius: $border-radius-sm;
     padding: 1rem;
-    min-height: 120px !important;
-    //min-width: 300px !important;
 
     --bs-card-spacer-x: 0rem !important;
     --bs-card-spacer-y: 0rem !important;
@@ -22,6 +20,10 @@
         font-weight: 700;
     }
 
+    .card-text {
+        color: $text-muted !important;
+    }
+
     &:hover {
         background-color: $color-highlight !important;
         border-color: $hover-border !important;