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

Init mixin docs

Browse Source
This commit is contained in:
Jeremy Thomas
2021-09-19 01:23:53 +01:00
parent 67ab02b289
commit 8def6f6afa
15 changed files with 986 additions and 474 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
docs/documentation/overview/modifiers.html
View File

@@ -11,75 +11,75 @@ breadcrumb:
---
{% capture button_example %}
<a class="button">
<button class="button">
Button
</a>
</button>
{% endcapture %}
{% capture button_primary_example %}
<a class="button is-primary">
<button class="button is-primary">
Button
</a>
</button>
{% endcapture %}
{% capture button_colors %}
<a class="button is-primary">
<button class="button is-primary">
Button
</a>
<a class="button is-link">
</button>
<button class="button is-link">
Button
</a>
<a class="button is-info">
</button>
<button class="button is-info">
Button
</a>
<a class="button is-success">
</button>
<button class="button is-success">
Button
</a>
<a class="button is-warning">
</button>
<button class="button is-warning">
Button
</a>
<a class="button is-danger">
</button>
<button class="button is-danger">
Button
</a>
</button>
{% endcapture %}
{% capture button_sizes %}
<a class="button is-small">
<button class="button is-small">
Button
</a>
<a class="button">
</button>
<button class="button">
Button
</a>
<a class="button is-medium">
</button>
<button class="button is-medium">
Button
</a>
<a class="button is-large">
</button>
<button class="button is-large">
Button
</a>
</button>
{% endcapture %}
{% capture button_states %}
<a class="button is-primary is-outlined">
<button class="button is-primary is-outlined">
Button
</a>
<a class="button is-loading">
</button>
<button class="button is-loading">
Button
</a>
<a class="button" disabled>
</button>
<button class="button" disabled>
Button
</a>
</button>
{% endcapture %}
{% capture button_combinations %}
<a class="button is-primary is-small" disabled>
<button class="button is-primary is-small" disabled>
Button
</a>
<a class="button is-info is-loading">
</button>
<button class="button is-info is-loading">
Button
</a>
<a class="button is-danger is-outlined is-large">
</button>
<button class="button is-danger is-outlined is-large">
Button
</a>
</button>
{% endcapture %}
<div class="columns">
@@ -124,22 +124,22 @@ breadcrumb:
</div>
<div class="column">
<p class="field">
<a class="button is-primary">Button</a>
<button class="button is-primary">Button</button>
</p>
<p class="field">
<a class="button is-link">Button</a>
<button class="button is-link">Button</button>
</p>
<p class="field">
<a class="button is-info">Button</a>
<button class="button is-info">Button</button>
</p>
<p class="field">
<a class="button is-success">Button</a>
<button class="button is-success">Button</button>
</p>
<p class="field">
<a class="button is-warning">Button</a>
<button class="button is-warning">Button</button>
</p>
<p class="field">
<a class="button is-danger">Button</a>
<button class="button is-danger">Button</button>
</p>
</div>
<div class="column is-half">
@@ -162,16 +162,16 @@ breadcrumb:
</div>
<div class="column">
<p class="field">
<a class="button is-small">Button</a>
<button class="button is-small">Button</button>
</p>
<p class="field">
<a class="button">Button</a>
<button class="button">Button</button>
</p>
<p class="field">
<a class="button is-medium">Button</a>
<button class="button is-medium">Button</button>
</p>
<p class="field">
<a class="button is-large">Button</a>
<button class="button is-large">Button</button>
</p>
</div>
<div class="column is-half">
@@ -192,13 +192,13 @@ breadcrumb:
</div>
<div class="column">
<p class="field">
<a class="button is-primary is-outlined">Button</a>
<button class="button is-primary is-outlined">Button</button>
</p>
<p class="field">
<a class="button is-loading">Button</a>
<button class="button is-loading">Button</button>
</p>
<p class="field">
<a class="button" disabled>Button</a>
<button class="button" disabled>Button</button>
</p>
</div>
<div class="column is-half">
@@ -214,13 +214,13 @@ breadcrumb:
</div>
<div class="column">
<p class="field">
<a class="button is-primary is-small" disabled>Button</a>
<button class="button is-primary is-small" disabled>Button</button>
</p>
<p class="field">
<a class="button is-info is-loading">Button</a>
<button class="button is-info is-loading">Button</button>
</p>
<p class="field">
<a class="button is-danger is-outlined is-large">Button</a>
<button class="button is-danger is-outlined is-large">Button</button>
</p>
</div>
<div class="column is-half">