index.html

---
description: Jekyll outline plugin demo
layout: default
title: Front Page
---
<style>
  #stuff {
    background-color: #095e2e;
    font-family: "Helvetica Neue", Helvetica, Arial, serif;
    color: white;
    padding-left: 1em;
  }
</style>

<!-- #region Stuff: title & description Sorted By Order -->
<h2 id="stuff">Stuff: title &amp; description Sorted By Order</h2>
{% outline attribution fields="<b> title </b> &ndash; <i> description </i>" stuff %}
  0: A Topic 0..19
020: A Topic 20..39
040: A Topic 40..
{% endoutline %}
<!-- endregion -->


<!-- #region Stuff: title & description Sorted By Title -->
<h2 id="stuff">Stuff: title &amp; description Sorted By Title</h2>
{% outline attribution sort_by_title fields="<b> title </b> &ndash; <i> description </i>" stuff %}
000: B Topic 0..19
020: B Topic 20..39
040: B Topic 40..
{% endoutline %}

<div style="display: none">
  {% img align="right" id="outline_0"
    src="/assets/images/porcelain_washbasin.webp"
    size="eighthsize"
    style="margin-top: 0"
    wrapper_class="clear"
  %}
  {% img align="right" id="outline_20"
    src="/assets/images/pipes.webp"
    size="eighthsize"
    style="margin-top: 0"
    wrapper_class="clear"
  %}
  {% img
    align="right"
    class=''
    id="outline_40"
    src="/assets/images/libgit2.webp"
    size="20%"
    style="margin-top: 0; padding: 1em;"
    wrapper_class="clear"
  %}
</div>
<!-- endregion -->


<!-- #region Error: Invalid YAML -->
<h2 id="stuff">Error: Invalid YAML</h2>
<p>
  The following should generate a <code>JekyllSupport::OutlineError</code> because there are missing colons.
</p>
{% outline attribution fields="<b> title </b> &ndash; <i> description </i>" stuff %}
   0 A Topic 0..19
 020 A Topic 20..39
 040 A Topic 40..
{% endoutline %}
<!-- endregion -->


{% outline_js wrap_in_script_tag %}