<commit_before><%- 
  heading_class ||= "heading-two"
  list_class ||= ""
  show_descriptions ||= false
-%>

<h2 class="<%= heading_class -%>">Introduction</h2>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/getting_started_intro">What is Ornament?</a></li>
  <li><a href="/styleguide/generating_ornament">Generating Ornament</a></li>
  <li><a href="https://github.com/katalyst/ornament/wiki/CSS-Styleguide-and-Coding-Standards">S/CSS Styleguide and Coding Standards</a></li>
  <li><a href="/styleguide/sample_content">Sample Content Page</a></li>
  <li><a href="/styleguide/jquery_ui">jQuery UI Support</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">Dynamic application layout</h2>
<%- if show_descriptions -%>
  <p>Learn how to take advantage of the out-of-the-box application template.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/seo">SEO, meta tags and social</a></li>
  <li><a href="/styleguide/layout_sidebar_left">Sidebar left</a></li>
  <li><a href="/styleguide/layout_sidebar_right">Sidebar right</a></li>
  <li><a href="/styleguide/layout_above_below">Above and below page</a></li>
  <li><a href="/styleguide/flash">Flash Messages</a></li>
  <li><a href="/styleguide/layout_yields">Other default yields</a></li>
  <li><a href="/styleguide/layout_helpers">Rails Helpers</a></li>
  <li><a href="/styleguide/environment">Environment</a></li>
  <li><a href="/styleguide/skip_link">Skip Link</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">CSS components</h2>
<%- if show_descriptions -%>
  <p>Quickly make things look nice using only the power of classes and some premade, copy-and-paste-friendly markup.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/align">Align</a></li>
  <li><a href="/styleguide/blankstate">Blankstate</a></li>
  <li><a href="/styleguide/button">Button</a></li>
  <li><a href="/styleguide/card">Card</a></li>
  <li><a href="/styleguide/fixed_footer">Fixed Footer</a></li>
  <li><a href="/styleguide/heading_with_button">Heading with Button</a></li>
  <li><a href="/styleguide/navigation">Navigation</a></li>
  <li><a href="/styleguide/nested_link">Nested Link</a></li>
  <li><a href="/styleguide/pagination">Pagination</a></li>
  <li><a href="/styleguide/panel">Panel</a></li>
  <li><a href="/styleguide/embed">Responsive Embeds</a></li>
  <li><a href="/styleguide/table">Table</a></li>
  <li><a href="/styleguide/typography">Typography and Spacing</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">SASS utilities</h2>
<%- if show_descriptions -%>
  <p>Take advantage of SASS mixins to speed up CSS development.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/container">Container</a></li>
  <li><a href="/styleguide/flex">Flexbox</a></li>
  <li><a href="/styleguide/grunticons">Grunticons</a></li>
  <li><a href="/styleguide/lists">List mixins</a></li>
  <li><a href="/styleguide/media_queries">Media Queries</a></li>
  <li><a href="/styleguide/overlay">Overlay</a></li>
  <li><a href="/styleguide/spang">Spang - Responsive grids</a></li>
</ul>  

<hr />

<h2 class="<%= heading_class -%>">JS utilities</h2>
<%- if show_descriptions -%>
  <p>Add data attributes to enhance your page with basic javascript behaviours.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/js_helpers">Ornament JS Helpers</a></li>
  <li><a href="/styleguide/conformjs">ConformJS</a></li>
  <li><a href="/styleguide/event-tracking">Event Tracking</a></li>
  <li><a href="/styleguide/showjs">ShowJS</a></li>
  <li><a href="/styleguide/select_link">&lt;select> links</a></li>
  <li><a href="/styleguide/shifty">ShiftyJS</a></li>
  <li><a href="/styleguide/transition_toggle">Transition Toggle</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">Components</h2>
<%- if show_descriptions -%>
  <p>Complex components that come with their own CSS and JS.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/flexible_input">Flexible Input</a></li>
  <li><a href="/styleguide/form">Form</a></li>
  <li><a href="/styleguide/form_upload">Form - Image Uploader</a></li>
  <li><a href="/styleguide/fotorama">Fotorama - Slider and Galleries</a></li>
  <li><a href="/styleguide/lightbox">Lightbox</a></li>
  <li><a href="/styleguide/map">Map</a></li>
  <li><a href="/styleguide/menu_aim">Menu Aim</a></li>
  <li><a href="/styleguide/menu_with_more">Menu With More</a></li>
  <li><a href="/styleguide/object_slider">Object Slider</a></li>
  <li><a href="/styleguide/read_more">Read more</a></li>
  <li><a href="/styleguide/selector">Selector</a></li>
  <li><a href="/styleguide/tabs">Tabs</a></li>
  <li><a href="/styleguide/toggle">Toggle</a></li>
  <li><a href="/styleguide/tooltip">Tooltip</a></li>
  <li><a href="/styleguide/tray_navigation">Tray Navigation</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">Developer resources</h2>
<ul class="<%= list_class -%>">
  <li><a href="https://github.com/katalyst/ornament/projects/1" target="_blank">Development board</a></li><commit_msg>Swapped styleguide navigation of js utilities and sass utilities as js utilities should be near css components since they are both applied with just html attributes<commit_after><%- 
  heading_class ||= "heading-two"
  list_class ||= ""
  show_descriptions ||= false
-%>

