Do elements

docs/documentation/elements/progress.html

@@ -1,8 +1,18 @@
 ---
 title: Progress Bar
+subtitle: "Native HTML <strong>progress</strong> bars"
 layout: documentation
 doc-tab: elements
 doc-subtab: progress
+breadcrumb:
+- home
+- documentation
+- elements
+- elements-progress
+meta:
+  colors: true
+  sizes: true
+  variables: true
 ---
 
 {% capture progress %}
@@ -25,34 +35,14 @@ doc-subtab: progress
 <progress class="progress is-large" value="60" max="100">60%</progress>
 {% endcapture %}
 
-{% include subnav/subnav-elements.html %}
+{% include snippet.html content=progress %}
 
-<section class="section">
-  <div class="container">
-    <h1 class="title">Progress bars</h1>
-    <h2 class="subtitle">
-      Native HTML <strong>progress</strong> bars
-    </h2>
-    {%
-      include meta.html
-      colors=true
-      sizes=true
-      variables=true
-    %}
+{% include anchor.html name="Colors" %}
 
-    <hr>
+{% include snippet.html content=progress_colors %}
 
-    {% include snippet.html content=progress %}
+{% include anchor.html name="Sizes" %}
 
-    {% include anchor.html name="Colors" %}
+{% include snippet.html content=progress_sizes %}
 
-    {% include snippet.html content=progress_colors %}
-
-    {% include anchor.html name="Sizes" %}
-
-    {% include snippet.html content=progress_sizes %}
-
-    {% include variables.html type='element' %}
-
-  </div>
-</section>
+{% include variables.html type='element' %}