showcase include

_data/tiles.yml

@@ -1,12 +1,11 @@
-- title: "Production instance"
-  url: https://workflowhub.eu/
-- title: "Sandbox instance"
-  url: https://dev.workflowhub.eu/
-- title: "Source code"
-  url: https://github.com/seek4science/seek
-- title: "Documentation"
-  url: docs/
-- title: "Outreach and Publications"
-  url: project/outreach
-- title: "Roadmap"
-  url: project/roadmap
+landingpage:
+  - title: "Production instance"
+    url: https://workflowhub.eu/
+  - title: "Sandbox instance"
+    url: https://dev.workflowhub.eu/
+  - title: "Source code"
+    url: https://github.com/seek4science/seek
+  - title: "Documentation"
+    url: docs/
+  - title: "Outreach and Publications"
+    url: project/outreach

_includes/tiles-simple.html

@@ -1,8 +1,13 @@
 <div class="row row-cols-1 row-cols-md-2 row-cols-lg-{{ include.col | default: 2 }} gy-2 gx-4 my-4 navigation-tiles">
-    {%- for item in site.data.tiles %}
+    {%- if include.yaml %}
+    {%- assign tiles = site.data.tiles[include.target] %}
+    {% else %}
+    {%- assign tiles = page[include.target] %}
+    {%- endif %}
+    {%- for item in tiles %}
     {%- if item.title %}
     <div class="col d-grid">
-        <a role="button" class="btn btn-secondary text-light font-size-sm py-4 fs-3" href="{{ item.url | relative_url }}">{{item.title}}</a>
+        <a role="button" class="btn font-size-sm py-4 fs-3" href="{{ item.url | relative_url }}">{{item.title}}</a>
     </div>
     {%- endif %}
     {%- endfor %}

_sass/_custom_classes.scss

@@ -2,14 +2,6 @@
 /*-----From https://github.com/elixir-europe/infectious-diseases-toolkit/blob/main/_sass/_custom_classes.scss-----*/
 
 .navigation-tiles {
-    .card {
-        background-color: $light;
-        color: $dark;
-    }
-    .card:hover {
-        box-shadow: $box-shadow;
-        background-color: $primary;
-    }
 
     .card-body {
         h3 {

_sass/_custom_variables.scss

@@ -4,7 +4,8 @@ $topnav-title-color: $primary;
 $topnav-brand-height: 80px;
 
 /*-----Section navigation tiles-----*/
-$nav-card-bg: $primary;
+$nav-card-bg: $light;
 $nav-card-color: $dark;
 $nav-card-bg-hover: $primary;
 $nav-card-color-hover: $white;
+

index.md

@@ -5,6 +5,11 @@ permalink: /
 # There are special sidebar rules for the index page in layouts/default.html
 hide_sidebar: true
 sidebar: true
+
+test2:
+  - title: "Roadmap"
+    url: project/roadmap
+
 ---
 
 ## About
@@ -49,7 +54,7 @@ For any kind of questions, or suggestions on using WorkflowHub, feel free to joi
 
 ## Project resources
 
-{% include tiles-simple.html col = "2" %}
+{% include tiles-simple.html col = "2" yaml=true target="landingpage" %}
 
 * **Tutorial videos:** 
   * [Make your workflows findable and citable](https://www.youtube.com/watch?v=2kGKxaPuQN8) ([slides](https://doi.org/10.5281/zenodo.7787488))
@@ -58,6 +63,7 @@ For any kind of questions, or suggestions on using WorkflowHub, feel free to joi
 
 ## Get involved
 
+{% include tiles-simple.html col = "2" target="test2" %}
 
 ### Community