@extends('larasnap::layouts.app', ['class' => 'icons'])
@section('title','Icons')
@section('content')
<!-- Page Heading  Start-->
<div class="d-sm-flex align-items-center justify-content-between mb-4">
   <h1 class="h3 mb-0 text-gray-800">Icons</h1>
</div>
<!-- Page Heading End-->				  
<!-- Page Content Start-->				  
<div class="row">
   <div class="col-xl-12">
      <div class="card shadow mb-4">
         <div class="card-body">
            <div class="card-body">
            <div class="row">
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-address-book" aria-hidden="true"></i> fa-address-book</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-area-chart" aria-hidden="true"></i> fa-area-chart</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-bars" aria-hidden="true"></i> fa-bars</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-book" aria-hidden="true"></i> fa-book</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-bookmark" aria-hidden="true"></i> fa-bookmark</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-caret-square-o-left" aria-hidden="true"></i> fa-caret-square-o-left</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-caret-square-o-right" aria-hidden="true"></i> fa-caret-square-o-right</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-caret-square-o-up" aria-hidden="true"></i> fa-caret-square-o-up</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-cart-plus" aria-hidden="true"></i> fa-cart-plus</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-check" aria-hidden="true"></i> fa-check</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-clock-o" aria-hidden="true"></i> fa-clock-o</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-clone" aria-hidden="true"></i> fa-clone</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-close" aria-hidden="true"></i> fa-close</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-cloud-download" aria-hidden="true"></i> fa-cloud-download</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-cloud-upload" aria-hidden="true"></i> fa-cloud-upload</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-dashboard" aria-hidden="true"></i> fa-dashboard</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-database" aria-hidden="true"></i> fa-database</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-desktop" aria-hidden="true"></i> fa-desktop</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-edit" aria-hidden="true"></i> fa-edit</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-envelope" aria-hidden="true"></i> fa-envelope</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-file-image-o" aria-hidden="true"></i> fa-file-image-o</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-file-movie-o" aria-hidden="true"></i> fa-file-movie-o</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-folder" aria-hidden="true"></i> fa-folder</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-gear" aria-hidden="true"></i> fa-gear</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-globe" aria-hidden="true"></i> fa-globe</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-home" aria-hidden="true"></i> fa-home</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-list" aria-hidden="true"></i> fa-list</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-lock" aria-hidden="true"></i> fa-lock</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-paper-plane" aria-hidden="true"></i> fa-paper-plane</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-pie-chart" aria-hidden="true"></i> fa-pie-chart</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-pie-chart" aria-hidden="true"></i> fa-pie-chart</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-shield" aria-hidden="true"></i> fa-shield</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-tasks" aria-hidden="true"></i> fa-tasks</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-upload" aria-hidden="true"></i> fa-upload</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-user" aria-hidden="true"></i> fa-user</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-user-plus" aria-hidden="true"></i> fa-user-plus</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-user-times" aria-hidden="true"></i> fa-user-times</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-users" aria-hidden="true"></i> fa-users</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-warning" aria-hidden="true"></i> fa-warning</a></div>
                <div class="col-md-3 col-sm-4"><a href="#"><i class="fa fa-wrench" aria-hidden="true"></i> fa-wrench</a></div>
            </div>
            <br>
            <br>
            <br>
            <p>Refer <a href="https://fontawesome.com/v4.7.0/icons/" target="_blank">Font Awesome</a> site for complete list of icons.</p>
            </div>
         </div>
      </div>
   </div>
</div>
<!-- Page Content End-->				  
@endsection