Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-20 20:24:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix #820

Browse Source
This commit is contained in:
Jeremy Thomas
2017-06-27 22:57:13 +01:00
parent b8a7ab2aa3
commit 997042ba8e
7 changed files with 146 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
docs/documentation/elements/form.html
View File

@@ -354,6 +354,87 @@ doc-subtab: form
</div>
</div>
{% capture loading_sizes_example %}
<div class="field">
<p class="control is-small is-loading">
<input class="input is-small" type="text" placeholder="Small loading input">
</p>
</div>
<div class="field">
<p class="control is-loading">
<input class="input" type="text" placeholder="Normal loading input">
</p>
</div>
<div class="field">
<p class="control is-medium is-loading">
<input class="input is-medium" type="text" placeholder="Medium loading input">
</p>
</div>
<div class="field">
<p class="control is-large is-loading">
<input class="input is-large" type="text" placeholder="Large loading input">
</p>
</div>
<div class="field">
<div class="control">
<div class="select is-small is-loading">
<select>
<option>Small loading dropdown</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-loading">
<select>
<option>Normal loading dropdown</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-medium is-loading">
<select>
<option>Medium loading dropdown</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-large is-loading">
<select>
<option>Large loading dropdown</option>
</select>
</div>
</div>
</div>
{% endcapture %}
{% if site.vernum >= 43 %}
<div class="columns">
<div class="column is-half">
<p style="margin-bottom: 0.5rem;">
<span class="tag is-success">New!</span>
<span class="tag is-info">0.4.3</span>
</p>
<div class="content">
<p>
You can resize the loading spinner by appending <code>is-small</code>, <code>is-medium</code> or <code>is-large</code> to the <code>control</code> container.
</p>
</div>
{{loading_sizes_example}}
</div>
<div class="column is-half">
{% highlight html %}
{{loading_sizes_example}}
{% endhighlight %}
</div>
</div>
{% endif %}
<h4 class="subtitle">Disabled</h4>
{% capture disabled_example %}
<div class="field">