elixir-toolkit-theme 5.0.0 → 6.0.0

data/_includes/more-information-tiles.html

@@ -63,7 +63,7 @@
 {%- if actual_fairsharing %}
 <!-- FAIRsharing -->
 <a data-bs-toggle="collapse" href="#fairsharing_collapse" role="button" aria-expanded="false" aria-controls="fairsharing_collapse" class="d-flex align-items-baseline pb-3 border-top info-collapse">
-    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to FAIRsharing</h3><i class="fa-solid fa-chevron-down fs-5"></i>
+    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to FAIRsharing</h3><i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="fairsharing_collapse">
     <div class="mt-2 p-3 pb-5">
@@ -85,7 +85,7 @@
 {%- if actual_faircookbook %}
 <!-- FAIR Cookbook -->
 <a data-bs-toggle="collapse" href="#faircookbook_collapse" role="button" aria-expanded="false" aria-controls="faircookbook_collapse" class="d-flex align-items-baseline pb-3 border-top info-collapse">
-    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to FAIR Cookbook</h3><i class="fa-solid fa-chevron-down fs-5"></i>
+    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to FAIR Cookbook</h3><i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="faircookbook_collapse">
     <div class="mt-2 p-3 pb-5">
@@ -107,7 +107,7 @@
 {%- if actual_dsw %}
 <!-- DSW -->
 <a data-bs-toggle="collapse" href="#dsw_collapse" role="button" aria-expanded="false" aria-controls="dsw_collapse" class="d-flex align-items-baseline pb-3 border-top info-collapse">
-    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to DSW</h3><i class="fa-solid fa-chevron-down fs-5"></i>
+    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to DSW</h3><i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="dsw_collapse">
     <div class="mt-2 p-3 pb-5">
@@ -129,7 +129,7 @@
 {%- if actual_rdmkit %}
 <!-- RDMkit -->
 <a data-bs-toggle="collapse" href="#rdmkit_collapse" role="button" aria-expanded="false" aria-controls="rdmkit_collapse" class="d-flex align-items-baseline pb-3 border-top info-collapse">
-    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to RDMkit</h3><i class="fa-solid fa-chevron-down fs-5"></i>
+    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Links to RDMkit</h3><i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="rdmkit_collapse">
     <div class="mt-2 p-3 pb-5">
@@ -152,7 +152,7 @@
 {%- if actual_training %}
 <!-- Training -->
 <a data-bs-toggle="collapse" href="#training_collapse" role="button" aria-expanded="false" aria-controls="training_collapse" class="d-flex align-items-baseline pb-3 border-top info-collapse">
-    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Training</h3><i class="fa-solid fa-chevron-down fs-5"></i>
+    <h3 class="mb-0 flex-grow-1 mt-3 text-dark">Training</h3><i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="training_collapse">
     <div class="mt-2 p-3 pb-5">

data/_includes/page-metadata-tabs.html

