uswds-jekyll 1.4.1

data/_includes/banner.html

@@ -0,0 +1 @@
+{% include components/banner.html %}

data/_includes/components/banner.html

@@ -0,0 +1,20 @@
+<div class="usa-banner">
+  <div class="usa-accordion">
+    <header class="usa-banner-header">
+      <div class="usa-grid usa-banner-inner"> <img src="{{ site.baseurl }}/assets/uswds/img/favicons/favicon-57.png" alt="U.S. flag">
+        <p>An official website of the United States government</p> <button class="usa-accordion-button usa-banner-button" aria-expanded="false" aria-controls="gov-banner"> <span class="usa-banner-button-text">Here's how you know</span> </button> </div>
+    </header>
+    <div class="usa-banner-content usa-grid usa-accordion-content" id="gov-banner">
+      <div class="usa-banner-guidance-gov usa-width-one-half"> <img class="usa-banner-icon usa-media_block-img" src="{{ site.baseurl }}/assets/uswds/img/icon-dot-gov.svg" alt="Dot gov">
+        <div class="usa-media_block-body">
+          <p> <strong>The .gov means it’s official.</strong> <br> Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you're on a federal government site. </p>
+        </div>
+      </div>
+      <div class="usa-banner-guidance-ssl usa-width-one-half"> <img class="usa-banner-icon usa-media_block-img" src="{{ site.baseurl }}/assets/uswds/img/icon-https.svg" alt="Https">
+        <div class="usa-media_block-body">
+          <p> <strong>The site is secure.</strong> <br> The <strong>https://</strong> ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely. </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

data/_includes/components/footer.html

@@ -0,0 +1,71 @@
+{% if footer %}
+<footer class="usa-footer usa-footer-medium" role="contentinfo">
+
+  {% if footer.top %}
+  <div class="usa-grid usa-footer-return-to-top">
+    <a href="{{ footer.top.href | default: '#' }}">{{ footer.top.text | default: 'Return to top' }}</a>
+  </div>
+  {% endif %}
+
+  {% if footer.links %}
+    {% assign footer_links = site.data.navigation[footer.links] | default: footer.links %}
+    {% assign _sizes = 'whole half third fourth sixth' | split: ' ' %}
+    {% assign _size = footer_links.size | minus: 1 %}
+    {% assign _size = _sizes[_size] | default: 'whole' %}
+  <div class="usa-footer-primary-section">
+    <div class="usa-grid">
+      <nav class="usa-footer-nav">
+        <ul class="usa-unstyled-list">
+          {% for _link in footer_links %}
+          <li class="usa-width-one-{{ _size }} usa-footer-primary-content">
+            <a class="usa-footer-primary-link" href="{% if _link.external == true %}{{ _link.href }}{% else %}{{ _link.href | relative_url }}{% endif %}">
+              {{ _link.text }}
+            </a>
+          </li>
+          {% endfor %}
+        </ul>
+      </nav>
+    </div>
+  </div>
+  {% endif %}
+
+  {% if footer.contact %}
+  <div class="usa-footer-secondary_section">
+    <div class="usa-grid">
+      <div class="usa-footer-logo usa-width-one-half">
+        {% for logo in footer.logos -%}
+          {% if logo.url %}<a href="{{ logo.url }}">{% endif %}
+        <img class="usa-footer-logo-img" src="{{ logo.src | relative_url }}" alt="{{ logo.alt }}"
+          {% if logo.width %}width="{{ logo.width }}"{% endif %}
+          {% if logo.height %}height="{{ logo.height }}"{% endif %}>
+          {% if logo.url %}</a>{% endif %}
+        {% endfor %}
+        {% if footer.heading %}
+        <h3 class="usa-footer-logo-heading">{{ footer.heading }}</h3>
+        {% endif %}
+      </div>
+      <div class="usa-footer-contact-links usa-width-one-half">
+
+        {% assign contact_links = site.data.navigation[footer.contact.links] | default: footer.contact.links %}
+        {% for _link in contact_links %}
+        <a class="usa-link-{{ _link.type | default: 'generic' }}" href="{% if _link.external == true %}{{ _link.href }}{% else %}{{ _link.href | relative_url }}{% endif %}">
+          <span>{{ _link.text }}</span>
+        </a>
+        {% endfor %}
+
+        {% if footer.contact.address %}
+        <address>
+          {% if footer.contact.heading %}
+          <h3 class="usa-footer-contact-heading">{{ footer.contact.heading }}</h3>
+          {% endif %}
+          {{ footer.contact.address | markdownify }}
+        </address>
+        {% endif %}
+
+      </div>
+    </div>
+  </div>
+  {% endif %}
+
+</footer>
+{% endif %}

data/_includes/components/graphic-list.html

