elixir-toolkit-theme 3.0.0 → 3.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4df02358a1652000ceb9b7a533633a3a8e8d13adf360cf24ac16b8449656c065
-  data.tar.gz: c40220fd4df7b25b67dae45c4929dd0a60307b9c201bbebefa02667c4a88d9fe
+  metadata.gz: 3267c907281c8601c8ef5b4050bc50cd5ed9ec81fdf1597ff1df9324b02c722f
+  data.tar.gz: 44102163b9642fc43400aeaa54c0e2c54a6ae16adba516b1158fb26b1116a59a
 SHA512:
-  metadata.gz: a80a7bfde86d9da466a492da92426c5d6ad0e80def5c62bfcfcad9e1e43654b1997e7a845ca42b0ffaec0e4d3f6b047a264b23f36f77a9b6ccb0ad1db919edf5
-  data.tar.gz: c8006541b91f6921a7251376e07ee51c52ab731b4fe6672e986648dcc433bdf9cab1a2cc1667fb9a85a0867f4158c7d0b5879c3c663b00a568e7e49b820e27eb
+  metadata.gz: ad2244937003421f31a83b4a01c9b23a91dc6d22ebaba3b2f8f8788361650a647b829027c6c7308c6aa7ec235ddbe772a5391686a15cdc8508574d7b90ed0506
+  data.tar.gz: cc977bc1c224160e2cda1d8b3f1d8c002606a86f9c42e76c6d4d8463f0deb0a4b9452d9c605a8031bdec11dafddab638c375b2e6247cf561a3cbe9c0f9673421

data/README.md

@@ -13,18 +13,18 @@ permalink: /
 The ELIXIR toolkit theme is a Jekyll theme designed to support easy deployment of documentation websites but also more complex ones that require a central tool table and linking towards ELIXIR resources. 
 
 Its key features:
-- Easy deployment using GitHub pages
+- Easy deployment using GitHub Pages or GitHub Actions
 - Advanced content search
-- Create your own look with the many theme variables
-- Change style using custom classes
+- Create your own look with the many theme variables and support for custom classes
 - Support for a central tools table
+- Integrated attribution for contributors, editors and affiliations
 - Page tagging and listing of those tagged pages
-- Linking to ELIXIR resources including Bio.tools, FAIRsharing, FAIR Cookbook, TeSS and DSW
+- Linking to ELIXIR resources including Bio.tools, FAIRsharing, FAIR Cookbook, RDMkit, TeSS and DSW
 - Easy side navigation, top navigation and footer management
 - Mobile friendly
 - Create website sections with each section having its own sidebar
 - Out of the box search engine optimizations including schema.org attributes and many other metadata attributes
-- Support for Google Analytics, Matomo and Plausible
+- Web analytics through Matomo, Google Analytics or Plausible
 
 ## Enabling the theme on your Jekyll project
 