@@ -0,0 +1,92 @@
+{%- comment -%} Check if any tab has actual content (not empty arrays) {%- endcomment -%}
+{%- assign has_contributors = false -%}
+{%- assign has_coordinators = false -%}
+{%- assign has_editors = false -%}
+{%- assign has_affiliations = false -%}
+{%- assign has_citations = false -%}
+
+{%- if page.contributors and page.contributors.size > 0 -%}{%- assign has_contributors = true -%}{%- endif -%}
+{%- if page.coordinators and page.coordinators.size > 0 -%}{%- assign has_coordinators = true -%}{%- endif -%}
+{%- if page.editors and page.editors.size > 0 -%}{%- assign has_editors = true -%}{%- endif -%}
+{%- if page.affiliations and page.affiliations.size > 0 -%}{%- assign has_affiliations = true -%}{%- endif -%}
+{%- if page.page_citation -%}{%- assign has_citations = true -%}{%- endif -%}
+
+{% if has_contributors or has_coordinators or has_editors or has_affiliations or has_citations %}
+
+{%- comment -%} Determine which tab should be active by default {%- endcomment -%}
+{%- assign first_tab = nil -%}
+{%- unless first_tab -%}{%- if has_contributors -%}{%- assign first_tab = "contributors" -%}{%- endif -%}{%- endunless -%}
+{%- unless first_tab -%}{%- if has_coordinators -%}{%- assign first_tab = "coordinators" -%}{%- endif -%}{%- endunless -%}
+{%- unless first_tab -%}{%- if has_editors -%}{%- assign first_tab = "editors" -%}{%- endif -%}{%- endunless -%}
+{%- unless first_tab -%}{%- if has_affiliations -%}{%- assign first_tab = "affiliations" -%}{%- endif -%}{%- endunless -%}
+{%- unless first_tab -%}{%- if has_citations -%}{%- assign first_tab = "citations" -%}{%- endif -%}{%- endunless -%}
+
+<div class="page-metadata p-4 mt-5 rounded">
+    <nav>
+        <div class="nav nav-tabs mb-3" id="nav-credits" role="tablist">
+            {%- if has_contributors %}
+            <button class="nav-link {% if first_tab == 'contributors' %}active{% endif %}" id="credits-contributors-tab" data-bs-toggle="tab" data-bs-target="#credits-contributors" type="button" role="tab" aria-controls="credits-contributors" aria-selected="{% if first_tab == 'contributors' %}true{% else %}false{% endif %}">
+                <i class="fa-solid fa-users me-2"></i>
+                Contributors
+            </button>
+            {%- endif %}
+            {%- if has_coordinators %}
+            <button class="nav-link {% if first_tab == 'coordinators' %}active{% endif %}" id="credits-coordinators-tab" data-bs-toggle="tab" data-bs-target="#credits-coordinators" type="button" role="tab" aria-controls="credits-coordinators" aria-selected="{% if first_tab == 'coordinators' %}true{% else %}false{% endif %}">
+                <i class="fa-solid fa-crown me-2"></i>
+                Coordinators
+            </button>
+            {%- endif %}
+            {%- if has_editors %}
+            <button class="nav-link {% if first_tab == 'editors' %}active{% endif %}" id="credits-editors-tab" data-bs-toggle="tab" data-bs-target="#credits-editors" type="button" role="tab" aria-controls="credits-editors" aria-selected="{% if first_tab == 'editors' %}true{% else %}false{% endif %}">
+                <i class="fa-solid fa-comment-dots me-2"></i>
+                Editors
+            </button>
+            {% endif %}
+            {%- if has_affiliations %}
+            <button class="nav-link {% if first_tab == 'affiliations' %}active{% endif %}" id="credits-affiliations-tab" data-bs-toggle="tab" data-bs-target="#credits-affiliations" type="button" role="tab" aria-controls="credits-affiliations" aria-selected="{% if first_tab == 'affiliations' %}true{% else %}false{% endif %}">
+                <i class="fa-solid fa-building-columns me-2"></i>
+                Affiliations
+            </button>
+            {%- endif %}
+            {%- if has_citations %}
+            <button class="nav-link {% if first_tab == 'citations' %}active{% endif %}" id="credits-cite-tab" data-bs-toggle="tab" data-bs-target="#credits-citations" type="button" role="tab" aria-controls="credits-cite" aria-selected="{% if first_tab == 'citations' %}true{% else %}false{% endif %}">
+                <i class="fa-solid fa-quote-left me-2"></i>
+                Citation
+            </button>
+            {%- endif %}
+        </div>
+    </nav>
+
+    <div class="tab-content" id="nav-creditsContent">
+        {%- if has_contributors %}
+        <div class="tab-pane {% if first_tab == 'contributors' %}show active{% endif %}" id="credits-contributors" role="tabpanel">
+            {% include contributor-minitiles-page.html contributors_list=page.contributors sort=site.theme_variables.page_metadata.contributors_sort %}
+        </div>
+        {%- endif %}
+        {%- if has_coordinators %}
+        <div class="tab-pane {% if first_tab == 'coordinators' %}show active{% endif %}" id="credits-coordinators" role="tabpanel">
+            <div class="coordinators">
+                {% include contributor-minitiles-page.html contributors_list=page.coordinators sort=site.theme_variables.page_metadata.coordinators_sort %}
+            </div>
+        </div>
+        {%- endif %}
+        {%- if has_editors %}
+        <div class="tab-pane {% if first_tab == 'editors' %}show active{% endif %}" id="credits-editors" role="tabpanel">
+            <div class="editors">
+                {% include contributor-minitiles-page.html contributors_list=page.editors sort=site.theme_variables.page_metadata.editors_sort %}
+            </div>
+        </div>
+        {%- endif %}
+        {%- if has_affiliations %}
+        <div class="tab-pane {% if first_tab == 'affiliations' %}show active{% endif %}" id="credits-affiliations" role="tabpanel">
+            {% include affiliation-tiles-page.html affiliations_list=page.affiliations sort=site.theme_variables.page_metadata.affiliations_sort %}
+        </div>
+        {%- endif %}
+        {%- if has_citations %}
+        <div class="tab-pane {% if first_tab == 'citations' %}show active{% endif %}" id="credits-citations" role="tabpanel">
+            {% include citation-page.html contributors_list=page.contributors sort=site.theme_variables.page_metadata.contributors_sort %}
+        </div>
+        {%- endif %}
+    </div>
+</div>
+{% endif %}

