Add rounded documentation

GlenIku · Dec 4, 2017 · 31ec88e · 31ec88e
1 parent 75e9742
commit 31ec88e
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 0 deletions.
diff --git a/docs/documentation/elements/button.html b/docs/documentation/elements/button.html
@@ -65,6 +65,15 @@
 <a class="button is-danger is-inverted is-outlined">Invert Outlined</a>
 {% endcapture %}
 
+{% capture button_rounded_example %}
+<a class="button is-rounded">Rounded</a>
+<a class="button is-primary is-rounded">Rounded</a>
+<a class="button is-link is-rounded">Rounded</a>
+<a class="button is-info is-rounded">Rounded</a>
+<a class="button is-success is-rounded">Rounded</a>
+<a class="button is-danger is-rounded">Rounded</a>
+{% endcapture %}
+
 {% capture button_normal_example %}
 <a class="button">Normal</a>
 <a class="button is-primary">Normal</a>
@@ -533,6 +542,18 @@ <h4 class="subtitle">Invert Outlined (the invert color becomes the text and bord
       </div>
     </div>
 
+    <h4 class="subtitle">Rounded buttons</h4>
+
+    <div class="columns">
+      <div class="column">
+        {% include elements/new-tag.html version="0.6.2" %}
+        {{ button_rounded_example }}
+      </div>
+      <div class="column">
+        {% highlight html %}{{ button_rounded_example }}{% endhighlight %}
+      </div>
+    </div>
+
     {% include anchor.html name="States" %}
 
     <h4 class="subtitle">Normal</h4>

diff --git a/docs/documentation/form/input.html b/docs/documentation/form/input.html
@@ -78,6 +78,10 @@
 </div>
 {% endcapture %}
 
+{% capture rounded_example %}
+<input class="input is-rounded" type="text" placeholder="Rounded input">
+{% endcapture %}
+
 {% capture normal_example %}
 <div class="control">
   <input class="input" type="text" placeholder="Normal input">
@@ -299,6 +303,19 @@ <h2 class="subtitle">
       </div>
     </div>
 
+    {% include anchor.html name="Styles" %}
+
+    {% include elements/new-tag.html version="0.6.2" %}
+
+    <div class="columns">
+      <div class="column is-half">
+        {{ rounded_example }}
+      </div>
+      <div class="column is-half">
+        {% highlight html %}{{ rounded_example }}{% endhighlight %}
+      </div>
+    </div>
+
     {% include anchor.html name="States" %}
 
     <h4 class="subtitle">Normal</h4>

diff --git a/docs/documentation/form/select.html b/docs/documentation/form/select.html
@@ -86,6 +86,15 @@
 </div>
 {% endcapture %}
 
+{% capture rounded_example %}
+<div class="select is-rounded">
+  <select>
+    <option>Rounded dropdown</option>
+    <option>With options</option>
+  </select>
+</div>
+{% endcapture %}
+
 {% capture sizes_example %}
 <div class="field">
   <div class="control">
@@ -325,6 +334,19 @@ <h3 class="title">Multiple select</h3>
       </div>
     </div>
 
+    {% include anchor.html name="Styles" %}
+
+    {% include elements/new-tag.html version="0.6.2" %}
+
+    <div class="columns">
+      <div class="column is-half">
+        {{ rounded_example }}
+      </div>
+      <div class="column is-half">
+        {% highlight html %}{{ rounded_example }}{% endhighlight %}
+      </div>
+    </div>
+
     {% include anchor.html name="Sizes" %}
 
     <div class="columns">