@@ -0,0 +1,16 @@
+{% assign graphics = include.graphics %}
+{% if graphics %}
+<section class="usa-section usa-section-dark usa-graphic_list">
+  {% for graphic in graphics %}
+    {% cycle '<div class="usa-grid usa-graphic_list-row">', '' %}
+    <div class="usa-width-one-half usa-media_block">
+      <img class="usa-media_block-img"  src="{{ graphic.image.src | relative_url }}" alt="{{ graphic.image.alt }}">
+      <div class="usa-media_block-body">
+        {% if graphic.title %}<h3>{{ graphic.title }}</h3>{% endif %}
+        {{ graphic.description | markdownify }}
+      </div>
+    </div>
+    {% cycle '', '</div>' %}
+  {% endfor %}
+</section>
+{% endif %}

data/_includes/components/header--basic.html

@@ -0,0 +1,72 @@
+{% if header %}
+<header class="usa-header usa-header-basic" role="banner">
+  {% include banner.html %}
+  <div class="usa-nav-container">
+    <div class="usa-navbar">
+      <button class="usa-menu-btn">Menu</button>
+      <div class="usa-logo" id="logo">
+        <em class="usa-logo-text">
+          <a href="{% if header.href %}{{ header.href }}{% else %}{{ site.baseurl }}/{% endif %}" title="Home">
+            {{ header.title | default: site.title }}
+          </a>
+        </em>
+      </div>
+    </div>
+
+    <nav role="navigation" class="usa-nav">
+      <div class="usa-nav-inner">
+        <button class="usa-nav-close">
+          <img src="{{ site.baseurl }}/assets/uswds/img/close.svg" alt="close">
+        </button>
+
+        {% assign _primary = header.primary.links %}
+        {% assign primary_links = site.data.navigation[_primary] | default: _primary %}
+        {% if primary_links %}
+        <ul class="usa-nav-primary usa-accordion">
+          {% for _section in primary_links %}
+          <li>
+            {% if _section.links %}
+              {% assign section_links = site.data.navigation[_section.links] | default: _section.links %}
+              {% assign _section_id = _section.id %}
+              {% unless _section_id %}{% assign _section_id = 'nav-' | append: forloop.index %}{% endunless %}
+            <button class="usa-accordion-button usa-nav-link" aria-expanded="false" aria-controls="{{ _section_id }}">
+              <span>{{ _section.text }}</span>
+            </button>
+            <ul id="{{ _section_id }}" class="usa-nav-submenu">
+              {% for _link in section_links %}
+              <li>
+                <a href="{% if _link.external == true %}{{ _link.href }}{% else %}{{ _link.href | relative_url }}{% endif %}">{{ _link.text }}</a>
+              </li>
+              {% endfor %}
+            </ul>
+            {% else %}
+            <a class="usa-nav-link{% if _section.href == page.permalink %} usa-current{% endif %}" href="{% if _section.external == true %}{{ _section.href }}{% else %}{{ _section.href | relative_url }}{% endif %}">
+              <span>{{ _section.text }}</span>
+            </a>
+            {% endif %}
+          </li>
+          {% endfor %}
+        </ul>
+        {% endif %}
+
+        {% assign _secondary = header.secondary %}
+
+
+          {% if _secondary.search %}
+          <div class="usa-search usa-search-small" role="search">
+            <form action="{{ _secondary.search.action | relative_url }}">
+                <label class="usa-sr-only" for="search-field-small">Search small</label>
+                <input id="search-field-small" type="search" name="{{ _secondary.search.query | default: 'search' }}">
+                <button type="submit">
+                  <span class="usa-sr-only">Search</span>
+                </button>
+            </form>
+          </div>
+          {% endif %}
+        </div>
+      </div>
+    </nav>
+  </div>
+</header>
+<div class="usa-overlay"></div>
+{% endif %}

data/_includes/components/header--extended.html

