Add banner to top of site promoting the live demo/playground instance

README.md

@@ -9,3 +9,17 @@ Please refer to the [documentation website](https://hub.maizegenetics.net) for m
 * [When to use](https://hub.maizegenetics.net/when-to-use) the Breeder Genomics Hub, and alternatives like [TLJH](https://tljh.jupyter.org) and [Z2JH](https://z2jh.jupyter.org)
 
 The [breeder-notebook](https://github.com/maize-genetics/breeder-notebook) Jupyter Docker Stack is the end-user environment, and contains common bioinformatics software useful to plant scientists and breeders, such as [rPHG](https://rphg.maizegenetics.net/) and [rTASSEL](https://rtassel.maizegenetics.net/).
+
+## Development
+### Documentation
+Documentation is hosted via [GitHub Pages](https://pages.github.com/), which provides easy [Jekyll](https://jekyllrb.com/) integration.
+
+To build the docs site locally:
+
+```console
+cd docs
+bundle install
+bundle exec jekyll serve
+```
+
+Requires [Ruby](https://www.ruby-lang.org).

docs/.gitignore

@@ -0,0 +1 @@
+_site/

docs/Gemfile

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+source "https://rubygems.org"
+
+# gem "rails"
+
+gem "rake"
+gem "jekyll", "~> 4.3"
+gem "jekyll-remote-theme"
+gem "jekyll-seo-tag"

docs/Gemfile.lock

@@ -0,0 +1,82 @@
+GEM
+ remote: https://rubygems.org/
+ specs:
+ addressable (2.8.5)
+ public_suffix (>= 2.0.2, < 6.0)
+ colorator (1.1.0)
+ concurrent-ruby (1.2.2)
+ em-websocket (0.5.3)
+ eventmachine (>= 0.12.9)
+ http_parser.rb (~> 0)
+ eventmachine (1.2.7)
+ ffi (1.15.5)
+ forwardable-extended (2.6.0)
+ google-protobuf (3.24.0-arm64-darwin)
+ http_parser.rb (0.8.0)
+ i18n (1.14.1)
+ concurrent-ruby (~> 1.0)
+ jekyll (4.3.2)
+ addressable (~> 2.4)
+ colorator (~> 1.0)
+ em-websocket (~> 0.5)
+ i18n (~> 1.0)
+ jekyll-sass-converter (>= 2.0, < 4.0)
+ jekyll-watch (~> 2.0)
+ kramdown (~> 2.3, >= 2.3.1)
+ kramdown-parser-gfm (~> 1.0)
+ liquid (~> 4.0)
+ mercenary (>= 0.3.6, < 0.5)
+ pathutil (~> 0.9)
+ rouge (>= 3.0, < 5.0)
+ safe_yaml (~> 1.0)
+ terminal-table (>= 1.8, < 4.0)
+ webrick (~> 1.7)
+ jekyll-remote-theme (0.4.3)
+ addressable (~> 2.0)
+ jekyll (>= 3.5, < 5.0)
+ jekyll-sass-converter (>= 1.0, <= 3.0.0, != 2.0.0)
+ rubyzip (>= 1.3.0, < 3.0)
+ jekyll-sass-converter (3.0.0)
+ sass-embedded (~> 1.54)
+ jekyll-seo-tag (2.8.0)
+ jekyll (>= 3.8, < 5.0)
+ jekyll-watch (2.2.1)
+ listen (~> 3.0)
+ kramdown (2.4.0)
+ rexml
+ kramdown-parser-gfm (1.1.0)
+ kramdown (~> 2.0)
+ liquid (4.0.4)
+ listen (3.8.0)
+ rb-fsevent (~> 0.10, >= 0.10.3)
+ rb-inotify (~> 0.9, >= 0.9.10)
+ mercenary (0.4.0)
+ pathutil (0.16.2)
+ forwardable-extended (~> 2.6)
+ public_suffix (5.0.3)
+ rake (13.0.6)
+ rb-fsevent (0.11.2)
+ rb-inotify (0.10.1)
+ ffi (~> 1.0)
+ rexml (3.2.6)
+ rouge (4.1.3)
+ rubyzip (2.3.2)
+ safe_yaml (1.0.5)
+ sass-embedded (1.64.2-arm64-darwin)
+ google-protobuf (~> 3.23)
+ terminal-table (3.0.2)
+ unicode-display_width (>= 1.1.1, < 3)
+ unicode-display_width (2.4.2)
+ webrick (1.8.1)
+
+PLATFORMS
+ arm64-darwin-21
+
+DEPENDENCIES
+ jekyll (~> 4.3)
+ jekyll-remote-theme
+ jekyll-seo-tag
+ rake
+
+BUNDLED WITH
+ 2.4.18

docs/_config.yml

@@ -1,3 +1,5 @@
 title: Breeder Genomics Hub
 description: "The Breeder Genomics Hub is a batteries-included JupyterHub distribution for breeders (Pangeo for plant scientists)"
 remote_theme: just-the-docs/just-the-docs
+plugins:
+ - jekyll-remote-theme

docs/_includes/banner/banner.html

@@ -0,0 +1 @@
+<div id="banner" class="banner">{% include banner/content.html %}</div>

docs/_includes/banner/banner_mobile.html

@@ -0,0 +1 @@
+<div id="banner-mobile" class="banner">{% include banner/content.html %}</div>

docs/_includes/banner/content.html

@@ -0,0 +1 @@
+<div id="banner-content">Try the live demo at <a href="#">demo.hub.maizegenetics.net</a> – just log in with your ORCID iD! 🚀</div>

docs/_includes/components/header.html

@@ -0,0 +1,16 @@
+{% include banner/banner.html %}
+<!--
+ Original: https://github.com/just-the-docs/just-the-docs/blob/main/_includes/components/header.html
+ Just added banner
+-->
+<div id="main-header" class="main-header">
+ {% if site.search_enabled != false %}
+ {% include components/search_header.html %}
+ {% else %}
+ <div></div>
+ {% endif %}
+ {% include header_custom.html %}
+ {% if site.aux_links %}
+ {% include components/aux_nav.html %}
+ {% endif %}
+</div>

docs/_includes/components/sidebar.html

@@ -0,0 +1,76 @@
+{% include banner/banner_mobile.html %}
+{% comment %}
+ Original: https://github.com/just-the-docs/just-the-docs/blob/main/_includes/components/sidebar.html
+ Just added banner
+{% endcomment %}
+<div class="side-bar">
+ <div class="site-header" role="banner">
+ <a href="{{ '/' | relative_url }}" class="site-title lh-tight">{% include title.html %}</a>
+ <button id="menu-button" class="site-button btn-reset" aria-label="Toggle menu" aria-pressed="false">
+ <svg viewBox="0 0 24 24" class="icon" aria-hidden="true"><use xlink:href="#svg-menu"></use></svg>
+ </button>
+ </div>
+ <nav aria-label="Main" id="site-nav" class="site-nav">
+ {% assign pages_top_size = site.html_pages
+ | where_exp:"item", "item.title != nil"
+ | where_exp:"item", "item.parent == nil"
+ | where_exp:"item", "item.nav_exclude != true"
+ | size %}
+ {% if pages_top_size > 0 %}
+ {% include nav.html pages=site.html_pages key=nil %}
+ {% endif %}
+ {%- if site.nav_external_links -%}
+ <ul class="nav-list">
+ {%- for node in site.nav_external_links -%}
+ <li class="nav-list-item external">
+ <a href="{{ node.url | absolute_url }}" class="nav-list-link external">
+ {{ node.title }}
+ {% unless node.hide_icon %}<svg viewBox="0 0 24 24" aria-labelledby="svg-external-link-title"><use xlink:href="#svg-external-link"></use></svg>{% endunless %}
+ </a>
+ </li>
+ {%- endfor -%}
+ </ul>
+ {%- endif -%}
+ {% if site.just_the_docs.collections %}
+ {% assign collections_size = site.just_the_docs.collections | size %}
+ {% for collection_entry in site.just_the_docs.collections %}
+ {% assign collection_key = collection_entry[0] %}
+ {% assign collection_value = collection_entry[1] %}
+ {% assign collection = site[collection_key] %}
+ {% if collection_value.nav_exclude != true %}
+ {% if collections_size > 1 or pages_top_size > 0 %}
+ {% if collection_value.nav_fold == true %}
+ <ul class="nav-list nav-category-list">
+ <li class="nav-list-item{% if page.collection == collection_key %} active{% endif %}">
+ {%- if collection.size > 0 -%}
+ <button class="nav-list-expander btn-reset" aria-label="Toggle collection {{ collection_value.name }}" aria-pressed="{% if page.collection == collection_key %}true{% else %}false{% endif %}">
+ <svg viewBox="0 0 24 24" aria-hidden="true"><use xlink:href="#svg-arrow-right"></use></svg>
+ </button>
+ {%- endif -%}
+ <div class="nav-category">{{ collection_value.name }}</div>
+ {% include nav.html pages=collection key=collection_key %}
+ </li>
+ </ul>
+ {% else %}
+ <div class="nav-category">{{ collection_value.name }}</div>
+ {% include nav.html pages=collection key=collection_key %}
+ {% endif %}
+ {% else %}
+ {% include nav.html pages=collection key=collection_key %}
+ {% endif %}
+ {% endif %}
+ {% endfor %}
+ {% endif %}
+ </nav>
+
+ {% capture nav_footer_custom %}
+ {%- include nav_footer_custom.html -%}
+ {% endcapture %}
+ {% if nav_footer_custom != "" %}
+ {{ nav_footer_custom }}
+ {% else %}
+ <footer class="site-footer">
+ This site uses <a href="https://github.com/just-the-docs/just-the-docs">Just the Docs</a>, a documentation theme for Jekyll.
+ </footer>
+ {% endif %}
+</div>

docs/_sass/custom/custom.scss

@@ -0,0 +1,30 @@
+.banner {
+ display: flex;
+ align-items: center;
+ justify-content: center; 
+}
+
+#banner {
+ display: none;
+
+ @include mq(md) {
+ display: flex;
+ border-bottom: 1px solid #eeebee;
+ }
+}
+
+#banner-content {
+ display: inline;
+ vertical-align: middle;
+ text-align: center;
+ padding: 0.5em;
+}
+
+#banner-mobile {
+ display: flex;
+
+ @include mq(md) {
+ display: none;
+ }
+}
+