library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2025-01-09 15:44:25 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Match multiple-breakpoint-example to the code

Browse Source 
The example code that a user copies doesn't match the code that runs in the browser. This is confusing for new users and fails to demonstrate the actual library.
This commit is contained in:
Daryl Fritz 2018-09-27 14:25:10 -04:00 committed by Jeremy Thomas
parent c68ec17150
commit 3bf01fe314
1 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
docs/documentation/columns/responsiveness.html
View File

@ -33,12 +33,14 @@ breadcrumb:
<div class="column is-three-quarters-mobile is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-quarter-fullhd">
<code>is-three-quarters-mobile</code><br>
<code>is-two-thirds-tablet</code><br>
<code>is-half-desktop</code>
<code>is-one-third-widescreen</code>
<code>is-half-desktop</code><br>
<code>is-one-third-widescreen</code><br>
<code>is-one-quarter-fullhd</code>
</div>
<div class="column">1</div>
<div class="column">1</div>
<div class="column">2</div>
<div class="column">3</div>
<div class="column">4</div>
<div class="column">5</div>
</div>
{% endcapture %}
@ -108,24 +110,26 @@ breadcrumb:
</div>
<div class="columns is-mobile">
<div class="column is-half-mobile is-one-third-tablet is-one-quarter-desktop">
<div class="column is-three-quarters-mobile is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-quarter-fullhd">
<p class="bd-notification is-primary">
<code>is-half-mobile</code><br>
<code>is-one-third-tablet</code><br>
<code>is-one-quarter-desktop</code>
<code>is-three-quarters-mobile</code><br>
<code>is-two-thirds-tablet</code><br>
<code>is-half-desktop</code><br>
<code>is-one-third-widescreen</code><br>
<code>is-one-quarter-fullhd</code><br>
</p>
</div>
<div class="column">
<p class="bd-notification is-primary">1</p>
<p class="bd-notification is-primary">2</p>
</div>
<div class="column">
<p class="bd-notification is-primary">1</p>
<p class="bd-notification is-primary">3</p>
</div>
<div class="column">
<p class="bd-notification is-primary">1</p>
<p class="bd-notification is-primary">4</p>
</div>
<div class="column">
<p class="bd-notification is-primary">1</p>
<p class="bd-notification is-primary">5</p>
</div>
</div>