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

Fix #759

Browse Source
This commit is contained in:
Jeremy Thomas
2017-05-28 16:07:29 +01:00
parent c7d4f806de
commit eb3fd3bc66
5 changed files with 80 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
docs/documentation/elements/button.html
View File

@@ -232,6 +232,35 @@ doc-subtab: button
<div class="column">
{% highlight html %}
{{button_loading_example}}
{% endhighlight %}
</div>
</div>
<p id="static-button" style="margin-bottom: 0.5rem;">
<span class="tag is-success">New!</span>
<span class="tag is-info">0.4.2</span>
</p>
<h4 class="subtitle">
Static
</h4>
{% capture button_static_example %}
<span class="button is-static">Static</span>
{% endcapture %}
<div class="columns">
<div class="column">
<div class="content">
<p>
You can create a <strong>non-interactive button</strong> by using the <code>is-static</code> modifier. This is useful to align a text label with an input, for example when using <a href="{{site.url}}/documentation/elements/form#form-addons">form addons</a>.
</p>
</div>
{{button_static_example}}
</div>
<div class="column">
{% highlight html %}
{{button_static_example}}
{% endhighlight %}
</div>
</div>

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

@@ -696,7 +696,7 @@ doc-subtab: form
<hr>
<h3 class="title">Form addons</h3>
<h3 id="form-addons" class="title">Form addons</h3>
<div class="content">
<p>If you want to <strong>attach</strong> controls together, use the <code>has-addons</code> modifier on the <code>control</code> container:</p>
</div>
@@ -720,6 +720,37 @@ doc-subtab: form
{% endhighlight %}
<div class="content">
<p>You can attach inputs, buttons, and dropdowns <strong>only</strong>.</p>
</div>
<p style="margin-bottom: 0.5rem;">
<span class="tag is-success">New!</span>
<span class="tag is-info">0.4.2</span>
</p>
<div class="content">
<p>It can be useful to append a <a href="{{site.url}}/documentation/elements/button#static-button">static button</a>.</p>
</div>
{% capture addons_static_example %}
<div class="field has-addons">
<p class="control">
<input class="input" type="text" placeholder="Your email">
</p>
<p class="control">
<a class="button is-static">
@gmail.com
</a>
</p>
</div>
{% endcapture %}
<div class="example">
{{addons_static_example}}
</div>
{% highlight html %}
{{addons_static_example}}
{% endhighlight %}
<div class="content">
<p>Use the <code>is-expanded</code> modifier on the element you want to fill up the remaining space (in this case, the input):</p>
</div>
{% capture addons_expanded_example %}