data/_includes/resource-table-all.html

@@ -26,7 +26,7 @@
 {%- endif %}
 {% if site.theme_variables.headings.resource-table-all-collapse %}<h3 class="mb-0 mt-3 flex-grow-1 text-dark">{% else %}<h2 class="h2-like fs-2">{% endif %}{{site.theme_variables.headings.resource-table-all | default: 'Tools and resources on this page' }}{% if site.theme_variables.headings.resource-table-all-collapse %}</h3>{% else % %}</h2>{% endif %}
 {%- if site.theme_variables.headings.resource-table-all-collapse %}
-    <i class="fa-solid fa-chevron-down fs-5"></i>
+    <i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="tools_collapse">
 {%- endif %}
@@ -57,21 +57,14 @@
         <tbody>
             {%- for tool in tools %}
             <tr>
-                {%- assign instances_tool = 0 %}
-                {%- assign query = "related_pages." | append: page.type %}
-                {%- for country_page in country_pages %}
-                {%- assign instance_matches = country_page.national_resources | where: "instance_of", tool.id | where_exp:"resource","resource.related_pages != nil" | where: query, include.tag %}
-                {%- unless instance_matches.size == 0 %}
-                {%- assign instances_tool = instances_tool | plus: instance_matches.size %}
-                {%- endunless %}
-                {%- endfor %}
+                {%- assign instances_tool = tool.instances | size %}
                 {% if tool.url %}
                 <td><a href="{{tool.url}}">{{tool.name}}</a></td>
                 {%- else %}
                 <td>{{tool.name}}</td>
                 {%- endif %}
                 <td>{{tool.description}}
-                    {%- if tool.instance_of or tool.how_to_access or instances_tool != 0 != 0 and include.tag != nil %}
+                    {%- if tool.instance_of or tool.how_to_access or instances_tool != 0 %}
                     {%- assign linked_tool = site.data.tool_and_resource_list | where:"id", tool.instance_of | first %}
                     <div class="d-block mt-1">
                         {%- if linked_tool %}
@@ -80,11 +73,30 @@
                         {%- if tool.how_to_access %}
                         <span class="d-inline-block" tabindex="0" data-bs-toggle="tooltip" title="{{tool.how_to_access}}"><span class="badge text-primary border border-primary"> <i class="fa-solid fa-key"></i></span></span>
                         {%- endif %}
