elixir-toolkit-theme 1.6.1 → 1.7.2

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: e166c0f23c8a0b714ce0b473d8a09c9e6c56dbd19c855ec1f0dba24dc46b0143
4
- data.tar.gz: 7d4e6d8072737b2875a3f759f936f11d1d103c0a34af45e4d972f0d6d22172a9
3
+ metadata.gz: 07ed353aa7d90f0c32deb99b0fc5960a9dd710b0faacf207f9f7a898d8d1ef12
4
+ data.tar.gz: 343072727244f36fc174b9d13b4b0c11cb6ab8c7da628e2b76d415afba363fd1
5
5
  SHA512:
6
- metadata.gz: 6a5243c9e41f433914d44bb5a02546a3ce359a4dc2b17ffca5a5de66ccdd876f83252f4b56ddff72c8fcf6399c9e39d48e244516865f5b2ac39a6127483ff005
7
- data.tar.gz: 0e5b679f01dc4b43dda2f688fbdd7f31eed7598f7256aea56d8fca5849747c8bf018d631e4c28e1e83673079af8285e7ede3b47fa51989f94ec1019fd70e4717
6
+ metadata.gz: e583ed108e3a0820a3a4808d5880b43804837c38488e0247225829afd762353a96042f1413f17a7d3c437ec0c414cce83392127bcd2f8e4a2ba21d6ea94a6ffa
7
+ data.tar.gz: ebf24972f2dba358d7a67793034941223279660f2212d26d8ff067ab93acf75c728a0836abf486c8e13daf1658d0bb04eda959f4c441a3cb8d351b1e5dd32bbb
data/README.md CHANGED
@@ -1,41 +1,62 @@
1
- [![Gem Version](https://badge.fury.io/rb/elixir-toolkit-theme.svg)](https://badge.fury.io/rb/elixir-toolkit-theme)
1
+ [![Gem Version](https://badge.fury.io/rb/elixir-toolkit-theme.svg)](https://badge.fury.io/rb/elixir-toolkit-theme) [![Jekyll site CI](https://github.com/ELIXIR-Belgium/elixir-toolkit-theme/actions/workflows/jekyll.yml/badge.svg)](https://github.com/ELIXIR-Belgium/elixir-toolkit-theme/actions/workflows/jekyll.yml)
2
2
 
3
- # ELIXIR toolkit theme
3
+ <p align="center">
4
+ <img src="assets/img/main_logo.svg" width="100" float="center"/>
5
+ <h1 align="center">ELIXIR toolkit theme </h1>
6
+ </p>
4
7
 
5
- This repository is used to build a flexible Jekyll theme using bootstrap 5 as CSS framework.
8
+ 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 ELXIR resources.
6
9
 
7
- ## Used packages:
10
+ Its key features:
11
+ - Easy deployment using GitHub pages
12
+ - Advanced content search
13
+ - Create your own look with the many theme variables
14
+ - Change style using custom classes
15
+ - Support for a central tools table
16
+ - Page tagging and listing of those tagged pages
17
+ - Linking to ELIXIR resources including Bio.tools, FAIRSHARING, FAIR Cookbook, TeSS and DSW
18
+ - Easy side navigation, top navigation and footer management
19
+ - Mobile friendly
20
+ - Create website sections with each section having its own sidebar
21
+ - Out of the box search engine optimizations including schema.org attributes and many other matadata attributes
22
+ - Support for Google Analytics and Plausible
8
23
 
9
- - [Bootstrap5](https://github.com/twbs/bootstrap)
10
- - [DataTables](https://datatables.net/examples/styling/bootstrap5.html)
11
- - [AnchorJS](https://www.bryanbraun.com/anchorjs/)
12
- - [lunr.js](https://lunrjs.com/)
13
- - [jQuery](https://jquery.com/)
14
- - [jekyll-table-of-contents](https://github.com/ghiculescu/jekyll-table-of-contents)
15
- - [jQuery Navgoco Menus](https://github.com/tefra/navgoco)
24
+ ## Installation
16
25
 
26
+ ### via GitHub Pages remote theme
17
27
 
18
- ## Using Jekyll
28
+ The quickiest way to use Just The Docs is to use GitHub pages [remote theme](https://blog.github.com/2017-11-29-use-any-theme-with-github-pages/) feature in your `config.yml` file:
19
29
 
20
- The website is build on GitHub using Jekyll, a simple, static site generator based on ruby. When you have a local copy cloned onto your computer, it is possible to generate the website based on this repo. This makes it possible to preview changes live, every time you save a file from within the GitHub jekyll-bootstrap-theme repo. Follow these steps to deploy the website based on your local clone (copy) of the jekyll-bootstrap-theme repo:
21
-
22
- Make sure you have cloned the jekyll-bootstrap-theme repo:
30
+ ```yaml
31
+ remote_theme: ELIXIR-Belgium/elixir-toolkit-theme
32
+ ```
33
+ ### via RubyGems:
23
34
 
24
- git clone git@github.com:USERNAME/jekyll-bootstrap-theme.git
25
- cd jekyll-bootstrap-theme
35
+ Alternatively you can install it as a Ruby Gem (preferred way if you use GitLab).
26
36
 
37
+ Add this line to your Jekyll site's Gemfile:
27
38
 
28
- To run the website locally, you can either use [Docker](https://www.docker.com/) or use Jekyll directly after installing various dependencies.
39
+ ```ruby
40
+ gem "elixir-toolkit-theme"
41
+ ```
29
42
 
30
- ### Run using Docker
43
+ And add this line to your Jekyll site's `_config.yml`:
31
44
 
32
- If not already installed on your machine, install Docker. From the root of the ``jekyll-bootstrap-theme`` directory, run:
45
+ ```yaml
46
+ theme: elixir-toolkit-theme
33
47
  ```
34
- docker run -it --rm -p 4000:4000 -v $PWD:/srv/jekyll jekyll/jekyll:latest /bin/bash -c "chmod a+w /srv/jekyll/Gemfile.lock && chmod 777 /srv/jekyll && jekyll serve -w"
35
- ```
36
- This will start the docker container and serve the website locally.
37
48
 
38
- ### Run using Jekyll directly
49
+ ## Usage
50
+
51
+ [View the documentation](https://elixir-belgium.github.io/elixir-toolkit-theme/) for usage information.
52
+
53
+ ## Deployment
54
+
55
+ ### Using GitHub pages
56
+
57
+ This theme can be used to deploy the website using GitHub pages. Visit the [GitHub documentation](https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/) to find out more about how to setup GitHub pages.
58
+
59
+ ### Locally using Jekyll
39
60
 
40
61
  1. If not already present on your machine, install ruby. Note that incompatibility issues may arise with ruby 3.0.0 (released 25.12.20) or newer versions.
41
62
 
@@ -64,3 +85,40 @@ If you have never installed or run a Jekyll site locally on your computer, follo
64
85
 
65
86
  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)
66
87
 
88
+
89
+ ### Using Docker
90
+
91
+ If not already installed on your machine, install Docker. From the root of the `elixir-toolkit-theme` directory, run:
92
+
93
+ ```
94
+ docker run -it --rm -p [::1]:4000:4000 -v $PWD:/srv/jekyll jekyll/jekyll:latest /bin/bash -c "chmod a+w /srv/jekyll/Gemfile.lock && chmod 777 /srv/jekyll && bundle install && bundle exec jekyll serve --host 0.0.0.0"
95
+ ```
96
+
97
+ This will start the docker container and serve the website locally. Make sure the `.\_site` is not yet created to avoid permission errors.
98
+
99
+ ## This theme is known to be used in:
100
+
101
+ - [RDMkit](https://rdmkit.elixir-europe.org/)
102
+ - [RDMGuide](https://rdm.elixir-belgium.org/)
103
+ - [Infectious Diseases Toolkit](https://www.infectious-diseases-toolkit.org/)
104
+ - [Applied Bioinformatics and Biostatistics intranet page](https://intranet.psb.ugent.be/abb/)
105
+
106
+
107
+ ## Used packages
108
+
109
+ This theme would not be possible without following open source projects:
110
+
111
+ - [Bootstrap5](https://github.com/twbs/bootstrap) - As main CSS framework
112
+ - [DataTables](https://github.com/DataTables/DataTablesSrc) - To generate tables that are sortable, searchable and contain pagination
113
+ - [AnchorJS](https://github.com/bryanbraun/anchorjs) - Adds deep anchor links to the headings
114
+ - [lunr.js](https://github.com/olivernn/lunr.js) - Main tool behind the search bar enabling content search
115
+ - [jQuery](https://github.com/jquery/jquery) - A fast, small, and feature-rich JavaScript library for easy scripting
116
+ - [jekyll-table-of-contents](https://github.com/ghiculescu/jekyll-table-of-contents) - Lightweight JS script to render the table of contents
117
+ - [jQuery Navgoco Menus](https://github.com/tefra/navgoco) - Multi-level slide navigation with accordion effect
118
+ - [Font-Awesome](https://github.com/FortAwesome/Font-Awesome) - The famous icon library
119
+ - [flag-icons](https://github.com/lipis/flag-icons) - A curated collection of all country flags in SVG + css integration
120
+
121
+ ## License
122
+
123
+ The theme is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
124
+
@@ -1,12 +1,12 @@
1
1
  {%- assign alllogos = site.data.affiliations %}
2
- <div class="row row-cols-2 row-cols-sm-3 row-cols-md-4 g-5 my-3">
2
+ <div class="affiliation-tiles row row-cols-2 row-cols-sm-3 row-cols-md-4 g-5 my-3">
3
3
  {%- assign filtered_logos = alllogos | where: "type", include.type %}
4
4
  {%- for affiliation in filtered_logos %}
5
5
  {%- if affiliation.image_url and affiliation.expose == true %}
6
6
  <div class="col">
7
7
  <div class="card h-100 border-0">
8
8
  <div class="my-auto">
9
- {% if affiliation.url %}<a href="{{ affiliation.url }}">{% endif %}<img class="card-img-top" src="{{ affiliation.image_url | relative_url }}" alt="{{ affiliation.name }}">{%- if affiliation.url %}</a>{% endif %}
9
+ {% if affiliation.url %}<a href="{{ affiliation.url }}">{% endif %}<img class="rounded" src="{{ affiliation.image_url | relative_url }}" alt="{{ affiliation.name }}">{%- if affiliation.url %}</a>{% endif %}
10
10
  </div>
11
11
  </div>
12
12
  </div>
data/_includes/head.html CHANGED
@@ -16,8 +16,8 @@
16
16
  <meta property="og:description" content="{{ site.description }}" />
17
17
  <meta property="og:image" content="//{{site.github.url | remove: 'https://' | remove: 'http://'}}/assets/img/apple-touch-icon.png" />
18
18
  <meta name="apple-mobile-web-app-title" content="{{site.title}}">
19
- <meta name="msapplication-TileColor" content="#{{site.theme_variables.theme_color}}">
20
- <meta name="theme-color" content="#{{site.theme_variables.theme_color}}">
19
+ <meta name="msapplication-TileColor" content="#{{site.theme_variables.theme_color | default: 0d6efd }}">
20
+ <meta name="theme-color" content="#{{site.theme_variables.theme_color | default: 0d6efd }}">
21
21
  {%- if page.search_exclude == true and page.url != "/index.html" %}
22
22
  <meta name="robots" content="noindex" />
23
23
  {%- endif %}
@@ -74,7 +74,7 @@
74
74
  <link rel="icon" type="image/png" sizes="32x32" href="{{ 'assets/img/favicon-32x32.png' | relative_url }}">
75
75
  <link rel="icon" type="image/png" sizes="16x16" href="{{ 'assets/img/favicon-16x16.png' | relative_url }}">
76
76
  <link rel="manifest" href="{{ 'assets/img/site.webmanifest' | relative_url }}">
77
- <link rel="mask-icon" href="{{ 'assets/img/safari-pinned-tab.svg' | relative_url }}" color="#{{site.theme_variables.theme_color}}">
77
+ <link rel="mask-icon" href="{{ 'assets/img/safari-pinned-tab.svg' | relative_url }}" color="#{{site.theme_variables.theme_color | default: 0d6efd }}">
78
78
  <link rel="shortcut icon" href="{{ 'assets/img/favicon.ico' | relative_url }}">
79
79
  <!-- Schema.org metadata -->
80
80
  {% include schemasorg.html %}
@@ -10,20 +10,18 @@
10
10
  {{ page.sidebar | capitalize | replace: "_", " " }} menu <i title="navbar-toggler" class="fa fa-bars ms-2"></i>
11
11
  </button>
12
12
  <nav class="collapse" id="side-nav" aria-label="Side navigation">
13
- <ul id="menu" class="list-unstyled mb-4 mb-lg-0">
14
- {%- if sidebar.title or sidebar.version %}
15
- {%- if sidebar.title_url and page.url == sidebar.title_url %}
16
- <li class="sidebar-title active">
17
- {%- else %}
18
- <li class="sidebar-title">
19
- {%- endif %}
20
- {%- if sidebar.title_url %}
21
- <a class="btn active hover-primary text-start d-block mb-1" href="{{ sidebar.title_url | relative_url }}">{{sidebar.title}} {{sidebar.version}}</a>
22
- {%- else %}
23
- <a class="btn active hover-primary text-start d-block mb-1 disabled" aria-disabled="true">{{sidebar.title}} {{sidebar.version}}</a>
24
- {%- endif %}
25
- </li>
26
- {%- endif %}
13
+ {%- if sidebar.title or sidebar.version %}
14
+ {%- if sidebar.title_url %}
15
+ {%- if page.url == sidebar.title_url %}
16
+ <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>
17
+ {%- else %}
18
+ <a class="btn hover-primary text-start d-block mb-1 sidebar-title" href="{{ sidebar.title_url | relative_url }}">{{sidebar.title}} {{sidebar.version}}</a>
19
+ {%- endif %}
20
+ {%- else %}
21
+ <a class="btn text-start d-block mb-1 sidebar-title disabled" aria-disabled="true">{{sidebar.title}} {{sidebar.version}}</a>
22
+ {%- endif %}
23
+ {%- endif %}
24
+ <ul class="list-unstyled mb-4 mb-lg-0">
27
25
  {%- for folder in sidebar.subitems %}
28
26
  {%- if page.url == folder.url %}
29
27
  <li class="active{%- if folder.hr %} mt-3{% endif %}">
data/_layouts/page.html CHANGED
@@ -9,14 +9,23 @@ layout: default
9
9
  {%- else %}
10
10
  <h1>{{ page.title }}
11
11
  {%- endif %}
12
+ {%- if site.theme_variables.github_buttons.edit_me or site.theme_variables.github_buttons.open_issue or site.theme_variables.github_buttons.history or site.theme_variables.github_buttons.edit_me == nil or site.theme_variables.github_buttons.open_issue == nil or site.theme_variables.github_buttons.history == nil %}
12
13
  <div class="btn-group">
14
+ {%- if site.theme_variables.github_buttons.edit_me or site.theme_variables.github_buttons.edit_me == nil %}
13
15
  {%- if page.custom-editme %}
14
16
  <a role="button" data-bs-toggle="tooltip" title="Propose changes to the content of this page on {{site.theme_variables.git_host | default: 'GitHub' }}" href="{{site.github.repository_url}}/blob/{{site.github.source.branch}}/{{page.custom-editme}}" class="btn btn-sm hover-primary text-primary"><i class="fas fa-pencil-alt"></i></a>
15
17
  {%- else %}
16
18
  <a role="button" data-bs-toggle="tooltip" title="Propose changes to this page on {{site.theme_variables.git_host | default: 'GitHub' }}" href="{{site.github.repository_url}}/blob/{{site.github.source.branch}}/{{page.path}}" class="btn btn-sm hover-primary text-primary"><i class="fas fa-pencil-alt"></i></a>
17
19
  {%- endif %}
20
+ {%- endif %}
21
+ {%- if site.theme_variables.github_buttons.open_issue or site.theme_variables.github_buttons.open_issue == nil %}
22
+ <a role="button" data-bs-toggle="tooltip" title="Report an issue" href="{{site.github.repository_url}}/issues/new?title={{'Issue on page: ' | url_encode }}{{page.title | url_encode }}&amp;body={{'I would like to report an issue on the ' | url_encode }}{{page.title | url_encode }}{{' page at `'| url_encode }}{{page.url | url_encode }}{{'`. Description of the issue:' | url_encode }}" class="btn btn-sm hover-primary text-primary"><i class="fas fa-exclamation"></i></a>
23
+ {%- endif %}
24
+ {%- if site.theme_variables.github_buttons.history or site.theme_variables.github_buttons.history == nil %}
18
25
  <a role="button" data-bs-toggle="tooltip" title="Check out the history of this page" href="{{site.github.repository_url}}/commits/{{site.github.source.branch}}/{{page.path}}" class="btn btn-sm hover-primary text-primary"><i class="fas fa-history"></i></a>
26
+ {%- endif %}
19
27
  </div>
28
+ {%- endif %}
20
29
  </h1>
21
30
  {%- endif %}
22
31
  {%- if page.summary %}
data/assets/css/main.scss CHANGED
@@ -44,6 +44,10 @@ main {
44
44
 
45
45
  a:not(.btn):hover {
46
46
  text-decoration: underline;
47
+ overflow-wrap: break-word;
48
+ word-wrap: break-word;
49
+ -ms-word-break: break-all;
50
+ word-break: break-word;
47
51
  }
48
52
 
49
53
  ol li,
@@ -271,7 +275,7 @@ header .navbar {
271
275
  background-color: $sidebar-bg-active;
272
276
  }
273
277
 
274
- ul#menu {
278
+ #side-nav>ul {
275
279
  > li:not(.sidebar-title) > a {
276
280
  background-color: $sidebar-bg;
277
281
  color: $sidebar-color;
@@ -1,3 +1,7 @@
1
+ ---
2
+ layout: none
3
+ permalink: assets/img/site.webmanifest
4
+ ---
1
5
  {
2
6
  "name": "",
3
7
  "short_name": "",
@@ -13,7 +17,7 @@
13
17
  "type": "image/png"
14
18
  }
15
19
  ],
16
- "theme_color": "#ffffff",
20
+ "theme_color": "#{{ site.theme_variables.theme_color | default: '0d6efd' }}",
17
21
  "background_color": "#ffffff",
18
22
  "display": "standalone"
19
23
  }
data/assets/js/main.js CHANGED
@@ -31,7 +31,7 @@ $(document).ready(function external_new_window() {
31
31
  */
32
32
  $(document).ready(function () {
33
33
  // Initialize navgoco with default options
34
- $("#menu").navgoco({
34
+ $("#side-nav>ul").navgoco({
35
35
  caretHtml: '',
36
36
  accordion: true,
37
37
  openClass: 'active', // open
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: elixir-toolkit-theme
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.6.1
4
+ version: 1.7.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - bedroesb
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2022-03-07 00:00:00.000000000 Z
11
+ date: 2022-03-14 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll