Textarea snippets

This commit is contained in:
Jeremy Thomas
2017-08-30 22:33:52 +01:00
parent 695c72c6a9
commit 51866c4182
2 changed files with 39 additions and 94 deletions

View File

@@ -134,23 +134,7 @@ doc-subtab: textarea
<hr>
<div class="content">
<p>The following <strong>modifiers</strong> are supported:</p>
<ul>
<li>the <strong><a href="#input-color">color</a></strong></li>
<li>the <strong><a href="#input-size">size</a></strong></li>
<li>the <strong><a href="#input-state">state</a></strong></li>
</ul>
</div>
<div class="columns">
<div class="column is-half">
{{textarea_example}}
</div>
<div class="column is-half highlight-full">
{% highlight html %}{{textarea_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=textarea_example %}
<div class="content">
<p>
@@ -162,79 +146,33 @@ doc-subtab: textarea
</p>
</div>
<div class="columns">
<div class="column is-half">
{{textarea_rows_example}}
</div>
<div class="column is-half highlight-full">
{% highlight html %}{{textarea_rows_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=textarea_rows_example %}
{% include anchor.html name="Colors" %}
<div class="columns">
<div class="column is-half">
{{colors_example}}
</div>
<div class="column is-half highlight-full">
{% highlight html %}{{colors_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=colors_example %}
{% include anchor.html name="Sizes" %}
<div class="columns">
<div class="column is-half">
{{sizes_example}}
</div>
<div class="column is-half highlight-full">
{% highlight html %}{{sizes_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=sizes_example %}
<hr>
{% include anchor.html name="States" %}
<h3 id="input-state" class="title">States</h3>
<h4 class="subtitle">Normal</h4>
<div class="columns">
<div class="column is-half">
{{normal_example}}
</div>
<div class="column is-half">
{% highlight html %}{{normal_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=normal_example %}
<h4 class="subtitle">Hover</h4>
<div class="columns">
<div class="column is-half">
{{hover_example}}
</div>
<div class="column is-half">
{% highlight html %}{{hover_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=hover_example %}
<h4 class="subtitle">Focus</h4>
<div class="columns">
<div class="column is-half">
{{focus_example}}
</div>
<div class="column is-half">
{% highlight html %}{{focus_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=focus_example %}
<h4 class="subtitle">Loading</h4>
<div class="columns">
<div class="column is-half">
{{loading_example}}
</div>
<div class="column is-half">
{% highlight html %}{{loading_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=loading_example %}
{% if site.vernum >= 43 %}
<div class="columns">
@@ -257,14 +195,8 @@ doc-subtab: textarea
{% endif %}
<h4 class="subtitle">Disabled</h4>
<div class="columns">
<div class="column is-half">
{{disabled_example}}
</div>
<div class="column is-half">
{% highlight html %}{{disabled_example}}{% endhighlight %}
</div>
</div>
{% include snippet.html content=disabled_example %}
</div>
</section>