@extends('layouts.app')
@section('content')
    <div class="content-heading">Followers</div>
    <div class="row">
        <!-- Aside card-->
        <div class="col-xl-3 col-lg-4">
            <div class="card b text-center">
                <div class="card-body">
                    <p class="h4 text-bold mb-0">This is you</p>
                </div>
                <div class="card-body">
                    <img class="rounded-circle thumb64 mb-2" src="/img/user/02.jpg" alt="avatar" />
                    <p class="h4 text-bold mb-0">Todd Evans</p>
                    <p>Rome, Italy</p>
                    <p>Joined on Feb, 2015</p>
                </div>
                <div class="card-body bt">
                    <div class="row">
                        <div class="col-4 br">
                            <em class="fab fa-facebook-f fa-fw text-primary"></em>
                            <strong>+700</strong>
                        </div>
                        <div class="col-4 br">
                            <em class="fab fa-twitter fa-fw text-info"></em>
                            <strong>+300</strong>
                        </div>
                        <div class="col-4">
                            <em class="fa fa-heart fa-fw text-danger"></em>
                            <strong>+150</strong>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card b">
                <div class="card-header">
                    <h5>Who may interest you</h5>
                </div>
                <div class="card-body">
                    <div class="media align-items-center">
                        <a class="mr-2" href="#"><img class="rounded-circle img-thumbnail thumb48" src="/img/user/04.jpg" alt="Contact" /></a>
                        <div class="media-body pt-1">
                            <div class="float-right"><button class="btn btn-secondary btn-sm" type="button">Follow</button></div>
                            <div class="text-bold">
                                Floyd Ortiz
                                <div class="text-sm text-muted">125k followers</div>
                            </div>
                        </div>
                    </div>
                    <div class="media align-items-center">
                        <a class="mr-2" href="#"><img class="rounded-circle img-thumbnail thumb48" src="/img/user/05.jpg" alt="Contact" /></a>
                        <div class="media-body pt-1">
                            <div class="float-right"><button class="btn btn-secondary btn-sm" type="button">Follow</button></div>
                            <div class="text-bold">
                                Luis Vasquez
                                <div class="text-sm text-muted">+30k followers</div>
                            </div>
                        </div>
                    </div>
                    <div class="media align-items-center">
                        <a class="mr-2" href="#"><img class="rounded-circle img-thumbnail thumb48" src="/img/user/06.jpg" alt="Contact" /></a>
                        <div class="media-body pt-1">
                            <div class="float-right"><button class="btn btn-secondary btn-sm" type="button">Follow</button></div>
                            <div class="text-bold">
                                Duane Mckinney
                                <div class="text-sm text-muted">+100k followers</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body"><a class="link-unstyled text-muted" href="">Find more friends</a></div>
            </div>
            <div class="text-sm text-muted mb-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
        </div>
        <!-- end Aside card-->
        <!-- Main cards-->
        <div class="col-xl-9 col-lg-8">
            <div class="row">
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/01.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Savannah Ramirez</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/03.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Warren Watts</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-info btn-oval" type="button">Following</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/04.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Charlie Price</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/05.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Vickie Alvarez</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/06.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Marjorie Miller</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-info btn-oval" type="button">Following</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/07.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Tracy Reynolds</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/08.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Lori Lewis</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-6">
                    <div class="card b text-center">
                        <div class="card-body">
                            <img class="rounded-circle thumb64 mb-2" src="/img/user/09.jpg" alt="avatar" />
                            <p class="h4 text-bold mb-0">Judy Shelton</p>
                            <p>Rome, Italy</p>
                            <button class="btn btn-success btn-oval" type="button">Follow</button>
                        </div>
                        <div class="card-body bt">
                            <div class="row">
                                <div class="col-4 br">
                                    <em class="fab fa-facebook-f fa-fw text-primary"></em>
                                    <strong>+700</strong>
                                </div>
                                <div class="col-4 br">
                                    <em class="fab fa-twitter fa-fw text-info"></em>
                                    <strong>+300</strong>
                                </div>
                                <div class="col-4">
                                    <em class="fa fa-heart fa-fw text-danger"></em>
                                    <strong>+150</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- end Main cards-->
    </div>
@endsection
@section('styles')@endsection
@section('scripts')@endsection
