mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
269 lines
5.9 KiB
HTML
269 lines
5.9 KiB
HTML
<span class="icon">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
<span>Home</span>
|
|
</span>
|
|
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-train"></i>
|
|
</span>
|
|
<span>Paris</span>
|
|
<span class="icon">
|
|
<i class="fas fa-arrow-right"></i>
|
|
</span>
|
|
<span>Budapest</span>
|
|
<span class="icon">
|
|
<i class="fas fa-arrow-right"></i>
|
|
</span>
|
|
<span>Bucharest</span>
|
|
<span class="icon">
|
|
<i class="fas fa-arrow-right"></i>
|
|
</span>
|
|
<span>Istanbul</span>
|
|
<span class="icon">
|
|
<i class="fas fa-flag-checkered"></i>
|
|
</span>
|
|
</span>
|
|
|
|
<div class="icon-text">
|
|
<span class="icon has-text-info">
|
|
<i class="fas fa-info-circle"></i>
|
|
</span>
|
|
<span>Information</span>
|
|
</div>
|
|
|
|
<p class="block">Your package will be delivered on <strong>Tuesday at 08:00</strong>.</p>
|
|
|
|
<div class="icon-text">
|
|
<span class="icon has-text-success">
|
|
<i class="fas fa-check-square"></i>
|
|
</span>
|
|
<span>Success</span>
|
|
</div>
|
|
|
|
<p class="block">Your image has been successfully uploaded.</p>
|
|
|
|
<div class="icon-text">
|
|
<span class="icon has-text-warning">
|
|
<i class="fas fa-exclamation-triangle"></i>
|
|
</span>
|
|
<span>Warning</span>
|
|
</div>
|
|
|
|
<p class="block">Some information is missing from your <a href="#">profile</a> details.</p>
|
|
|
|
<div class="icon-text">
|
|
<span class="icon has-text-danger">
|
|
<i class="fas fa-ban"></i>
|
|
</span>
|
|
<span>Danger</span>
|
|
</div>
|
|
|
|
<p class="block">There was an error in your submission. <a href="#">Please try again</a>.</p>
|
|
|
|
<table class="table is-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>Container class</th>
|
|
<th>Container size</th>
|
|
<th>Font Awesome 5 class</th>
|
|
<th>Icon size</th>
|
|
<th>Result</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<code>icon is-small</code>
|
|
</td>
|
|
<td>
|
|
<code>1rem x 1rem</code>
|
|
</td>
|
|
<td>
|
|
<code>fas</code>
|
|
</td>
|
|
<td>
|
|
<code>1em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-small">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td rowspan="2">
|
|
<code>icon</code>
|
|
</td>
|
|
<td rowspan="2">
|
|
<code>1.5rem x 1.5rem</code>
|
|
</td>
|
|
<td>
|
|
<code>fas</code>
|
|
</td>
|
|
<td>
|
|
<code>1em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<code>fas fa-lg</code>
|
|
</td>
|
|
<td>
|
|
<code>1.33em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon">
|
|
<i class="fas fa-lg fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td rowspan="3">
|
|
<code>icon is-medium</code>
|
|
</td>
|
|
<td rowspan="3">
|
|
<code>2rem x 2rem</code>
|
|
</td>
|
|
<td>
|
|
<code>fas</code>
|
|
</td>
|
|
<td>
|
|
<code>1em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-medium">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<code>fas fa-lg</code>
|
|
</td>
|
|
<td>
|
|
<code>1.33em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-medium">
|
|
<i class="fas fa-lg fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<code>fas fa-2x</code>
|
|
</td>
|
|
<td>
|
|
<code>2em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-medium">
|
|
<i class="fas fa-2x fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td rowspan="3">
|
|
<code>icon is-large</code>
|
|
</td>
|
|
<td rowspan="4">
|
|
<code>3rem x 3rem</code>
|
|
</td>
|
|
<td>
|
|
<code>fas</code>
|
|
</td>
|
|
<td>
|
|
<code>1em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-large">
|
|
<i class="fas fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<code>fas fa-lg</code>
|
|
</td>
|
|
<td>
|
|
<code>1.33em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-large">
|
|
<i class="fas fa-lg fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<code>fas fa-2x</code>
|
|
</td>
|
|
<td>
|
|
<code>2em</code>
|
|
</td>
|
|
<td class="bd-icon-size">
|
|
<span class="icon is-large">
|
|
<i class="fas fa-2x fa-home"></i>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<div class="content">
|
|
<p>
|
|
An invitation to
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-utensils"></i>
|
|
</span>
|
|
<span>dinner</span>
|
|
</span>
|
|
was soon afterwards dispatched; and already had Mrs. Bennet planned the courses that were to do credit to her
|
|
housekeeping, when an answer arrived which deferred it all. Mr. Bingley was obliged to be in
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-city"></i>
|
|
</span>
|
|
<span>town</span>
|
|
</span>
|
|
the following day, and, consequently, unable to accept the honour of their
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-envelope-open-text"></i>
|
|
</span>
|
|
<span>invitation</span> </span
|
|
>, etc.
|
|
</p>
|
|
|
|
<p>
|
|
Mrs. Bennet was quite disconcerted. She could not imagine what business he could have in town so soon after his
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-flag-checkered"></i>
|
|
</span>
|
|
<span>arrival</span>
|
|
</span>
|
|
in Hertfordshire; and she began to fear that he might be always
|
|
<span class="icon-text">
|
|
<span class="icon">
|
|
<i class="fas fa-plane-departure"></i>
|
|
</span>
|
|
<span>flying</span>
|
|
</span>
|
|
about from one place to another, and never settled at Netherfield as he ought to be.
|
|
</p>
|
|
</div>
|