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

@@ -993,7 +993,7 @@ doc-subtab: general
<div class="content">
<p>If you want to <strong>attach controls</strong> together, use the <code>has-addons</code> modifier on the <code>field</code> container:</p>
</div>
<div class="example">
<div class="bd-example">
{{addons_example}}
</div>
{% highlight html %}{{addons_example}}{% endhighlight %}
@@ -1009,7 +1009,7 @@ doc-subtab: general
<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 %}
@@ -1017,7 +1017,7 @@ doc-subtab: general
<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 %}
@@ -1025,7 +1025,7 @@ doc-subtab: general
<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 %}
@@ -1033,11 +1033,11 @@ doc-subtab: general
<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 %}
@@ -1051,7 +1051,7 @@ doc-subtab: general
</p>
</div>
<div class="example">
<div class="bd-example">
{{group_example}}
</div>
{% highlight html %}{{group_example}}{% endhighlight %}
@@ -1061,12 +1061,12 @@ doc-subtab: general
</p>
</div>
<div class="example">
<div class="bd-example">
{{group_centered_example}}
</div>
{% highlight html %}{{group_centered_example}}{% endhighlight %}
<div class="example">
<div class="bd-example">
{{group_right_example}}
</div>
{% highlight html %}{{group_right_example}}{% endhighlight %}
@@ -1077,7 +1077,7 @@ doc-subtab: general
</p>
</div>
<div class="example">
<div class="bd-example">
{{group_expanded_example}}
</div>
{% highlight html %}{{group_expanded_example}}{% endhighlight %}
@@ -1094,7 +1094,7 @@ doc-subtab: general
<div class="columns">
<div class="column is-half">
<div class="example">
<div class="bd-example">
{{group_multiline_example}}
</div>
</div>
@@ -1118,7 +1118,7 @@ doc-subtab: general
</ul>
<p>You can 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 %}
@@ -1142,7 +1142,7 @@ doc-subtab: general
</li>
</ul>
</div>
<div class="example">
<div class="bd-example">
{{field_label_example}}
</div>
{% highlight html %}{{field_label_example}}{% endhighlight %}