-                        {%- unless instances_tool == 0 or include.tag == nil %}
-                        <!-- <a href="#national-resources-button">
-                        <span class="badge text-white bg-primary"><i class="fa-solid fa-arrow-circle-down me-2"></i>Different instances available</span>
-                    </a> -->
-                        {%- endunless %}
+                        {%- if instances_tool > 0 %}
+                        {%- assign dropdown_id = 'instances-dd-' | append: forloop.index0 %}
+                        <div class="dropdown d-inline-block">
+                            <button class="btn btn-badge btn-outline-primary dropdown-toggle"
+                                    type="button"
+                                    id="{{ dropdown_id }}"
+                                    data-bs-toggle="dropdown"
+                                    aria-expanded="false">
+                            <i class="fa-solid fa-globe me-2"></i>Instances
+                            </button>
+                            <ul class="dropdown-menu" aria-labelledby="{{ dropdown_id }}">
+                            {%- for inst in tool.instances %}
+                                <li>
+                                    <a class="dropdown-item no-ext-icon" href="{{ inst.url }}">
+                                        {{ inst.name }}
+                                        {%- if inst.country_code.size != 0 %}
+                                            <span class="flag-icon ms-2 shadow-sm flag-icon-{{ inst.country_code | downcase }}"></span>
+                                        {%- endif %}
+                                    </a>
+                                </li>
+                            {%- endfor %}
+                            </ul>
+                        </div>
+                        {%- endif %}
                     </div>
                     {%- endif %}
                 </td>
@@ -137,7 +149,7 @@
 {%- endif %}
     <h3 class="{% if site.theme_variables.headings.resource-table-all-collapse %}mb-0 mt-3 flex-grow-1 text-dark {% endif %}">National resources</h3>
 {%- if site.theme_variables.headings.resource-table-all-collapse %}
-    <i class="fa-solid fa-chevron-down fs-5"></i>
+    <i class="fa-solid fa-chevron-right fs-5"></i>
 </a>
 <div class="collapse info-card" id="nat_tools_collapse">
 {%- endif %}

data/_includes/scroll-top.html

@@ -1,5 +1,5 @@
 {%- if site.theme_variables.back_to_top or site.theme_variables.back_to_top == nil %}
 <button id="back-to-top" class="btn btn-primary btn-sm rounded-pill" type="button" aria-hidden="true" onclick="topFunction()">
-    <i class="fa-solid fa-arrow-up"></i>
+    <i class="fa-solid fa-arrow-up"></i><span class="visually-hidden">Back to top button</span>
 </button>
 {%- endif %}

data/_includes/section-navigation-tiles.html

