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

Bulma v9 website (#3249)

Browse Source 
* Add Bulma v9

* Add vendor dependencies

* Fix native

* Fix sponsors

* Add style attribute
This commit is contained in:
Jeremy Thomas
2021-01-27 23:30:42 +00:00
committed by GitHub
parent c5edaea84f
commit 08ef4df2c0
1963 changed files with 157468 additions and 9452 deletions
Download Patch File Download Diff File Expand all files Collapse all files

216
docs/documentation/form/select.html
View File

@@ -42,59 +42,6 @@ meta:
</div>
{% endcapture %}
{% capture colors_example %}
<div class="field">
<div class="control">
<div class="select is-primary">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-info">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-success">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-warning">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-danger">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
{% endcapture %}
{% capture rounded_example %}
<div class="select is-rounded">
<select>
@@ -104,117 +51,62 @@ meta:
</div>
{% endcapture %}
{% capture sizes_example %}
<div class="field">
<div class="control">
<div class="select is-small">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-medium">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="control">
<div class="select is-large">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
</div>
{% endcapture %}
{% capture normal_example %}
<div class="control">
<div class="select">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="select">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% capture hover_example %}
<div class="control">
<div class="select">
<select class="is-hovered">
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="select">
<select class="is-hovered">
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% capture focus_example %}
<div class="control">
<div class="select">
<select class="is-focused">
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="select">
<select class="is-focused">
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% capture loading_example %}
<div class="control">
<div class="select is-loading">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="select is-loading">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% capture disabled_example %}
<div class="control">
<div class="select is-disabled">
<select disabled>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="select is-disabled">
<select disabled>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% capture icons_example %}
<div class="field">
<div class="control has-icons-left">
<div class="select">
<select>
<option selected>Country</option>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="icon is-small is-left">
<i class="fas fa-globe"></i>
</div>
<div class="control has-icons-left">
<div class="select">
<select>
<option selected>Country</option>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="icon is-small is-left">
<i class="fas fa-globe"></i>
</div>
</div>
{% endcapture %}
@@ -289,7 +181,7 @@ meta:
<div class="column is-half">
{{ select_example }}
</div>
<div class="column is-half highlight-full">
<div class="column is-half bd-highlight-full">
{% highlight html %}{{ select_example }}{% endhighlight %}
</div>
</div>
@@ -314,21 +206,24 @@ meta:
</div>
{{ select_multiple_example }}
</div>
<div class="column is-half highlight-full">
<div class="column is-half bd-highlight-full">
{% highlight html %}{{ select_multiple_example }}{% endhighlight %}
</div>
</div>
{% include elements/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>
{% for color in site.data.colors.justColors %}
{% capture foobar %}
<div class="select is-{{ color }}">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% include elements/snippet.html content=foobar %}
{% endfor %}
{% include elements/anchor.html name="Styles" %}
@@ -355,14 +250,17 @@ meta:
</p>
</div>
<div class="columns">
<div class="column is-half">
{{ sizes_example }}
</div>
<div class="column is-half">
{% highlight html %}{{ sizes_example }}{% endhighlight %}
</div>
{% for size in site.data.sizes %}
{% capture foobar %}
<div class="select is-{{ size }}">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
{% endcapture %}
{% include elements/snippet.html content=foobar %}
{% endfor %}
{% include elements/anchor.html name="States" %}