Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-20 12:24:28 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix #2084

Browse Source
This commit is contained in:
Jeremy Thomas
2018-09-04 15:26:02 +02:00
parent 04fb26b450
commit ceae8a675e
1 changed files with 120 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
docs/documentation/overview/responsiveness.html
View File

@@ -87,124 +87,126 @@ $fullhd-enabled: false
</ul> </ul>
</div> </div>
<table class="table is-bordered"> <div class="table-container">
<thead> <table class="table is-bordered">
<tr> <thead>
{% for breakpoint_hash in site.data.breakpoints %} <tr>
{% assign breakpoint = breakpoint_hash[1] %} {% for breakpoint_hash in site.data.breakpoints %}
<th style="width: 20%;"> {% assign breakpoint = breakpoint_hash[1] %}
{{ breakpoint.name }}<br> <th style="width: 20%;">
{% if breakpoint.id == 'mobile' %} {{ breakpoint.name }}<br>
Up to <code>{{ breakpoint.to }}px</code> {% if breakpoint.id == 'mobile' %}
{% elsif breakpoint.id == 'fullhd' %} Up to <code>{{ breakpoint.to }}px</code>
<code>{{ breakpoint.from }}px</code> and above {% elsif breakpoint.id == 'fullhd' %}
{% else %} <code>{{ breakpoint.from }}px</code> and above
Between <code>{{ breakpoint.from }}px</code> and <code>{{ breakpoint.to }}px</code> {% else %}
{% endif %} Between <code>{{ breakpoint.from }}px</code> and <code>{{ breakpoint.to }}px</code>
</th> {% endif %}
{% endfor %} </th>
</tr> {% endfor %}
</thead> </tr>
<tbody> </thead>
<tr> <tbody>
<td> <tr>
<p class="notification is-success">mobile</p> <td>
</td> <p class="notification is-success">mobile</p>
<td colspan="4"> </td>
<p class="notification">-</p> <td colspan="4">
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td> <tr>
<p class="notification">-</p> <td>
</td> <p class="notification">-</p>
<td colspan="4"> </td>
<p class="notification is-success">tablet</p> <td colspan="4">
</td> <p class="notification is-success">tablet</p>
</tr> </td>
<tr> </tr>
<td colspan="2"> <tr>
<p class="notification">-</p> <td colspan="2">
</td> <p class="notification">-</p>
<td colspan="3"> </td>
<p class="notification is-success">desktop</p> <td colspan="3">
</td> <p class="notification is-success">desktop</p>
</tr> </td>
<tr> </tr>
<td colspan="3"> <tr>
<p class="notification">-</p> <td colspan="3">
</td> <p class="notification">-</p>
<td colspan="2"> </td>
<p class="notification is-success">widescreen</p> <td colspan="2">
</td> <p class="notification is-success">widescreen</p>
</tr> </td>
<tr> </tr>
<td colspan="4"> <tr>
<p class="notification">-</p> <td colspan="4">
</td> <p class="notification">-</p>
<td> </td>
<p class="notification is-success">fullhd</p> <td>
</td> <p class="notification is-success">fullhd</p>
</tr> </td>
<tr> </tr>
<td> <tr>
<p class="notification">-</p> <td>
</td> <p class="notification">-</p>
<td> </td>
<p class="notification is-success">tablet-only</p> <td>
</td> <p class="notification is-success">tablet-only</p>
<td colspan="3"> </td>
<p class="notification">-</p> <td colspan="3">
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td colspan="2"> <tr>
<p class="notification">-</p> <td colspan="2">
</td> <p class="notification">-</p>
<td> </td>
<p class="notification is-success">desktop-only</p> <td>
</td> <p class="notification is-success">desktop-only</p>
<td colspan="2"> </td>
<p class="notification">-</p> <td colspan="2">
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td colspan="3"> <tr>
<p class="notification">-</p> <td colspan="3">
</td> <p class="notification">-</p>
<td> </td>
<p class="notification is-success">widescreen-only</p> <td>
</td> <p class="notification is-success">widescreen-only</p>
<td> </td>
<p class="notification">-</p> <td>
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td colspan="2"> <tr>
<p class="notification is-success">touch</p> <td colspan="2">
</td> <p class="notification is-success">touch</p>
<td colspan="3"> </td>
<p class="notification">-</p> <td colspan="3">
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td colspan="3"> <tr>
<p class="notification is-success">until-widescreen</p> <td colspan="3">
</td> <p class="notification is-success">until-widescreen</p>
<td colspan="2"> </td>
<p class="notification">-</p> <td colspan="2">
</td> <p class="notification">-</p>
</tr> </td>
<tr> </tr>
<td colspan="4"> <tr>
<p class="notification is-success">until-fullhd</p> <td colspan="4">
</td> <p class="notification is-success">until-fullhd</p>
<td colspan="1"> </td>
<p class="notification">-</p> <td colspan="1">
</td> <p class="notification">-</p>
</tr> </td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
{% assign vernum = site.data.meta.version | downcase | remove: "." | plus: 0 %} {% assign vernum = site.data.meta.version | downcase | remove: "." | plus: 0 %}