@@ -164,7 +164,7 @@
                 }
                 const cols = document.querySelectorAll(".navigation-tiles .col");
                 for (col of cols) {
-                    const colCategories = col.getAttribute("data-affiliations").split(" ");
+                    const colCategories = (col.getAttribute("data-affiliations") ?? "").split(" ");
                     if (colCategories.indexOf(this.value) != -1 || this.value === "reset") {
                         col.classList.remove("d-none");
                     } else {
@@ -181,7 +181,7 @@
                     document.getElementById("affiliations-input").selectedIndex = null;
                     const cols = document.querySelectorAll(".navigation-tiles .col");
                     for (col of cols) {
-                        const colCategories = col.getAttribute("data-affiliations").split(" ");
+                        const colCategories = (col.getAttribute("data-affiliations") ?? "").split(" ");
                         col.classList.remove("d-none");
                     }
                 }
@@ -198,13 +198,17 @@
         const input = document.getElementById("title-search");
         if (input) {
             const cols = document.querySelectorAll(".navigation-tiles .col");
-            let filter = input.value.toLowerCase();
+            const filter = input.value.toLowerCase();
+
             var affiliations = document.getElementById('affiliations-input');
             if (affiliations) {
                 document.getElementById("affiliations-input").selectedIndex = null;
             }
+
             for (let i = 0; i < cols.length; i++) {
-                let body = cols[i].querySelector(".card-body");
+                let body = cols[i].querySelector(".card-body") || cols[i].querySelector(".section-title");
+                if (!body) continue; // skip cols that don’t have searchable content
+
                 if (body.innerText.toLowerCase().indexOf(filter) > -1) {
                     cols[i].classList.remove("d-none");
                 } else {
@@ -212,7 +216,8 @@
                 }
             }
         }
-    }
+    };
+
     $(document).ready(function () {
         var clearsearch = document.getElementById("clearsearch");
         if (clearsearch) {

data/_includes/sidebar.html

@@ -9,39 +9,46 @@
 <button class="btn text-start d-lg-none hover-primary collapsed sidebar-collapse w-100 mb-3" type="button" data-bs-toggle="collapse" data-bs-target="#side-nav" aria-controls="side-nav" aria-expanded="true" aria-label="Toggle navigation">
     {{ page.sidebar | capitalize | replace: "_", " " }} menu <i title="navbar-toggler" class="fa-solid fa-bars ms-2"></i>
 </button>
-<nav class="collapse" id="side-nav" aria-label="Side navigation">
+<nav class="collapse text-muted" id="side-nav" aria-label="Side navigation">
     {%- if sidebar.title or sidebar.version %}
-    {%- if sidebar.title_url %}
-    {%- if page.url == sidebar.title_url %}
-    <a class="btn hover-primary text-start d-block mb-1 sidebar-title active" href="{{ sidebar.title_url | relative_url }}">{{sidebar.title}} {{sidebar.version}}</a>
-    {%- else %}
-    <a class="btn hover-primary text-start d-block mb-1 sidebar-title" href="{{ sidebar.title_url | relative_url }}">{{sidebar.title}} {{sidebar.version}}</a>
+    <div class="sidebar-title-wrapper pb-1 pt-2">
+        <a class="text-start d-block sidebar-title text-dark{% if page.url == sidebar.title_url %} active{%- endif %}{% unless sidebar.title_url %} disabled{%- endunless %}" {%- if sidebar.title_url %}href="{{ sidebar.title_url | relative_url }}"{%- endif %}>{{sidebar.title}} {{sidebar.version}}</a>
+    </div>    
     {%- endif %}
-    {%- else %}
-    <a class="btn text-start d-block mb-1 sidebar-title disabled" aria-disabled="true">{{sidebar.title}} {{sidebar.version}}</a>
-    {%- endif %}
-    {%- endif %}
-    <ul class="list-unstyled mb-4">
+    <ul id="sidebar-list-lvl-0"  class="list-unstyled mb-4{%- unless sidebar.title or sidebar.version %} pt-2{%- endunless %}">
+        {%- assign subitems_count = 0 %}
         {%- for folder in sidebar.subitems %}
-        {%- if page.url == folder.url %}
-        <li class="active{%- if folder.hr %} mt-3{% endif %}">
-        {%- else %}
-        <li {%- if folder.hr %} class="mt-3"{% endif %}>
+        <li class="d-flex align-items-center{%- if folder.hr %} mt-3{% endif %}">
+        {%- if folder.subitems %}
+        {%- assign subfolder_active = false %}
+        {%- for subfolder in folder.subitems %}
+        {%- if page.url == subfolder.url %}
+        {%- assign subfolder_active = true %}
+        {%- endif %}
+        {%- if subfolder.subitems %}
+        {%- for subsubfolder in subfolder.subitems %}
+        {%- if page.url == subsubfolder.url %}
+        {%- assign subfolder_active = true %}
+        {%- endif %}
+        {%- endfor %}
+        {%- endif %}
+        {%- endfor %}
         {%- endif %}
         {%- if folder.external_url %}
-            <a class="btn hover-primary text-start d-block mb-1" href="{{folder.external_url}}" target="_blank" rel="noopener">{{folder.title}}</a>
-        {%- else %}    
-            <a class="btn hover-primary text-start d-block mb-1" href="{{folder.url | relative_url }}">{{ folder.title }}</a>
+            <a class="text-start w-100" href="{{folder.external_url}}" target="_blank" rel="noopener">{{folder.title}}</a>
+        {%- else %}
+            <a class="text-start w-100{%- if page.url == folder.url %} active{% endif %}" {%- if folder.url %}href="{{folder.url | relative_url }}"{% else %}data-bs-toggle="collapse" data-bs-target="#sidebar-list-lvl-1-{{subitems_count}}" aria-expanded="{{subfolder_active}}" aria-controls="sidebar-list-lvl-1-{{subitems_count}}"{% endif %}>{{ folder.title }}</a>
         {%- endif %}
         {%- if folder.subitems %}
-            <ul class="list-unstyled">
+         <button type="button" class="btn btn-sm btn-link rounded-circle{%- unless subfolder_active or page.url == folder.url or page.type == 'Data_life_cycle' and folder.title == 'Data life cycle' %} collapsed{% endunless %}" data-bs-toggle="collapse" data-bs-target="#sidebar-list-lvl-1-{{subitems_count}}" aria-expanded="{{subfolder_active}}" aria-controls="sidebar-list-lvl-1-{{subitems_count}}">
+            <i class="fa-solid fa-chevron-right"></i><span class="visually-hidden">Expand sidebar</span>
+          </button>
+        <li class="py-0">
+            <ul id="sidebar-list-lvl-1-{{subitems_count}}" class="list-unstyled collapse{%- if subfolder_active or page.url == folder.url or page.type == 'Data_life_cycle' and folder.title == 'Data life cycle' %} show{% endif %}" data-bs-parent="#sidebar-list-lvl-0">
+                {%- assign subsubitems_count = 0 %}
                 {%- for subfolder in folder.subitems %}
                 {%- if subfolder.RDM -%}
-                {%- if page.type == "data_life_cycle" %}
-                <li class="active sidebar_rdm_sub mb-1">
-                {% else %}
-                <li class="sidebar_rdm_sub mb-1">
-                {% endif %}
+                <li class="sidebar_rdm_sub mb-1{%- if page.type == 'Data_life_cycle' %} active{% endif %}">
                     <svg version="1.1" id="data-life-cycle" xmlns="http://www.w3.org/2000/svg"
                         xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 250.9 251"
                         style="enable-background:new 0 0 250.9 251;" xml:space="preserve" class="sidebar_rdm">
@@ -198,40 +205,49 @@
                     </svg>
                 </li>
                 {%- else %}
-                {%- if page.url == subfolder.url %}
-                <li class="active">
-                {%- else %}
-                <li>
+                <li class="d-flex align-items-center{%- if subfolder.hr %} mt-3{% endif %}">
+                {%- if subfolder.subitems %}
+                {%- assign subsubfolder_active = false %}
+                {%- for subsubfolder in subfolder.subitems %}
+                {%- if page.url == subsubfolder.url %}
+                {%- assign subsubfolder_active = true %}
+                {%- endif %}
+                {%- endfor %}
                 {%- endif %}
                 {%- if subfolder.external_url %}
-                    <a class="btn hover-primary text-start d-block mb-1" href="{{subfolder.external_url}}" target="_blank" rel="noopener">{{subfolder.title}}</a>
+                    <a class="text-start w-100" href="{{subfolder.external_url}}" target="_blank" rel="noopener">{{subfolder.title}}</a>
                 {%- else %}    
-                    <a class="btn hover-primary text-start d-block mb-1" href="{{subfolder.url | relative_url }}">{{ subfolder.title }}</a>
+                    <a class="text-start w-100{%- if page.url == subfolder.url %} active{% endif %}" {%- if subfolder.url %}href="{{subfolder.url | relative_url }}"{% else %}data-bs-toggle="collapse" data-bs-target="#sidebar-list-lvl-2-{{subsubitems_count}}" aria-expanded="{{subsubfolder_active}}" aria-controls="sidebar-list-lvl-2-{{subsubitems_count}}"{% endif %}>{{ subfolder.title }}</a>
                 {%- endif %}
                 {%- if subfolder.subitems %}
-                    <ul class="list-unstyled">
+                <button type="button" class="btn btn-sm btn-link rounded-circle{%- unless subsubfolder_active or page.url == subfolder.url %} collapsed{% endunless %}" data-bs-toggle="collapse" data-bs-target="#sidebar-list-lvl-2-{{subsubitems_count}}" aria-expanded="{{subsubfolder_active}}" aria-controls="sidebar-list-lvl-2-{{subsubitems_count}}">
+                    <i class="fa-solid fa-chevron-right"></i><span class="visually-hidden">Expand sidebar</span>
+                </button>
+                </li>
+                <li class="py-0">
+                    <ul id="sidebar-list-lvl-2-{{subsubitems_count}}" class="list-unstyled collapse{%- if subsubfolder_active or page.url == subfolder.url %} show{% endif %}" data-bs-parent="#sidebar-list-lvl-1-{{subitems_count}}">
                         {%- for subsubfolder in subfolder.subitems %}
-                        {%- if page.url == subsubfolder.url %}
-                        <li class="active">
-                        {%- else %}
-                        <li>
-                        {%- endif %}
+                        <li class="d-flex align-items-center{%- if subsubfolder.hr %} mt-3{% endif %}">
                         {%- if subsubfolder.external_url %}
-                            <a class="btn hover-primary text-start d-block mb-1" href="{{subsubfolder.external_url}}" target="_blank" rel="noopener">{{subsubfolder.title}}</a>
-                        {%- else %}    
-                            <a class="btn hover-primary text-start d-block mb-1" href="{{subsubfolder.url | relative_url }}">{{ subsubfolder.title }}</a>
+                            <a class="text-start w-100" href="{{subsubfolder.external_url}}" target="_blank" rel="noopener">{{subsubfolder.title}}</a>
+                        {%- else %}
+                            <a class="text-start w-100{%- if page.url == subsubfolder.url %} active{% endif %}" href="{{subsubfolder.url | relative_url }}">{{ subsubfolder.title }}</a>
                         {%- endif %}
                         </li>
                         {%- endfor %}
                     </ul>
+                </li>
                 {%- endif %}
-                {%- endif %}
+                {%- unless subfolder.subitems %}
                 </li>
+                {%- endunless  %}
+                {%- endif %}
+                {%- assign subsubitems_count = subsubitems_count | plus: 1 %}
                 {%- endfor %}
             </ul>
         {%- endif %}
-        </li>
+        </li>        
+        {%- assign subitems_count = subitems_count | plus: 1 %}
         {%- endfor %}
     </ul>
-    <script>$("li.active").parents('li').toggleClass("active parent");</script>
 </nav>

data/_includes/toc.html

@@ -19,7 +19,7 @@
       classes: { list: 'list-unstyled mb-4' },
       showSpeed: 0,
       headers: '{{site.theme_variables.toc.headings | default: "main h2" }}',
-      title: '<strong class="my-2">On this page</strong><hr class="my-2">' 
+      title: '<strong class="my-0 my-xl-2 pt-2 d-block text-dark">On this page</strong><hr class="mt-2">' 
     });
     // After generating the TOC, check the hash in the URL and scroll to the anchor if present
     if (window.location.hash) {

data/_includes/topnav.html

@@ -1,8 +1,9 @@
 <!-- Navigation -->
 <header>
+    <a class="visually-hidden-focusable" href='#side-nav'>Skip to aside</a>
     <a class="visually-hidden-focusable" href='#main'>Skip to content</a>
     <a class="visually-hidden-focusable" href='#footer'>Skip to footer</a>
-    <nav class="navbar navbar-{{ site.theme_variables.topnav.theme | default: 'light' }} navbar-expand-lg mb-3 mb-lg-5">
+    <nav class="navbar navbar-{{ site.theme_variables.topnav.theme | default: 'light' }} navbar-expand-lg mb-3 mb-lg-5 shadow-sm">
         <div class="container g-lg-5">
             <a class="navbar-brand flex-grow-1 overflow-x-auto" href="{{ '/' | relative_url }}"><img class="{% if site.topnav_title %}me-3 {% endif %}img-fluid" alt="{{site.title}} logo" src="{{ site.theme_variables.topnav.brand_logo | default: 'assets/img/main_logo.svg' | relative_url }}">{% if site.topnav_title %}<span class="me-0 me-lg-3">{{site.topnav_title}}</span>{% endif %}</a>
             <button class="navbar-toggler text-primary" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">

data/_layouts/default.html

@@ -1,12 +1,12 @@
 <!doctype html>
 <html lang="en">
 {% include head.html %}
-<body class="d-flex flex-column min-vh-100"{% if page.toc or page.toc == nil %} data-bs-spy="scroll" data-bs-target="#toc-contents" data-bs-smooth-scroll="true" tabindex="0"{% endif %}>
+<body class=""{% if page.toc or page.toc == nil %} data-bs-spy="scroll" data-bs-target="#toc-contents" data-bs-smooth-scroll="true" tabindex="0"{% endif %}>
     {% if site.topnav_banner %}{% include banner.html %}{% endif %}
     {% if jekyll.environment == "development" and site.theme_variables.dev-info-banner == true %}{% include dev-info.html %}{% endif %}
-    {% include topnav.html %}
+    {% include topnav.html search=site.theme_variables.topnav.search %}
     <!-- Page Content -->
-    <div class="container g-lg-5 flex-grow-1">
+    <div class="container g-lg-5">
         <!-- Content Row -->
         <div {% if page.sidebar %}id="layout" class="gap-5"{% endif %}>
             <!-- Sidebar -->

data/_layouts/page.html

@@ -1,7 +1,7 @@
 ---
 layout: default
 ---
-<main id="main" class="order-1{%- if page.toc or page.toc == nil or page.page_img %} add-grid{% endif %}">
+<main id="main" class="min-vh-100{%- if page.toc or page.toc == nil or page.page_img %} add-grid{% endif %}">
     <div id="intro">
         {%- if site.theme_variables.breadcrumb %}
         {% include breadcrumb.html %}
@@ -35,9 +35,9 @@ layout: default
         {%- if page.page_id %}
         {% include resource-table-all.html tag=page.page_id %}
         {%- endif %}
-        {% include affiliation-tiles-page.html %}
-        {% include contributor-minitiles-page.html %}
-        {% include citation-page.html %}
+        
+        {% include page-metadata-tabs.html %}
+        
         {%- if site.theme_variables.github_buttons.position == "bottom" %}
         <div id="github-buttons-wrapper" class="d-flex mt-5">
             {% include github-buttons.html %}

data/_sass/_bootstrap_variables.scss

@@ -7,4 +7,5 @@ $light:         #f8f9fa;
 $dark:          #212529;
 
 /*-----Custom values for Bootstrap variables-----*/
-$link-decoration: none;
+
+

data/_sass/_variables.scss

@@ -10,40 +10,34 @@ $btn-primary-color-hover: $white;
 $topnav-bg: $light;
 $topnav-title-color: $primary;
 $topnav-brand-height: 44px;
+$topnav-searchbar: $white;
 
 /*-----Search-----*/
 $search-result-color: $primary;
 
 /*-----Sidebar-----*/
-$sidebar-bg: $light;
-$sidebar-color: $dark;
-$sidebar-lvl2-bg: $white;
-$sidebar-lvl2-color: $dark;
-$sidebar-lvl3-bg: $white;
-$sidebar-lvl3-color: $dark;
-$sidebar-bg-active: $primary;
-$sidebar-color-active: $white;
+$sidebar-title-bg: $white;
+$sidebar-link-color-active: $primary !default;
+$sidebar-link-bg-active:rgba($primary, 0.08) !default;
 
 /*-----Section navigation tiles-----*/
 $nav-card-bg: $light;
 $nav-card-color: $dark;
-$nav-card-bg-hover: $primary;
-$nav-card-color-hover: $white;
+$nav-card-bg-hover: rgba($primary, 0.08) !default;
+$nav-card-color-hover: $dark;
 
 /*-----More information tiles-----*/
 $info-card-bg: $light;
 $info-card-color: $dark;
-$info-card-bg-hover: $primary;
-$info-card-color-hover: $white;
+$info-card-bg-hover: rgba($primary, 0.08) !default;
+$info-card-color-hover: $dark;
 
 /*-----Contributors-cards-----*/
 $contr-card-bg: $light;
 
-/*-----Page contributors-----*/
-$contr-bg: $light;
-$contr-link-bg: $white;
-$contr-crown-bg: $dark;
-$contr-crown-color: $white;
+/*-----Page metadata-----*/
+$page-metadata-bg: rgba($primary, 0.08);
+$page-metadata-link-bg: $white;
 $contr-popover-bg: $white;
 
 /*-----Events & news-----*/