Changed links in examples page to be fragment links.

Some buttons in the examples page linked to non-existent pages. Changed to those to fragment links so that users won't be linked elsewhere.
This commit is contained in:
Chip Thien 2016-10-13 01:10:12 +00:00
parent 69fa1b735e
commit 293bda0664
2 changed files with 38 additions and 40 deletions

View File

@ -5,11 +5,11 @@
<div class="row"> <div class="row">
<div class="col-md-3 col-sm-4"> <div class="col-md-3 col-sm-4">
<p> <p>
<a class="btn btn-default" href="path/to/settings" aria-label="Settings"> <a class="btn btn-default" href="#path/to/settings" aria-label="Settings">
<i class="fa fa-cog" aria-hidden="true"></i> <i class="fa fa-cog" aria-hidden="true"></i>
</a> </a>
<a class="btn btn-danger" href="path/to/settings" aria-label="Delete"> <a class="btn btn-danger" href="#path/to/delete" aria-label="Delete">
<i class="fa fa-trash-o" aria-hidden="true"></i> <i class="fa fa-trash-o" aria-hidden="true"></i>
</a> </a>
@ -26,19 +26,17 @@
<span class="sr-only">Saving. Hang tight!</span> <span class="sr-only">Saving. Hang tight!</span>
</p> </p>
<p>
<div class="input-group margin-bottom-sm"> <div class="input-group margin-bottom-sm">
<span class="input-group-addon"><i class="fa fa-envelope-o fa-fw" aria-hidden="true"></i></span> <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw" aria-hidden="true"></i></span>
<input class="form-control" type="text" placeholder="Email address"> <input class="form-control" type="text" placeholder="Email address">
</div> </div>
<div class="input-group"> <div class="input-group margin-bottom">
<span class="input-group-addon"><i class="fa fa-key fa-fw" aria-hidden="true"></i></span> <span class="input-group-addon"><i class="fa fa-key fa-fw" aria-hidden="true"></i></span>
<input class="form-control" type="password" placeholder="Password"> <input class="form-control" type="password" placeholder="Password">
</div> </div>
</p>
<p> <p>
<a href="path/to/shopping/cart" class="btn btn-primary" aria-label="View 3 items in your shopping cart"> <a href="#path/to/shopping/cart" class="btn btn-primary" aria-label="View 3 items in your shopping cart">
<i class="fa fa-shopping-cart" aria-hidden="true"></i> <i class="fa fa-shopping-cart" aria-hidden="true"></i>
</a> </a>
</p> </p>
@ -54,11 +52,11 @@
</p> </p>
{% highlight html %} {% highlight html %}
<a class="btn btn-default" href="path/to/settings" aria-label="Settings"> <a class="btn btn-default" href="#path/to/settings" aria-label="Settings">
<i class="fa fa-cog" aria-hidden="true"></i> <i class="fa fa-cog" aria-hidden="true"></i>
</a> </a>
<a class="btn btn-danger" href="path/to/settings" aria-label="Delete"> <a class="btn btn-danger" href="#path/to/delete" aria-label="Delete">
<i class="fa fa-trash-o" aria-hidden="true"></i> <i class="fa fa-trash-o" aria-hidden="true"></i>
</a> </a>
@ -87,7 +85,7 @@
{% endhighlight %} {% endhighlight %}
{% highlight html %} {% highlight html %}
<a href="path/to/shopping/cart" class="btn btn-primary" aria-label="View 3 items in your shopping cart"> <a href="#path/to/shopping/cart" class="btn btn-primary" aria-label="View 3 items in your shopping cart">
<i class="fa fa-shopping-cart" aria-hidden="true"></i> <i class="fa fa-shopping-cart" aria-hidden="true"></i>
</a> </a>
{% endhighlight %} {% endhighlight %}

View File