@@ -0,0 +1,85 @@
+{% if header %}
+<header class="usa-header usa-header-extended" role="banner">
+  {% include banner.html %}
+  <div class="usa-navbar">
+    <button class="usa-menu-btn">Menu</button>
+    <div class="usa-logo" id="logo">
+      <em class="usa-logo-text">
+        <a href="{% if header.href %}{{ header.href }}{% else %}{{ site.baseurl }}/{% endif %}" title="Home">
+          {{ header.title | default: site.title }}
+        </a>
+      </em>
+    </div>
+  </div>
+
+  <nav role="navigation" class="usa-nav">
+    <div class="usa-nav-inner">
+      <button class="usa-nav-close">
+        <img src="{{ site.baseurl }}/assets/uswds/img/close.svg" alt="close">
+      </button>
+
+      {% assign _primary = header.primary.links %}
+      {% assign primary_links = site.data.navigation[_primary] | default: _primary %}
+      {% if primary_links %}
+      <ul class="usa-nav-primary usa-accordion">
+        {% for _section in primary_links %}
+        <li>
+          {% if _section.links %}
+            {% assign section_links = site.data.navigation[_section.links] | default: _section.links %}
+            {% assign _section_id = _section.id %}
+            {% unless _section_id %}{% assign _section_id = 'nav-' | append: forloop.index %}{% endunless %}
+          <button class="usa-accordion-button usa-nav-link" aria-expanded="false" aria-controls="{{ _section_id }}">
+            <span>{{ _section.text }}</span>
+          </button>
+          <ul id="{{ _section_id }}" class="usa-nav-submenu">
+            {% for _link in section_links %}
+            <li>
+              <a href="{% if _link.external == true %}{{ _link.href }}{% else %}{{ _link.href | relative_url }}{% endif %}">{{ _link.text }}</a>
+            </li>
+            {% endfor %}
+          </ul>
+          {% else %}
+          <a class="usa-nav-link{% if _section.href == page.permalink %} usa-current{% endif %}" href="{% if _section.external == true %}{{ _section.href }}{% else %}{{ _section.href | relative_url }}{% endif %}">
+            <span>{{ _section.text }}</span>
+          </a>
+          {% endif %}
+        </li>
+        {% endfor %}
+      </ul>
+      {% endif %}
+
+      {% assign _secondary = header.secondary %}
+      {% if _secondary %}
+      <div class="usa-nav-secondary">
+        {% if _secondary.search %}
+          <form action="{{ _secondary.search.action | relative_url }}" class="usa-search usa-search-small js-search-form">
+          <div role="search">
+            <label class="usa-sr-only" for="search-field">Search small</label>
+            <input id="search-input" type="search" name="{{ _secondary.search.query | default: 'search' }}">
+            <button type="submit">
+              <span class="usa-sr-only">Search</span>
+            </button>
+          </div>
+        </form>
+        {% endif %}
+        <ul class="usa-unstyled-list usa-nav-secondary-links">
+          {% if _secondary.search %}
+          <li class="js-search-button-container">
+            <button class="usa-header-search-button js-search-button">Search</button>
+          </li>
+          {% endif %}
+          {% assign secondary_links = site.data.navigation[_secondary.links] | default: _secondary.links %}
+          {% for _link in secondary_links %}
+          <li>
+            <a href="{% if _link.external == true %}{{ _link.href }}{% else %}{{ _link.href | relative_url }}{% endif %}">{{ _link.text }}</a>
+          </li>
+          {% endfor %}
+        </ul>
+      </div>
+      {% endif %}
+
+    </div>
+  </nav>
+</header>
+<div class="usa-overlay"></div>
+{% endif %}

data/_includes/components/hero.html

@@ -0,0 +1,32 @@
+{% if hero %}
+<section class="usa-hero"{% if hero.image %}
+  style="background-image: url('{{ hero.image | relative_url }}')"{% endif %}>
+  <div class="usa-grid">
+    <div class="usa-hero-callout usa-section-dark">
+      {% if hero.callout %}
+      <h2>
+        {% if hero.callout.alt %}
+        <span class="usa-hero-callout-alt">{{ hero.callout.alt }}</span>
+        {% endif %}
+        {{ hero.callout.text | default: hero.callout }}
+      </h2>
+      {% endif %}
+
+      {% if hero.link %}
+      <a class="usa-hero-link" href="{{ hero.link.href | relative_url }}">
+        {{ hero.link.text }}
+      </a>
+      {% endif %}
+
+      {{ hero.content | markdownify }}
+
+      {% if hero.button %}
+      <a class="usa-button usa-button-big usa-button-secondary"
+        href="{{ hero.button.href | relative_url }}">
+        {{ hero.button.text }}
+      </a>
+      {% endif %}
+    </div>
+  </div>
+</section>
+{% endif %}

data/_includes/favicon.html

@@ -0,0 +1,5 @@
+{% for icon in site.data.favicons %}
+<link rel="{{ icon.rel | default: 'icon' }}" type="{{ icon.type }}"
+  {% if icon.sizes -%}sizes="{{ icon.sizes }}"
+  {% endif %}href="{{ icon.href | relative_url }}">
+{% endfor %}

data/_includes/footer.html

@@ -0,0 +1,2 @@
+{% assign footer = site.data.footer %}
+{% include components/footer.html %}

data/_includes/graphic-list.html

@@ -0,0 +1,2 @@
+{% assign graphics = include.graphics %}
+{% include components/graphic-list.html %}

data/_includes/header.html

