Use Font Awesome 5

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

View File

@@ -14,34 +14,34 @@ fixed_navbar: true
<nav class="columns">
<a class="column has-text-centered" href="{{ site.url }}/documentation/overview/responsiveness/">
<span class="icon is-large" style="margin-right: -15px;">
<i class="fa fa-3x fa-mobile"></i>
<i class="fas fa-lg fa-mobile-alt"></i>
</span>
<span class="icon is-large">
<i class="fa fa-3x fa-tablet"></i>
<i class="fas fa-2x fa-tablet-alt"></i>
</span>
<span class="icon is-large" style="margin-right: 10px;">
<i class="fa fa-3x fa-desktop"></i>
<i class="fas fa-3x fa-desktop"></i>
</span>
<p class="title is-4" style="margin-top: 0.5em;"><strong>100% Responsive</strong></p>
<p class="subtitle">Designed for <strong>mobile</strong> first</p>
</a>
<a class="column has-text-centered" href="{{ site.url }}/documentation/overview/modular/">
<span class="icon is-large">
<i class="fa fa-3x fa-cubes"></i>
<i class="fas fa-3x fa-cubes"></i>
</span>
<p class="title is-4" style="margin-top: 0.5em;"><strong>Modular</strong></p>
<p class="subtitle">Just import what you <strong>need</strong></p>
</a>
<a class="column has-text-centered" href="{{ site.url }}/documentation/columns/basics/">
<span class="icon is-large">
<i class="fa fa-3x fa-css3"></i>
<i class="fab fa-3x fa-css3"></i>
</span>
<p class="title is-4" style="margin-top: 0.5em;"><strong>Modern</strong></p>
<p class="subtitle">Built with <strong>Flexbox</strong></p>
</a>
<a class="column has-text-centered" href="{{ site.github }}">
<span class="icon is-large">
<i class="fa fa-3x fa-github"></i>
<i class="fab fa-3x fa-github"></i>
</span>
<p class="title is-4" style="margin-top: 0.5em;"><strong>Free</strong></p>
<p class="subtitle">Open source on <strong>GitHub</strong></p>
@@ -59,7 +59,7 @@ fixed_navbar: true
<div class="container">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-pause"></i>
<i class="fas fa-pause"></i>
</span>
<a href="{{ site.url }}/documentation/columns/basics">
Simple <strong>columns</strong>
@@ -161,7 +161,7 @@ fixed_navbar: true
<div class="container">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-th-large"></i>
<i class="fas fa-th-large"></i>
</span>
<a href="{{ site.url }}/documentation/layout/tiles">
Magic <strong>tiles</strong>
@@ -255,7 +255,7 @@ fixed_navbar: true
<div class="container">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-arrows-h"></i>
<i class="fas fa-arrows-alt-h"></i>
</span>
<a href="{{ site.url }}/documentation/layout/level/">
Flexible <strong>horizontal level</strong>
@@ -323,7 +323,7 @@ fixed_navbar: true
<div class="column">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-magic"></i>
<i class="fas fa-magic"></i>
</span>
<a href="{{ site.url }}/documentation/layout/media-object/">
Versatile <strong>media object</strong>
@@ -351,13 +351,13 @@ fixed_navbar: true
<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>
@@ -384,7 +384,7 @@ fixed_navbar: true
<div class="container has-text-centered">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-arrows-v"></i>
<i class="fas fa-arrows-v"></i>
</span>
<a href="{{ site.url }}/documentation/layout/hero/">
Easy <strong>vertical centering</strong> in <strong>fullscreen</strong>
@@ -411,7 +411,7 @@ fixed_navbar: true
<div class="column">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-cogs"></i>
<i class="fas fa-cogs"></i>
</span>
<a href="{{ site.url }}/documentation/modifiers/syntax/" style="display: block;">
Compose your element with <strong>modifier</strong> classes
@@ -463,7 +463,7 @@ fixed_navbar: true
<div class="container">
<h3 class="title is-2">
<span class="icon is-medium">
<i class="fa fa-asterisk"></i>
<i class="fas fa-asterisk"></i>
</span>
<a href="{{ site.url }}/documentation/elements/box/">
And all the usual <strong>elements</strong> and <strong>components</strong>
@@ -482,13 +482,13 @@ fixed_navbar: true
<div class="hero-buttons">
<a class="button is-link is-large" href="{{ site.documentation }}">
<span class="icon">
<i class="fa fa-book"></i>
<i class="fas fa-book"></i>
</span>
<span>Check the <strong>docs</strong></span>
</a>
<a class="button is-black is-large" href="{{ site.github }}">
<span class="icon">
<i class="fa fa-github"></i>
<i class="fab fa-github"></i>
</span>
<span>Contribute</span>
</a>