<h2 class="<%= heading_class -%>">Introduction</h2>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/getting_started_intro">What is Ornament?</a></li>
  <li><a href="/styleguide/generating_ornament">Generating Ornament</a></li>
  <li><a href="https://github.com/katalyst/ornament/wiki/CSS-Styleguide-and-Coding-Standards">S/CSS Styleguide and Coding Standards</a></li>
  <li><a href="/styleguide/sample_content">Sample Content Page</a></li>
  <li><a href="/styleguide/jquery_ui">jQuery UI Support</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">Dynamic application layout</h2>
<%- if show_descriptions -%>
  <p>Learn how to take advantage of the out-of-the-box application template.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/seo">SEO, meta tags and social</a></li>
  <li><a href="/styleguide/layout_sidebar_left">Sidebar left</a></li>
  <li><a href="/styleguide/layout_sidebar_right">Sidebar right</a></li>
  <li><a href="/styleguide/layout_above_below">Above and below page</a></li>
  <li><a href="/styleguide/flash">Flash Messages</a></li>
  <li><a href="/styleguide/layout_yields">Other default yields</a></li>
  <li><a href="/styleguide/layout_helpers">Rails Helpers</a></li>
  <li><a href="/styleguide/environment">Environment</a></li>
  <li><a href="/styleguide/skip_link">Skip Link</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">CSS components</h2>
<%- if show_descriptions -%>
  <p>Quickly make things look nice using only the power of classes and some premade, copy-and-paste-friendly markup.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/align">Align</a></li>
  <li><a href="/styleguide/blankstate">Blankstate</a></li>
  <li><a href="/styleguide/button">Button</a></li>
  <li><a href="/styleguide/card">Card</a></li>
  <li><a href="/styleguide/fixed_footer">Fixed Footer</a></li>
  <li><a href="/styleguide/heading_with_button">Heading with Button</a></li>
  <li><a href="/styleguide/navigation">Navigation</a></li>
  <li><a href="/styleguide/nested_link">Nested Link</a></li>
  <li><a href="/styleguide/pagination">Pagination</a></li>
  <li><a href="/styleguide/panel">Panel</a></li>
  <li><a href="/styleguide/embed">Responsive Embeds</a></li>
  <li><a href="/styleguide/table">Table</a></li>
  <li><a href="/styleguide/typography">Typography and Spacing</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">JS utilities</h2>
<%- if show_descriptions -%>
  <p>Add <code>data-*</code> attributes to enhance your page with basic javascript behaviours.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/js_helpers">Ornament JS Helpers</a></li>
  <li><a href="/styleguide/conformjs">ConformJS</a></li>
  <li><a href="/styleguide/event-tracking">Event Tracking</a></li>
  <li><a href="/styleguide/showjs">ShowJS</a></li>
  <li><a href="/styleguide/select_link">&lt;select> links</a></li>
  <li><a href="/styleguide/shifty">ShiftyJS</a></li>
  <li><a href="/styleguide/transition_toggle">Transition Toggle</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">SASS utilities</h2>
<%- if show_descriptions -%>
  <p>Take advantage of SASS mixins to speed up CSS development.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/container">Container</a></li>
  <li><a href="/styleguide/flex">Flexbox</a></li>
  <li><a href="/styleguide/grunticons">Grunticons</a></li>
  <li><a href="/styleguide/lists">List mixins</a></li>
  <li><a href="/styleguide/media_queries">Media Queries</a></li>
  <li><a href="/styleguide/overlay">Overlay</a></li>
  <li><a href="/styleguide/spang">Spang - Responsive grids</a></li>
</ul>  

<hr />

<h2 class="<%= heading_class -%>">Components</h2>
<%- if show_descriptions -%>
  <p>Complex components that come with their own CSS and JS.</p>
<%- end -%>
<ul class="<%= list_class -%>">
  <li><a href="/styleguide/flexible_input">Flexible Input</a></li>
  <li><a href="/styleguide/form">Form</a></li>
  <li><a href="/styleguide/form_upload">Form - Image Uploader</a></li>
  <li><a href="/styleguide/fotorama">Fotorama - Slider and Galleries</a></li>
  <li><a href="/styleguide/lightbox">Lightbox</a></li>
  <li><a href="/styleguide/map">Map</a></li>
  <li><a href="/styleguide/menu_aim">Menu Aim</a></li>
  <li><a href="/styleguide/menu_with_more">Menu With More</a></li>
  <li><a href="/styleguide/object_slider">Object Slider</a></li>
  <li><a href="/styleguide/read_more">Read more</a></li>
  <li><a href="/styleguide/selector">Selector</a></li>
  <li><a href="/styleguide/tabs">Tabs</a></li>
  <li><a href="/styleguide/toggle">Toggle</a></li>
  <li><a href="/styleguide/tooltip">Tooltip</a></li>
  <li><a href="/styleguide/tray_navigation">Tray Navigation</a></li>
</ul>

<hr />

<h2 class="<%= heading_class -%>">Developer resources</h2>
<ul class="<%= list_class -%>">
  <li><a href="https://github.com/katalyst/ornament/projects/1" target="_blank">Development board</a></li>
{'fraction_non_alphanumeric': 0.23664789279471743, 'fraction_numerical': 0.0029131870266071083, 'mean_word_length': 5.1818727490996395, 'pattern_counts': {'":': 0, '<': 597, '<?xml version=': 0, '>': 599, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3638789', 'n_tokens_mistral': 4014, 'n_tokens_neox': 4016, 'n_words': 652}