@@ -0,0 +1,7 @@
+{% assign header = site.data.header %}
+
+{% if header.type == 'basic' %}
+  {% include components/header--basic.html %}
+{% else %}
+  {% include components/header--extended.html %}
+{% endif %}

data/_includes/meta.html

@@ -0,0 +1,6 @@
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta charset="utf-8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+<title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}</title>
+{% include favicon.html %}

data/_includes/scripts.html

@@ -0,0 +1,21 @@
+{% assign _scripts = '' | split: '' %}
+{% assign _async_marker = 'uswds_async=true' %}
+{% assign _site_scripts = site.scripts %}
+{% unless _site_scripts -%}
+  {% assign _uswds_js = '/assets/uswds/js/uswds.min.js' | append: '?' | append: _async_marker %}
+  {% assign _site_scripts = '' | split: ''
+    | push: _uswds_js %}
+{% endunless %}
+{% assign _scripts = _scripts
+  | push: _site_scripts
+  | push: layout.scripts
+  | push: page.scripts
+  | uniq %}
+{% for _list in _scripts %}{% for _script in _list %}
+  {% assign _src = _script.src | default: _script %}
+<script src="{{ _src | replace: _async_marker, '' | relative_url }}"{% if _script.async or _src contains _async_marker %} async{% endif %}></script>
+{% endfor %}{% endfor %}
+
+{% if page.layout == 'search-results' %}
+{% jekyll_pages_api_search_load %}
+{% endif %}

data/_includes/sidenav.html

@@ -0,0 +1,20 @@
+<ul class="usa-sidenav-list">
+  {% for link in include.links %}
+    {% assign _href = link.href %}
+    {% assign _current = false %}
+    {% if link.href == page.url or link.href == page.permalink %}
+      {% assign _current = true %}
+    {% endif %}
+  <li>
+    <a href="{% if link.external == true %}{{ link.href }}{% else %}{{ link.href | relative_url }}{% endif %}" {% if _current %}
+      class="usa-current"{% endif %}>
+      {{ link.text }}
+    </a>
+    {% if _current and page.subnav %}
+    <ul class="usa-sidenav-sub_list">
+      {% include subnav.html links=page.subnav %}
+    </ul>
+    {% endif %}
+  </li>
+  {% endfor %}
+</ul>

data/_includes/skipnav.html

@@ -0,0 +1 @@
+<a class="usa-skipnav" href="#main-content">Skip to main content</a>

data/_includes/styles.html

@@ -0,0 +1,17 @@
+{% assign _styles = '' | split: '' %}
+{% assign _site_styles = site.styles %}
+{% unless _site_styles -%}
+  {% assign _uswds_css = '/assets/uswds/css/uswds.min.css' %}
+  {% assign _site_styles = '' | split: ''
+    | push: _uswds_css %}
+{% endunless %}
+{% assign _styles = _styles
+  | push: _site_styles
+  | push: layout.styles
+  | push: page.styles
+  | uniq %}
+{% for _list in _styles %}{% for _style in _list %}
+<link rel="stylesheet"
+  href="{{ _style.href | default: _style | relative_url }}"
+  media="{{ _style.media | default: 'screen' }}">
+{% endfor %}{% endfor %}

data/_includes/subnav.html

@@ -0,0 +1,5 @@
+{% for link in include.links %}
+  <li>
+    <a href="{% if link.external == true %}{{ link.href }}{% else %}{{ link.href | relative_url }}{% endif %}">{{ link.text }}</a>
+  </li>
+{% endfor %}

data/_layouts/base.html

@@ -0,0 +1,21 @@
+---
+---
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: 'en-US' }}">
+  <head>
+    {% include meta.html %}
+    {% include styles.html %}
+  </head>
+  <body class="{{ layout.class }} {{ page.class }}">
+
+    {% include skipnav.html %}
+    {% include header.html %}
+
+    <main id="main-content"{% for _attr in layout.main %} {{ _attr[0] }}="{{ _attr[1] }}"{% endfor %}>
+    {{ content }}
+    </main>
+
+    {% include footer.html %}
+    {% include scripts.html %}
+  </body>
+</html>

data/_layouts/docs.html

@@ -0,0 +1,19 @@
+---
+layout: base
+main:
+  class: usa-grid usa-section usa-content usa-layout-docs
+---
+{% assign sidenav = site.data.navigation[page.sidenav] | default: page.sidenav %}
+{% if sidenav %}
+<aside class="usa-width-one-fourth usa-layout-docs-sidenav">
+  {% include sidenav.html links=sidenav %}
+</aside>
+
+<div class="usa-width-three-fourths usa-layout-docs-main_content">
+  {{ content }}
+</div>
+{% else %}
+<div class="usa-layout-docs-main_content">
+  {{ content }}
+</div>
+{% endif %}