FlandreScarle7/Font-Awesome
1
0
Fork 0
mirror of https://github.com/FortAwesome/Font-Awesome.git synced 2024-12-28 22:41:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

adding accessibility practices to icon markup example

Browse Source
This commit is contained in:
Brian Talbot 2016-04-01 18:00:18 -04:00
parent 092d523f3b
commit cb191968f0
1 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/_layouts/icon.html
View File

@ -49,10 +49,15 @@ relative_path: ../../
</div> </div>
</div> </div>
{% highlight html %} {% highlight html %}
<i class="fa fa-{{ page.icon.id }}"></i> <i class="fa fa-{{ page.icon.id }}" aria-hidden="true"></i>
{% endhighlight %} {% endhighlight %}
<br> <p class="margin-bottom-lg">
<div class="lead"><i class="fa fa-info-sign"></i> Looking for more? Check out the <a href="{{ page.relative_path }}examples/">examples</a>.</div> <small class="text-muted">Note: to improve <a href="{{ page.relative_path }}accessibility/">web accessibility</a>, we recommend using <strong>aria-hidden="true"</strong> to hide icons used purely for decoration.</small>
</p>
<div class="lead">
<i class="fa fa-info-sign"></i> Looking for more? Check out the <a href="{{ page.relative_path }}examples/">examples</a>.
</div>
</div> </div>
<div class="col-md-3 col-sm-3"> <div class="col-md-3 col-sm-3">
<div class="vertical-ad">{% include ads/fusion.html %}</div> <div class="vertical-ad">{% include ads/fusion.html %}</div>