thanthos/Font-Awesome-Pro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Release 5.0.0-rc3

Browse Source
This commit is contained in:
robmadole
2017-10-13 16:29:14 -05:00
committed by Rob Madole
parent b83b91baee
commit 69bf7f96a1
86 changed files with 2172 additions and 1115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
docs/svg-framework.html
View File

@@ -7,6 +7,12 @@
<title>SVG Framework Demo - Font Awesome 5</title>
<script>
window.FontAwesomeConfig = {
searchPseudoElements: true,
measurePerformance: true
}
</script>
<script defer src="../js/packs/light.min.js"></script>
<script defer src="../js/packs/regular.min.js"></script>
<script defer src="../js/packs/solid.min.js"></script>
@@ -16823,7 +16829,7 @@
</section>
<section id="fab" class="">
<h2 class="mt0 mb3 pb3 bb bw1 b--gray1 f4 fw6 gray7 vf">Font Awesome 5 Brands &amp; Logos <span class="pl3 gray5 fr mt1 f3">300 icons</span></h2>
<h2 class="mt0 mb3 pb3 bb bw1 b--gray1 f4 fw6 gray7 vf">Font Awesome 5 Brands &amp; Logos <span class="pl3 gray5 fr mt1 f3">307 icons</span></h2>
<ul class="nl3 nr3 list ma0 pa0 flex flex-row flex-wrap gray9">
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
@@ -16970,6 +16976,15 @@
<span class="mt1 f2 o-30">f179</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/apple-pay.svg" target="_blank" class="color-inherit link">
<i class="fab fa-apple-pay"></i>
</a>
<span class="mt1 f2 fw6 gray5">apple-pay</span>
<span class="mt1 f2 o-30">f415</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/asymmetrik.svg" target="_blank" class="color-inherit link">
@@ -17159,6 +17174,15 @@
<span class="mt1 f2 o-30">f1f3</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/cc-apple-pay.svg" target="_blank" class="color-inherit link">
<i class="fab fa-cc-apple-pay"></i>
</a>
<span class="mt1 f2 fw6 gray5">cc-apple-pay</span>
<span class="mt1 f2 o-30">f416</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/cc-diners-club.svg" target="_blank" class="color-inherit link">
@@ -17654,6 +17678,15 @@
<span class="mt1 f2 o-30">f16e</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/fly.svg" target="_blank" class="color-inherit link">
<i class="fab fa-fly"></i>
</a>
<span class="mt1 f2 fw6 gray5">fly</span>
<span class="mt1 f2 o-30">f417</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/font-awesome.svg" target="_blank" class="color-inherit link">
@@ -18407,6 +18440,24 @@
<i class="fab fa-nintendo-switch"></i>
</a>
<span class="mt1 f2 fw6 gray5">nintendo-switch</span>
<span class="mt1 f2 o-30">f418</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/node.svg" target="_blank" class="color-inherit link">
<i class="fab fa-node"></i>
</a>
<span class="mt1 f2 fw6 gray5">node</span>
<span class="mt1 f2 o-30">f419</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/node-js.svg" target="_blank" class="color-inherit link">
<i class="fab fa-node-js"></i>
</a>
<span class="mt1 f2 fw6 gray5">node-js</span>
<span class="mt1 f2 o-30">f3d3</span>
</div>
</li>
@@ -18491,6 +18542,15 @@
<span class="mt1 f2 o-30">f23c</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/osi.svg" target="_blank" class="color-inherit link">
<i class="fab fa-osi"></i>
</a>
<span class="mt1 f2 fw6 gray5">osi</span>
<span class="mt1 f2 o-30">f41a</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/page4.svg" target="_blank" class="color-inherit link">
@@ -18680,6 +18740,15 @@
<span class="mt1 f2 o-30">f2d9</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/react.svg" target="_blank" class="color-inherit link">
<i class="fab fa-react"></i>
</a>
<span class="mt1 f2 fw6 gray5">react</span>
<span class="mt1 f2 o-30">f41b</span>
</div>
</li>
<li class="ma0 pa3 w-50 w-third-m w-20-l link hover-bg-white br2">
<div class="flex flex-column items-center" style="font-size: 48px;">
<a href="https://github.com/FortAwesome/Font-Awesome-Pro/tree/master/svgs/brands/rebel.svg" target="_blank" class="color-inherit link">
@@ -20037,6 +20106,33 @@
There are also some extra advanced options you have available with our SVG Framework.
</p>
<h3 class="mt0 mb2 f3 gray5 fw6">Using pseudo elements</h3>
<div class="flex flex-column flex-row-xl justify-between-xl mb4">
<div class="w-100 w-30-xl pa4 bg-white br2 flex flex-column items-center justify-center fa-2x">
<div data-example-container="extras-pseudo-elements">
<style>
.special-1:before {
display: none;
content: "\f000";
font-family: "Font Awesome 5 Solid";
}
.special-2:after {
display: none;
content: "\f001";
font-family: "Font Awesome 5 Light";
}
</style>
<div class="special-1"></div>
<div class="special-1">Before</div>
<div class="special-2">After</div>
</div>
</div>
<div class="w-100 w-60-xl">
<div id="extras-pseudo-elements" class="br2 bg-gray7 br2 bl bw3 b--gray6 lh-title">
</div>
</div>
</div>
<h3 class="mt0 mb2 f3 gray5 fw6">Show you missing icons</h3>
<div class="flex flex-column flex-row-xl justify-between-xl mb4">
<div class="w-100 w-30-xl pa4 bg-white br2 flex flex-column items-center justify-center fa-2x">
@@ -20059,7 +20155,12 @@
<svg style="height: 1em;"><use xlink:href="#fas-fa-edit"></use></svg>
<svg style="height: 1em;"><use xlink:href="#fas-fa-edit"></use></svg>
<svg style="height: 1em;"><use xlink:href="#fas-fa-edit"></use></svg>
<svg style="height: 1em;"><use xlink:href="#fas-fa-edit"></use></svg>
<i class="fas fa-trash" data-fa-symbol="delete-icon"></i>
<svg style="height: 1em;"><use xlink:href="#delete-icon"></use></svg>
<svg style="height: 1em;"><use xlink:href="#delete-icon"></use></svg>
<svg style="height: 1em;"><use xlink:href="#delete-icon"></use></svg>
</div>
</div>
<div class="w-100 w-60-xl">