@@ -34,10 +34,10 @@ The quickest way to use the elixir-toolkit-theme is setting it as a [remote them
 remote_theme: ELIXIR-Belgium/elixir-toolkit-theme
 ```
 
-You can lock it onto a specific version like using:
+You can lock it onto a specific version using:
 
 ```yaml
-remote_theme: ELIXIR-Belgium/elixir-toolkit-theme@2.5.0
+remote_theme: ELIXIR-Belgium/elixir-toolkit-theme@3.0.1
 ```
 
 ### Using Ruby Gems (alternative)
@@ -50,7 +50,7 @@ gem "elixir-toolkit-theme"
 You can lock it onto a specific version like this:
 
 ```ruby
-gem "elixir-toolkit-theme", "~> 2.5.0"
+gem "elixir-toolkit-theme", "~> 3.0.1"
 ```
 
 And add this line to your Jekyll site's `_config.yml`:
@@ -107,10 +107,11 @@ pages:
 1. If not already present on your machine, install **ruby**. 
 
 1. Install Jekyll
-If you have never installed or run a Jekyll site locally on your computer, follow these instructions to install Jekyll: [https://jekyllrb.com/docs/installation/](https://jekyllrb.com/docs/installation/)
+
+     If you have never installed or run a Jekyll site locally on your computer, follow these instructions to install Jekyll: [https://jekyllrb.com/docs/installation/](https://jekyllrb.com/docs/installation/)
 
     ```
-    gem install jekyll bundler
+    gem install jekyll
     ```
 
 1. Install dependencies
@@ -119,12 +120,20 @@ If you have never installed or run a Jekyll site locally on your computer, follo
     bundle install
     ```
 
-1. deploy website
+1. Deploy website locally in development mode:
 
     ```
     bundle exec jekyll serve
     ```
 
+    If you want to deploy the website locally in production mode, do:
+
+    ```
+    JEKYLL_ENV=production PAGES_REPO_NWO='USER_OR_ORGANISATION/REPO_NAME' bundle exec jekyll serve --baseurl ""
+    ```
+
+1. To preview your site, in your web browser, navigate to `http://localhost:4000`.
+   
 Additional information can be found at the following link: [https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/testing-your-github-pages-site-locally-with-jekyll](https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/testing-your-github-pages-site-locally-with-jekyll)
 
 
@@ -149,7 +158,7 @@ This will start the docker container and serve the website locally. Make sure th
 - [Australian BioCommons How-to-Guides](https://australianbiocommons.github.io/how-to-guides/)
 - [Norwegian Life Science RDM LookUp](https://elixir.no/rdm-lookup)
 - [ERIM Research Toolbox](https://eur-nl.github.io/erim-research-toolbox/)
-- [ELIXIR-UK Fellowship](https://elixir-uk-dash.github.io/rdmkit/)
+
 
 ## Dependencies
 

data/_includes/banner.html

@@ -0,0 +1,3 @@
+<div class="p-2 text-center text-break bg-warning">
+    <small>{{ site.topnav_banner }}</small>
+</div>

data/_includes/footer.html

@@ -44,7 +44,7 @@
             <div class="d-flex align-items-center mb-3 mb-lg-0 mx-auto mx-lg-0 text-center">{{ site.data.footer.copyright | markdownify }}</div>
             {%- endunless %}
             <div class="d-flex align-items-center mx-auto ms-lg-4 me-lg-0">
-                <a id="ett-logo" class="text-nowrap" href="https://elixir-belgium.github.io/elixir-toolkit-theme">Built with
+                <a id="ett-logo" class="text-nowrap me-lg-5 me-xxxl-0" href="https://elixir-belgium.github.io/elixir-toolkit-theme">Built with
                     <svg data-name="ETT logo" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 77.2 77.12">
                         <defs>
                             <style>

data/_includes/resource-table-all.html

@@ -4,7 +4,21 @@
 {%- assign tools = site.data.tool_and_resource_list | add_related_pages | sort_natural: "name" %}
 {%- endif %}
 {%- assign country_pages = site.pages | where_exp: "item", "item.search_exclude != true" | where_exp:"item","item.national_resources != nil" %}
-{%- unless tools.size == 0 or tools == nil %}
+{%- unless country_pages.size == 0  %}
+{%- assign tool_matches_total = 0 %}
+{%- assign query = "related_pages." | append: page.type %}
+{%- for country_page in country_pages %}
+{%- if include.tag %}
+{%- assign tool_matches = country_page.national_resources | where_exp:"resource","resource.related_pages != nil" | where: query, include.tag %}
+{%- unless tool_matches.size == 0  %}
+{%- assign tool_matches_total = tool_matches_total | plus: tool_matches.size %}
+{%- endunless %}
+{%- else %}
+{%- assign tool_matches_total = tool_matches_total | plus: country_page.national_resources.size %}
+{%- endif %}
+{%- endfor %}
+{%- endunless %}
+{%- unless tools.size == 0  and tool_matches_total.size == 0 %}
 {%- if include.tag %}
 <a class="visually-hidden-focusable" href='#skip-tool-table'>Skip tool table</a>
 {%- if site.theme_variables.headings.resource-table-all-collapse %}
@@ -17,6 +31,7 @@
 <div class="collapse info-card" id="tools_collapse">
 {%- endif %}
 {%- endif %}
+{%- unless tools.size == 0 %}
 <div class="table-responsive mt-4">
     <table class="tooltable table display">
         <thead>
@@ -36,14 +51,9 @@
             {%- for tool in tools %}
             <tr>
                 {%- assign instances_tool = 0 %}
-                {%- assign total_county_tools = 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 %}
-                {%- assign tool_matches = country_page.national_resources | where_exp:"resource","resource.related_pages != nil" | where: query, include.tag %}
-                {%- unless tool_matches.size == 0 %}
-                {%- assign total_county_tools = total_county_tools | plus: tool_matches.size %}
-                {%- endunless %}
                 {%- unless instance_matches.size == 0 %}
                 {%- assign instances_tool = instances_tool | plus: instance_matches.size %}
                 {%- endunless %}
@@ -54,7 +64,7 @@
                 <td>{{tool.name}}</td>
                 {%- endif %}
                 <td>{{tool.description}}
-                    {%- if tool.instance_of or tool.how_to_access or instances_tool != 0 and total_county_tools != 0 and include.tag != nil %}
+                    {%- if tool.instance_of or tool.how_to_access or instances_tool != 0 != 0 and include.tag != nil %}
                     {%- assign linked_tool = site.data.tool_and_resource_list | where:"id", tool.instance_of | first %}
                     <div class="d-block mt-1">
                         {%- if linked_tool %}
@@ -63,7 +73,7 @@
                         {%- 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 total_county_tools == 0 or include.tag == nil %}
+                        {%- 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> -->
@@ -99,16 +109,20 @@
                 </td>
             </tr>
             {%- endfor %}
+{%- if tool_matches_total == 0 or include.tag %}
         </tbody>
     </table>
 </div>
+{%- endif %}
 {%- if include.tag %}
 {%- if site.theme_variables.headings.resource-table-all-collapse %}
 </div>
 {%- endif %}
 <div id="skip-tool-table"></div>
 {%- endif %}
-{%- unless total_county_tools == 0 or include.tag == nil %}
+
+{%- endunless %}
+{%- unless tool_matches_total == 0 %}
 {%- if include.tag %}
 <a class="visually-hidden-focusable" href='#skip-nat-tool-table'>Skip national tools table</a>
 {%- if site.theme_variables.headings.resource-table-all-collapse %}
@@ -120,37 +134,34 @@
 </a>
 <div class="collapse info-card" id="nat_tools_collapse">
 {%- endif %}
-{%- endif %}
 <p class="mt-4">Tools and resources tailored to users in different countries.</p>
 <div class="table-responsive mt-3">
-    <table class="tooltable table display" id="national-resources-button">
+    <table class="tooltable table display">
         <thead>
             <tr class="text-nowrap">
-                <th>Tool or resource {%- if include.tag -%}
+                <th>Tool or resource
                     <a data-bs-toggle="tooltip" data-bs-original-title="This is a curated list which means that not all tools or resources that exist for this topic are listed here. This is mainly because we do not intend to be a registry. In most cases you will only find back the tools or resources that are mentioned in this page.">
                         <i class="fa-solid fa-info-circle"></i>
-                    </a>{%- endif %}
+                    </a>
                 </th>
                 <th>Description</th>
                 <th>Related pages</th>
-                <th>Registry {%- if include.tag -%}
+                <th>Registry
                     <a data-bs-toggle="tooltip" data-bs-original-title="Links to related information in ELIXIR registries: related policies and standards in FAIRsharing, scientific and technical descriptions of the resource in bio.tools, and related training in TeSS.">
                         <i class="fa-solid fa-info-circle"></i>
-                    </a>{%- endif %}
+                    </a>
                 </th>
             </tr>
         </thead>
         <tbody>
-            {%- assign hide_ids = "resource_title" %}
+{%- endif %}
             {%- for country_page in country_pages %}
             {%- if include.tag %}
             {%- assign tool_matches = country_page.national_resources | where_exp:"resource","resource.related_pages != nil" | where: query, include.tag | sort_natural: "name" %}
             {%- else %}
-            {%- assign tool_matches = country_page.national_resources | sort_natural: "name" %}
+            {%- assign tool_matches = country_page.national_resources %}
             {%- endif %}
             {%- for tool in tool_matches %}
-            {%- assign tool_id = tool.name | slugify %}
-            {%- assign hide_ids = hide_ids | append: " " | append: tool_id %}
             <tr>
                 {% if tool.url %}
                 <td><a href="{{tool.url}}">{{tool.name}}</a><a href="{{country_page.url | relative_url }}" data-bs-toggle="tooltip" title="{{country_page.title}}"><span class="flag-icon ms-2 shadow-sm flag-icon-{{country_page.country_code | downcase }}"></span></a></td>

data/_includes/section-navigation-tiles.html

@@ -1,4 +1,4 @@
-{%- unless include.affiliations == nil and include.search == nil %}
+{%- if include.affiliations == true or include.search == true %}
 {%- assign allcountries = site.data.countries %}
 {%- for current_page in site.pages | sorted %}
 {%- if current_page.affiliations and current_page.search_exclude != true and current_page.type == include.type %}
@@ -12,7 +12,7 @@
 {%- endfor %}
 {%- assign allaffiliations = allaffiliations | split: ", " | uniq | sort %}
 <div class="row g-4 row-cols-1 row-cols-md-2 row-cols-lg-{{ include.col | default: 2 }} my-4">
-    {%- unless include.affiliations == nil %}
+    {%- if include.affiliations == true %}
     <div class="col">
         <div class="input-group">
             <label class="input-group-text" for="affiliations-input">Filter by affiliation</label>
@@ -32,8 +32,8 @@
             </button>
         </div>
     </div>
-    {%- endunless %}
-    {%- unless include.search == nil %}
+    {%- endif %}
+    {%- if include.search == true %}
     <div class="col">
         <div class="input-group">
             <span class="input-group-text" id="search-label">Search</span>
@@ -43,9 +43,9 @@
             </button>
         </div>
     </div>
-    {%- endunless %}
+    {%- endif %}
 </div>
-{%- endunless %}
+{%- endif %}
 <div class="row row-cols-1 row-cols-md-2 row-cols-lg-{{ include.col | default: 2 }} g-4 mb-5 navigation-tiles">
     {%- if include.custom %}
     {%- assign related_pages = include.custom | split: ", " %}

data/_includes/topnav.html

@@ -4,12 +4,12 @@
     <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">
         <div class="container">
-            <a class="navbar-brand" 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>
+            <a class="navbar-brand 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">
                 <i title="navbar-toggler" class="fa-solid fa-bars"></i>
             </button>
             <div class="collapse navbar-collapse justify-content-end" id="navbarCollapse">
-                <ul class="navbar-nav gap-2">
+                <ul class="navbar-nav pt-3 pt-lg-0 pb-2 pb-lg-0 gap-2">
                     <!-- navigation entries -->
                     {%- assign topnav = site.data.topnav %}
                     {%- for item in topnav.subitems %}

data/_layouts/default.html

@@ -2,6 +2,7 @@
 <html lang="en">
 {% include head.html %}
 <body class="d-flex flex-column min-vh-100"{% unless page.toc == false %} data-bs-spy="scroll" data-bs-target="#toc-contents" data-bs-smooth-scroll="true" tabindex="0"{% endunless %}>
+    {% if site.topnav_banner %}{% include banner.html %}{% endif %}
     {% if jekyll.environment == "development" %}{% include dev-info.html %}{% endif %}
     {% include topnav.html %}
     <!-- Page Content -->
@@ -19,7 +20,7 @@
         </div>
     </div>
     {%- if site.theme_variables.back_to_top or site.theme_variables.back_to_top == nil %}
-    <button id="back-to-top" class="btn btn-primary rounded-3" type="button" aria-hidden="true" onclick="topFunction()">
+    <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>
     </button>
     {%- endif %}

data/assets/css/main.scss

@@ -15,7 +15,7 @@ $h2-font-size: 1rem * 2.1 !default;
 $h1-font-size: 1rem * 3.3 !default;
 $card-border-width: 0;
 $custom-container-max-widths: (
-    xxxl: 1500px
+    xxxl: 1700px
 );
 
 /*-----Initialize Bootstrap variables-----*/
@@ -597,6 +597,12 @@ footer {
         background-color: $footer-copyright-bg;
     }
 
+    @media (min-width: 1850px) {
+        .me-xxxl-0 {
+                margin-right: 0!important;
+            }
+    }
+
     #ett-logo {
         transition: color 0.15s ease-in-out;
 
@@ -617,19 +623,20 @@ footer {
 
 #back-to-top {
     position: fixed;
-    bottom: -50px;
-    right: $spacer;
+    height: 50px;
+    width: 50px;
+    bottom: -50px; /* Default hidden position */
+    right: 1rem; /* Adjust as needed */
     opacity: 0;
     overflow: hidden;
     z-index: 1000;
     font-size: 21px;
-    padding: 12px 20px;
     transition:
         bottom 0.15s ease-out,
         opacity 0.15s ease-out;
 
     &.visible {
-        bottom: $spacer;
+        bottom: 1rem; /* Initial visible position */
         opacity: 1;
     }
 }
@@ -891,31 +898,35 @@ li.past_event,
 }
 
 /*-----More information tiles-----*/
-
-.info-collapse {
-    transition: border-color 0.2s ease-in-out;
-
+// Main accordion style
+a.info-collapse {
     i {
-        transition-property: margin-right, transform;
-        transition-duration: 0.2s;
-        transition-timing-function: ease-in-out;
+        transition: transform 0.2s ease-in-out;
         margin-right: $spacer;
     }
-
+    h3 {
+        transition: color 0.2s ease-in-out;
+    }
     &[aria-expanded="true"] {
-        border-color: color.scale($border-color, $lightness: -30%) !important;
         i {
             transform: rotate(180deg);
         }
     }
     &:hover {
-        border-color: color.scale($border-color, $lightness: -30%) !important;
-        i {
-            color: color.scale($link-color, $lightness: -20%) !important;
+        i,
+        h3 {
+            color: rgba($link-color, 0.8) !important;
         }
     }
 }
 
+// Add a bottom border to the last accordion.
+a.info-collapse[aria-expanded="false"]:last-of-type,
+a.info-collapse[aria-expanded="true"]:last-of-type + .show {
+    border-bottom: 1px solid $border-color;
+}
+
+// Collapsed content styling
 .info-card {
     .info-logo {
         max-width: 250px;

data/assets/js/main.js

@@ -72,6 +72,7 @@ function topFunction() {
 }
 
 
+
 /**
  * Making relevant events visible
  */

data/assets/js/search-data.json

@@ -6,6 +6,7 @@ layout: none
   {%- assign i = 0 -%}
   {%- assign pages_array = "" | split: "" -%}
   {%- assign pages_array = pages_array | push: site.html_pages -%}
+  {%- assign pages_array = pages_array | push: site.documents -%}
   {%- for pages in pages_array -%}
     {%- for page in pages -%}
       {%- if page.title and page.search_exclude != true -%}
@@ -61,4 +62,4 @@ layout: none
     {%- endfor -%}
   {%- endfor %}
   }
-  
+  

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: elixir-toolkit-theme
 version: !ruby/object:Gem::Version
-  version: 3.0.0
+  version: 3.1.0
 platform: ruby
 authors:
 - bedroesb
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-03-21 00:00:00.000000000 Z
+date: 2024-08-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -80,6 +80,7 @@ files:
 - _data/countries.yml
 - _includes/affiliation-tiles-page.html
 - _includes/affiliation-tiles-selection.html
+- _includes/banner.html
 - _includes/callout.html
 - _includes/contributor-carousel-selection.html
 - _includes/contributor-minitiles-page.html
@@ -535,7 +536,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.3.26
+rubygems_version: 3.3.27
 signing_key: 
 specification_version: 4
 summary: Flexible Jekyll theme using bootstrap 5 as CSS framework.