mirror of
https://github.com/jgthms/bulma
synced 2026-03-20 04:14:29 -07:00
adds table-container to colors, functions, mixins, and variables tables
This commit is contained in:
committed by
Jeremy Thomas
parent
a531ea2758
commit
57808aebab
@@ -39,54 +39,56 @@ shades:
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Color</th>
|
||||
<th>Variable</th>
|
||||
<th>Value</th>
|
||||
<th>Computed value</th>
|
||||
<th>Invert value</th>
|
||||
<th>Computed invert value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for color in page.colors %}
|
||||
{% assign derivedColor = site.data.colors.derived | where: "id", color | first %}
|
||||
{% assign initialColor = site.data.colors.initial | where: "id", derivedColor.valueId | first %}
|
||||
<div class="table-container">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>{{ derivedColor.id | capitalize }}</strong>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ derivedColor.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ initialColor.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=initialColor.value %}
|
||||
</td>
|
||||
{% if derivedColor.invertValue %}
|
||||
<td>
|
||||
<code>{{ derivedColor.invertValue }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=derivedColor.invertValue %}
|
||||
</td>
|
||||
{% elsif derivedColor.invertId %}
|
||||
{% assign invertColor = site.data.colors.initial | where: "id", derivedColor.invertId | first %}
|
||||
<td>
|
||||
<code>${{ derivedColor.invertId }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=invertColor.value %}
|
||||
</td>
|
||||
{% endif %}
|
||||
<th>Color</th>
|
||||
<th>Variable</th>
|
||||
<th>Value</th>
|
||||
<th>Computed value</th>
|
||||
<th>Invert value</th>
|
||||
<th>Computed invert value</th>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for color in page.colors %}
|
||||
{% assign derivedColor = site.data.colors.derived | where: "id", color | first %}
|
||||
{% assign initialColor = site.data.colors.initial | where: "id", derivedColor.valueId | first %}
|
||||
<tr>
|
||||
<td>
|
||||
<strong>{{ derivedColor.id | capitalize }}</strong>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ derivedColor.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ initialColor.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=initialColor.value %}
|
||||
</td>
|
||||
{% if derivedColor.invertValue %}
|
||||
<td>
|
||||
<code>{{ derivedColor.invertValue }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=derivedColor.invertValue %}
|
||||
</td>
|
||||
{% elsif derivedColor.invertId %}
|
||||
{% assign invertColor = site.data.colors.initial | where: "id", derivedColor.invertId | first %}
|
||||
<td>
|
||||
<code>${{ derivedColor.invertId }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=invertColor.value %}
|
||||
</td>
|
||||
{% endif %}
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<p>
|
||||
@@ -94,28 +96,30 @@ shades:
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Color</th>
|
||||
<th>Variable</th>
|
||||
<th>Value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for shade in page.shades %}
|
||||
{% assign initial_shade = site.data.colors.initial | where: "id", shade | first %}
|
||||
<div class="table-container">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>
|
||||
<strong>{{ initial_shade.name | capitalize }}</strong>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ initial_shade.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=initial_shade.value %}
|
||||
</td>
|
||||
<th>Color</th>
|
||||
<th>Variable</th>
|
||||
<th>Value</th>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for shade in page.shades %}
|
||||
{% assign initial_shade = site.data.colors.initial | where: "id", shade | first %}
|
||||
<tr>
|
||||
<td>
|
||||
<strong>{{ initial_shade.name | capitalize }}</strong>
|
||||
</td>
|
||||
<td>
|
||||
<code>${{ initial_shade.id }}</code>
|
||||
</td>
|
||||
<td>
|
||||
{% include elements/color-square.html value=initial_shade.value %}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user