GithubHelp home page GithubHelp logo

bedroesb / elixir-toolkit-theme Goto Github PK

View Code? Open in Web Editor NEW

This project forked from elixir-belgium/elixir-toolkit-theme

0.0 0.0 0.0 4.48 MB

Flexible Jekyll theme using bootstrap 5 as CSS framework.

Home Page: https://elixir-belgium.github.io/elixir-toolkit-theme/

License: MIT License

JavaScript 7.57% Ruby 0.20% CSS 0.70% HTML 25.94% SCSS 65.59%

elixir-toolkit-theme's Introduction

Gem Version Jekyll site CI DOI

ELIXIR toolkit theme

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
  • Advanced content search
  • Create your own look with the many theme variables
  • Change style using custom classes
  • Support for a central tools table
  • Page tagging and listing of those tagged pages
  • Linking to ELIXIR resources including Bio.tools, FAIRsharing, FAIR Cookbook, 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 matadata attributes
  • Support for Google Analytics and Plausible

Installation

via GitHub Pages remote theme (installation free!)

The quickest way to use the elixir-toolkit-theme is to use the GitHub pages remote theme feature in your config.yml file:

remote_theme: ELIXIR-Belgium/elixir-toolkit-theme

It also allows you to use a specific version of the theme by add @X.X.X to make sure your website keeps working iif breaking changes get introduced.

via RubyGems:

Alternatively you can install it as a Ruby Gem (preferred way if you use GitLab).

Add this line to your Jekyll site's Gemfile:

gem "elixir-toolkit-theme"

And add this line to your Jekyll site's _config.yml:

theme: elixir-toolkit-theme

Usage

View the documentation for usage information (under development).

Deployment

Using GitHub pages

This theme can be used to deploy the website using GitHub pages. Visit the GitHub documentation to find out more about how to setup GitHub pages.

Locally using Jekyll

  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.

  2. Install Jekyll If you have never installed or run a Jekyll site locally on your computer, follow these instructions to install Jekyll:

  3. Install Bundler and Jekyll

    gem install jekyll bundler
    
  4. Install dependencies

    bundle install
    
  5. deploy website

    bundle exec jekyll serve
    

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

Using Docker

If not already installed on your machine, install Docker. From the root of the elixir-toolkit-theme directory, run:

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"

This will start the docker container and serve the website locally. Make sure the .\_site is not yet created to avoid permission errors.

This theme is known to be used in

Used packages

This theme would not be possible without following open source projects:

  • Bootstrap5 - As main CSS framework
  • DataTables - To generate tables that are sortable, searchable and contain pagination
  • AnchorJS - Adds deep anchor links to the headings
  • lunr.js - Main tool behind the search bar enabling content search
  • jQuery - A fast, small, and feature-rich JavaScript library for easy scripting
  • jekyll-table-of-contents - Lightweight JS script to render the table of contents
  • jQuery Navgoco Menus - Multi-level slide navigation with accordion effect
  • Font-Awesome - The famous icon library
  • flag-icons - A curated collection of all country flags in SVG + css integration
  • clipboard.js - Modern copy to clipboard. No Flash. Just 3kb gzipped clipboard.

Attribution

If you like our work, you can add following badge to the readme of your project:

[![theme badge](https://img.shields.io/badge/ELIXIR%20toolkit%20theme-jekyll-blue?color=0d6efd)](https://github.com/ELIXIR-Belgium/elixir-toolkit-theme)

theme badge

License

The theme is available as open source under the terms of the MIT License.

elixir-toolkit-theme's People

Contributors

bedroesb avatar dependabot[bot] avatar fbacall avatar mareksuchanek avatar mshadbolt avatar nsunami avatar rabuono avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.