@extends('layout.mainlayout')

@section('content-wrapper')
<!-- Main Content Header -->
<div class="main-content-header">
        <h1>Notifications</h1>
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="/" role="button">Dashboard</a>
            </li>
            <li class="breadcrumb-item active" aria-current="page">
                <span class="active">Notifications</span>
            </li>
        </ol>
    </div>
    <!-- End Main Content Header -->

    <div class="row">
        <div class="col-lg-6">
            <div class="notifications-card mb-30">
                <h5 class="noti-card-title">Notifications</h5>
                <div class="list-group">
                    <div class="list-group-item">
                        <i data-feather="cloud-lightning" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Aaron Rossi</a>
                            went traveling
                            <div class="time">1 min ago</div>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="sun" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Brad Joe</a>
                            played destiny
                            <div class="time">15 min ago</div>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="user" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Mitch</a>
                            <a href="#">2 others</a>
                            followed you.
                            <div class="time">30 min ago</div>
                        </div>
                        <div class="content pt-0">
                            <ul>
                                <li><img src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/2.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/3.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                            </ul>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="camera" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">George Petty</a>
                            uploaded a photo
                            <div class="time">2 min ago</div>
                        </div>
                        <div class="content">
                            <img src="{{ asset('assets/images/post-image.png') }}" alt="Picture">
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="flag" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Marco Gomez</a>
                            flagged your post
                            <div class="time">2 min ago</div>
                        </div>
                        <div class="content media mt-2">
                            <img src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="wh-40 mr-3 rounded-circle">
                            <div class="media-body">
                                <h5 class="fs-14 mb-1">George Petty</h5>
                                <p class="m-0">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>
                            </div>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="thumbs-up" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Mitch</a>
                            <a href="#">2 others</a> Liked your post.
                            <div class="time">3 min ago</div>
                        </div>
                        <div class="content pt-0">
                            <ul>
                                <li><img src="{{ asset('assets/images/user/4.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/5.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/6.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                            </ul>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="message-square" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Mitch</a>
                            <a href="#">2 others</a> commented on your post.
                            <div class="time">1 min ago</div>
                        </div>
                        <div class="content pt-0">
                            <ul>
                                <li><img src="{{ asset('assets/images/user/7.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/8.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/4.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                            </ul>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="settings" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Mitch</a>
                            <a href="#">2 others</a>
                            updated their settings.
                            <div class="time">4 min ago</div>
                        </div>
                        <div class="content pt-0">
                            <ul>
                                <li><img src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                                <li><img src="{{ asset('assets/images/user/2.jpg') }}" alt="User" class="wh-20 rounded-circle"></li>
                            </ul>
                        </div>
                    </div>

                    <div class="list-group-item">
                        <i data-feather="file" class="icon"></i>
                        <div class="pr-70">
                            <a href="#">Philip Satemburgo</a>
                            <a href="#">2 others</a>
                            quit his job.
                            <div class="time">4 min ago</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-6">
            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="mr-3 img-thumbnail">
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Aaron Rossi</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/2.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status online right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Marco Gomez</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/3.jpg') }}" alt="User" class="rounded-circle">
                            <span class="status online right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Brad Joe</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a href="#"><img width="60" height="60" src="{{ asset('assets/images/user/4.jpg') }}" alt="User" class="mr-3 img-thumbnail"></a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Mitch Petty</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>
                    <div class="notification-card-one mt-3 media">
                        <a href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/5.jpg') }}" alt="User" class="mr-3 img-thumbnail">
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">George Petty</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">1 minutes ago</span>
                        </div>
                    </div>
                    <div class="notification-card-one mt-3 media">
                        <a href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/6.jpg') }}" alt="User" class="mr-3 img-thumbnail">
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Petty Rossi</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">02.02.19 &nbsp; 08:00 AM</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/7.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status online right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">Mitch Rossi</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>

                    <div class="notification-card-one mt-3 media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/8.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status away right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">George Mitch</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">5 minutes ago</span>
                        </div>
                    </div>

                    <div class="notification-card-one mt-3 media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status ofline right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">George Petty</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">02.02.19 &nbsp; 08:00 AM</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/2.jpg') }}" alt="User" class="rounded-circle">
                            <span class="status online right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">George Mitch</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">0 seconds ago</span>
                        </div>
                    </div>

                    <div class="notification-card-one mt-3 media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/3.jpg') }}" alt="User" class="rounded-circle">
                            <span class="status away right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0">
                                <a class="global-color" href="#">George Mitch</a>
                            </h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">2 minutes ago</span>
                        </div>
                    </div>

                    <div class="notification-card-one mt-3 media">
                        <a class="position-relative mr-3" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/4.jpg') }}" alt="User" class="rounded-circle">
                            <span class="status ofline right-3 bottom-3"></span>
                        </a>
                        <div class="media-body">
                            <h5 class="fs-14 m-0"><a class="global-color" href="#">George Mitch</a></h5>
                            <p class="mt-1 mb-1">Just sent a new comment!</p>
                            <span class="gray-color">02.02.19 &nbsp; 08:00 AM</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-4">
            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-two text-center">
                        <a href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/1.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                        </a>
                        <h5 class="fs-14 mt-3 mb-0">
                            <a class="global-color" href="#">Aaron Rossi</a>
                        </h5>
                        <p class="mt-1 mb-1 mw-350">Just sent a new comment! Lorem Ipsum is simply dummy text of the.</p>
                        <span class="gray-color">0 seconds ago</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one text-center">
                        <a class="position-relative d-inline-block" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/2.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status online right-3 bottom-3"></span>
                        </a>
                        <h5 class="fs-14 mt-3 mb-0">
                            <a class="global-color" href="#">Mitch Rossi</a>
                        </h5>
                        <p class="mt-1 mb-1 mw-350">Just sent a new comment! Lorem Ipsum is simply dummy text of the.</p>
                        <span class="gray-color">5 minutes ago</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <div class="card mb-30">
                <div class="card-body">
                    <div class="notification-card-one text-center">
                        <a class="position-relative d-inline-block" href="#">
                            <img width="60" height="60" src="{{ asset('assets/images/user/3.jpg') }}" alt="User" class="rounded-circle img-thumbnail">
                            <span class="status ofline right-3 bottom-3"></span>
                        </a>
                        <h5 class="fs-14 mt-3 mb-0">
                            <a class="global-color" href="#">George Mitch</a>
                        </h5>
                        <p class="mt-1 mb-1 mw-350">Just sent a new comment! Lorem Ipsum is simply dummy text of the.</p>
                        <span class="gray-color">03.03.19 &nbsp; 05:00 AM</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection