Add bd classes

This commit is contained in:
Jeremy Thomas
2017-08-14 12:44:24 +01:00
parent 88fb510d93
commit cd2f886df2
66 changed files with 1184 additions and 2456 deletions

View File

@@ -1096,7 +1096,7 @@ doc-subtab: form
<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>
<div class="example">
<div class="bd-example">
{{addons_example}}
</div>
{% highlight html %}{{addons_example}}{% endhighlight %}
@@ -1112,7 +1112,7 @@ doc-subtab: form
<p>It can be useful to append a <a href="{{site.url}}/documentation/elements/button#static-button">static button</a>.</p>
</div>
<div class="example">
<div class="bd-example">
{{addons_static_example}}
</div>
{% highlight html %}{{addons_static_example}}{% endhighlight %}
@@ -1120,7 +1120,7 @@ doc-subtab: form
<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>
<div class="example">
<div class="bd-example">
{{addons_expanded_example}}
</div>
{% highlight html %}{{addons_expanded_example}}{% endhighlight %}
@@ -1128,7 +1128,7 @@ doc-subtab: form
<div class="content">
<p>If you want a full width select dropdown, pair <code>control is-expanded</code> with <code>select is-fullwidth</code>.</p>
</div>
<div class="example">
<div class="bd-example">
{{addons_expanded_fullwidth_example}}
</div>
{% highlight html %}{{addons_expanded_fullwidth_example}}{% endhighlight %}
@@ -1136,11 +1136,11 @@ doc-subtab: form
<div class="content">
<p>Use the <code>has-addons-centered</code> or the <code>has-addons-right</code> modifers to alter the <strong>alignment</strong>.</p>
</div>
<div class="example">
<div class="bd-example">
{{addons_center_example}}
</div>
{% highlight html %}{{addons_center_example}}{% endhighlight %}
<div class="example">
<div class="bd-example">
{{addons_right_example}}
</div>
{% highlight html %}{{addons_right_example}}{% endhighlight %}
@@ -1158,7 +1158,7 @@ doc-subtab: form
Add the <code>is-expanded</code> modifier on the control element you want to <strong>fill up the remaining space</strong>.
</p>
</div>
<div class="example">
<div class="bd-example">
{{group_example}}
</div>
{% highlight html %}{{group_example}}{% endhighlight %}
@@ -1178,7 +1178,7 @@ doc-subtab: form
</ul>
<p>You can of course use <code>is-grouped</code> or <code>has-addons</code> for the child elements.</p>
</div>
<div class="example">
<div class="bd-example">
{{horizontal_form_example}}
</div>
{% highlight html %}{{horizontal_form_example}}{% endhighlight %}
@@ -1205,7 +1205,7 @@ doc-subtab: form
</li>
</ul>
</div>
<div class="example">
<div class="bd-example">
{{field_label_example}}
</div>
{% highlight html %}{{field_label_example}}{% endhighlight %}