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

Use Font Awesome 5

Browse Source
This commit is contained in:
Jeremy Thomas
2018-01-10 16:30:23 +00:00
parent cc96e3cc7c
commit 3158236eb7
43 changed files with 303 additions and 301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
docs/documentation/components/breadcrumb.html
View File

@@ -43,10 +43,10 @@ doc-subtab: breadcrumb
{% capture breadcrumb_icons_example %}
<nav class="breadcrumb" aria-label="breadcrumbs">
<ul>
<li><a href="#"><span class="icon is-small"><i class="fa fa-home"></i></span><span>Bulma</span></a></li>
<li><a href="#"><span class="icon is-small"><i class="fa fa-book"></i></span><span>Documentation</span></a></li>
<li><a href="#"><span class="icon is-small"><i class="fa fa-puzzle-piece"></i></span><span>Components</span></a></li>
<li class="is-active"><a href="#" aria-current="page"><span class="icon is-small"><i class="fa fa-thumbs-up" aria-hidden="true"></i></span><span>Breadcrumb</span></a></li>
<li><a href="#"><span class="icon is-small"><i class="fas fa-home"></i></span><span>Bulma</span></a></li>
<li><a href="#"><span class="icon is-small"><i class="fas fa-book"></i></span><span>Documentation</span></a></li>
<li><a href="#"><span class="icon is-small"><i class="fas fa-puzzle-piece"></i></span><span>Components</span></a></li>
<li class="is-active"><a href="#" aria-current="page"><span class="icon is-small"><i class="fas fa-thumbs-up" aria-hidden="true"></i></span><span>Breadcrumb</span></a></li>
</ul>
</nav>
{% endcapture %}
@@ -167,7 +167,7 @@ doc-subtab: breadcrumb
{% include anchor.html name="Icons" %}
<div class="content">
<p>You can use any of the <a href="http://fontawesome.io/">Font Awesome</a> <strong>icons</strong>.</p>
<p>You can use any of the <a href="https://fontawesome.com/" target="_blank">Font Awesome</a> <strong>icons</strong>.</p>
</div>
{% include snippet.html content=breadcrumb_icons_example horizontal=true clipped=true %}

2
docs/documentation/components/card.html
View File

@@ -44,7 +44,7 @@ doc-subtab: card
</p>
<a href="#" class="card-header-icon" aria-label="more options">
<span class="icon">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</a>
</header>

14
docs/documentation/components/dropdown.html
View File

@@ -11,7 +11,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
<span>Dropdown button</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -44,7 +44,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu2">
<span>Content</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -72,7 +72,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu3">
<span>Click me</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -114,7 +114,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu4">
<span>Hover me</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -134,7 +134,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu5">
<span>Left aligned</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -154,7 +154,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu6">
<span>Right aligned</span>
<span class="icon is-small">
<i class="fa fa-angle-down" aria-hidden="true"></i>
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
@@ -174,7 +174,7 @@ doc-subtab: dropdown
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu7">
<span>Dropup button</span>
<span class="icon is-small">
<i class="fa fa-angle-up" aria-hidden="true"></i>
<i class="fas fa-angle-up" aria-hidden="true"></i>
</span>
</button>
</div>

8
docs/documentation/components/modal.html
View File

@@ -150,16 +150,16 @@ doc-subtab: modal
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
</p>
</div>
<nav class="level">
<nav class="level is-mobile">
<div class="level-left">
<a class="level-item">
<span class="icon is-small"><i class="fa fa-reply"></i></span>
<span class="icon is-small"><i class="fas fa-reply"></i></span>
</a>
<a class="level-item">
<span class="icon is-small"><i class="fa fa-retweet"></i></span>
<span class="icon is-small"><i class="fas fa-retweet"></i></span>
</a>
<a class="level-item">
<span class="icon is-small"><i class="fa fa-heart"></i></span>
<span class="icon is-small"><i class="fas fa-heart"></i></span>
</a>
</div>
</nav>

6
docs/documentation/components/nav.html
View File

@@ -66,7 +66,7 @@ doc-subtab: nav
</a>
<a class="nav-item">
<span class="icon">
<i class="fa fa-twitter"></i>
<i class="fab fa-twitter"></i>
</span>
</a>
</div>
@@ -97,7 +97,7 @@ doc-subtab: nav
<p class="control">
<a class="button" >
<span class="icon">
<i class="fa fa-twitter"></i>
<i class="fab fa-twitter"></i>
</span>
<span>Tweet</span>
</a>
@@ -105,7 +105,7 @@ doc-subtab: nav
<p class="control">
<a class="button is-primary">
<span class="icon">
<i class="fa fa-download"></i>
<i class="fas fa-download"></i>
</span>
<span>Download</span>
</a>