@ -3,27 +3,27 @@
<div class="row"> <div class="row">
<div class="col-md-3 col-sm-4"> <div class="col-md-3 col-sm-4">
<p> <p>
<a class="btn btn-danger" href="#"> <a class="btn btn-danger" href="#path/to/delete">
<i class="fa fa-trash-o fa-lg"></i> Delete</a> <i class="fa fa-trash-o fa-lg"></i> Delete</a>
<a class="btn btn-default btn-sm" href="#"> <a class="btn btn-default btn-sm" href="#path/to/settings">
<i class="fa fa-cog"></i> Settings</a> <i class="fa fa-cog"></i> Settings</a>
</p> </p>
<p> <p>
<a class="btn btn-lg btn-success" href="#"> <a class="btn btn-lg btn-success" href="#path/to/awesome">
<i class="fa fa-flag fa-2x pull-left"></i> Font Awesome<br>Version {{ site.fontawesome.version }}</a> <i class="fa fa-flag fa-2x pull-left"></i> Font Awesome<br>Version {{ site.fontawesome.version }}</a>
</p> </p>
<div class="margin-bottom"> <div class="margin-bottom">
<div class="btn-group"> <div class="btn-group">
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-left">
<i class="fa fa-align-left" title="Align Left"></i> <i class="fa fa-align-left" title="Align Left"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-center">
<i class="fa fa-align-center" title="Align Center"></i> <i class="fa fa-align-center" title="Align Center"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-right">
<i class="fa fa-align-right" title="Align Right"></i> <i class="fa fa-align-right" title="Align Right"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-justify">
<i class="fa fa-align-justify" title="Align Justify"></i> <i class="fa fa-align-justify" title="Align Justify"></i>
</a> </a>
</div> </div>
@ -40,16 +40,16 @@
</div> </div>
<div class="margin-bottom"> <div class="margin-bottom">
<div class="btn-group open"> <div class="btn-group open">
<a class="btn btn-primary" href="#"><i class="fa fa-user fa-fw"></i> User</a> <a class="btn btn-primary" href="#user"><i class="fa fa-user fa-fw"></i> User</a>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"> <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
<span class="fa fa-caret-down" title="Toggle dropdown menu"></span> <span class="fa fa-caret-down" title="Toggle dropdown menu"></span>
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a href="#"><i class="fa fa-pencil fa-fw"></i> Edit</a></li> <li><a href="#edit"><i class="fa fa-pencil fa-fw"></i> Edit</a></li>
<li><a href="#"><i class="fa fa-trash-o fa-fw"></i> Delete</a></li> <li><a href="#delete"><i class="fa fa-trash-o fa-fw"></i> Delete</a></li>
<li><a href="#"><i class="fa fa-ban fa-fw"></i> Ban</a></li> <li><a href="#ban"><i class="fa fa-ban fa-fw"></i> Ban</a></li>
<li class="divider"></li> <li class="divider"></li>
<li><a href="#"><i class="fa fa-unlock"></i> Make admin</a></li> <li><a href="#make-admin"><i class="fa fa-unlock"></i> Make admin</a></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -60,25 +60,25 @@
Font Awesome works great with the full range of Bootstrap components. Font Awesome works great with the full range of Bootstrap components.
</p> </p>
{% highlight html %} {% highlight html %}
<a class="btn btn-danger" href="#"> <a class="btn btn-danger" href="#path/to/delete">
<i class="fa fa-trash-o fa-lg"></i> Delete</a> <i class="fa fa-trash-o fa-lg"></i> Delete</a>
<a class="btn btn-default btn-sm" href="#"> <a class="btn btn-default btn-sm" href="#path/to/settings">
<i class="fa fa-cog"></i> Settings</a> <i class="fa fa-cog"></i> Settings</a>
<a class="btn btn-lg btn-success" href="#"> <a class="btn btn-lg btn-success" href="#path/to/awesome">
<i class="fa fa-flag fa-2x pull-left"></i> Font Awesome<br>Version {{ site.fontawesome.version }}</a> <i class="fa fa-flag fa-2x pull-left"></i> Font Awesome<br>Version {{ site.fontawesome.version }}</a>
<div class="btn-group"> <div class="btn-group">
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-left">
<i class="fa fa-align-left" title="Align Left"></i> <i class="fa fa-align-left" title="Align Left"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-center">
<i class="fa fa-align-center" title="Align Center"></i> <i class="fa fa-align-center" title="Align Center"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-right">
<i class="fa fa-align-right" title="Align Right"></i> <i class="fa fa-align-right" title="Align Right"></i>
</a> </a>
<a class="btn btn-default" href="#"> <a class="btn btn-default" href="#align-justify">
<i class="fa fa-align-justify" title="Align Justify"></i> <i class="fa fa-align-justify" title="Align Justify"></i>
</a> </a>
</div> </div>
@ -93,16 +93,16 @@
</div> </div>
<div class="btn-group open"> <div class="btn-group open">
<a class="btn btn-primary" href="#"><i class="fa fa-user fa-fw"></i> User</a> <a class="btn btn-primary" href="#user"><i class="fa fa-user fa-fw"></i> User</a>
<a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"> <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
<span class="fa fa-caret-down" title="Toggle dropdown menu"></span> <span class="fa fa-caret-down" title="Toggle dropdown menu"></span>
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a href="#"><i class="fa fa-pencil fa-fw"></i> Edit</a></li> <li><a href="#edit"><i class="fa fa-pencil fa-fw"></i> Edit</a></li>
<li><a href="#"><i class="fa fa-trash-o fa-fw"></i> Delete</a></li> <li><a href="#delete"><i class="fa fa-trash-o fa-fw"></i> Delete</a></li>
<li><a href="#"><i class="fa fa-ban fa-fw"></i> Ban</a></li> <li><a href="#ban"><i class="fa fa-ban fa-fw"></i> Ban</a></li>
<li class="divider"></li> <li class="divider"></li>
<li><a href="#"><i class="fa fa-unlock"></i> Make admin</a></li> <li><a href="#make-admin"><i class="fa fa-unlock"></i> Make admin</a></li>
</ul> </ul>
</div> </div>
{% endhighlight %} {% endhighlight %}