6
docs/documentation/components/navbar.html
View File

@@ -114,7 +114,7 @@ doc-subtab: navbar
<p class="control">
<a class="button">
<span class="icon">
<i class="fa fa-twitter" aria-hidden="true"></i>
<i class="fab fa-twitter" aria-hidden="true"></i>
</span>
<span>Tweet</span>
</a>
@@ -122,7 +122,7 @@ doc-subtab: navbar
<p class="control">
<a class="button is-primary">
<span class="icon">
<i class="fa fa-download" aria-hidden="true"></i>
<i class="fas fa-download" aria-hidden="true"></i>
</span>
<span>Download</span>
</a>
@@ -830,7 +830,7 @@ document.addEventListener('DOMContentLoaded', function () {
<div id="navbarToggles" class="buttons">
<a id="navbarFixBottom" class="button is-link">
<span class="icon">
<i class="fa fa-square-o"></i>
<i class="far fa-square"></i>
</span>
<span>Show <strong>bottom</strong> navbar</span>
</a>

14
docs/documentation/components/panel.html
View File

@@ -14,7 +14,7 @@ doc-subtab: panel
<p class="control has-icons-left">
<input class="input is-small" type="text" placeholder="search">
<span class="icon is-small is-left">
<i class="fa fa-search"></i>
<i class="fas fa-search"></i>
</span>
</p>
</div>
@@ -27,37 +27,37 @@ doc-subtab: panel
</p>
<a class="panel-block is-active">
<span class="panel-icon">
<i class="fa fa-book"></i>
<i class="fas fa-book"></i>
</span>
bulma
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fa fa-book"></i>
<i class="fas fa-book"></i>
</span>
marksheet
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fa fa-book"></i>
<i class="fas fa-book"></i>
</span>
minireset.css
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fa fa-book"></i>
<i class="fas fa-book"></i>
</span>
jgthms.github.io
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fa fa-code-fork"></i>
<i class="fas fa-code-branch"></i>
</span>
daniellowtw/infboard
</a>
<a class="panel-block">
<span class="panel-icon">
<i class="fa fa-code-fork"></i>
<i class="fas fa-code-branch"></i>
</span>
mojs
</a>

70
docs/documentation/components/tabs.html
View File

@@ -43,25 +43,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -107,25 +107,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -138,25 +138,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -169,25 +169,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -200,20 +200,20 @@ doc-subtab: tabs
<ul>
<li>
<a>
<span class="icon"><i class="fa fa-angle-left"></i></span>
<span class="icon"><i class="fas fa-angle-left"></i></span>
<span>Left</span>
</a>
</li>
<li>
<a>
<span class="icon"><i class="fa fa-angle-up"></i></span>
<span class="icon"><i class="fas fa-angle-up"></i></span>
<span>Up</span>
</a>
</li>
<li>
<a>
<span>Right</span>
<span class="icon"><i class="fa fa-angle-right"></i></span>
<span class="icon"><i class="fas fa-angle-right"></i></span>
</a>
</li>
</ul>
@@ -225,25 +225,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -256,25 +256,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -287,25 +287,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon is-small"><i class="fa fa-image"></i></span>
<span class="icon is-small"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-music"></i></span>
<span class="icon is-small"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-film"></i></span>
<span class="icon is-small"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon is-small"><i class="fa fa-file-text-o"></i></span>
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>
@@ -318,25 +318,25 @@ doc-subtab: tabs
<ul>
<li class="is-active">
<a>
<span class="icon"><i class="fa fa-image"></i></span>
<span class="icon"><i class="fas fa-image"></i></span>
<span>Pictures</span>
</a>
</li>
<li>
<a>
<span class="icon"><i class="fa fa-music"></i></span>
<span class="icon"><i class="fas fa-music"></i></span>
<span>Music</span>
</a>
</li>
<li>
<a>
<span class="icon"><i class="fa fa-film"></i></span>
<span class="icon"><i class="fas fa-film"></i></span>
<span>Videos</span>
</a>
</li>
<li>
<a>
<span class="icon"><i class="fa fa-file-text-o"></i></span>
<span class="icon"><i class="fas fa-file-alt"></i></span>
<span>Documents</span>
</a>
</li>