@extends('layouts.backend')

@section('content')


<main>
    <div class="container-fluid">
        <h1 class="mt-4">Dashboard</h1>
        <div class="row">
            <div class="col-xl-3 col-md-6">
                <div class="card bg-primary text-white mb-4">
					<div class="bg-grad-2 text-white rounded-lg mb-4 overflow-hidden" style="margin-bottom: 0 !important;">
                    <div class="px-3 pt-3">
                        <div class="opacity-50">
                            <span class="fs-12 d-block">TOTAL </span>
                            
                            Posts
						<a class="small text-white stretched-link" href="{{ route('post.index') }}" style="float: right;">View All</a>
                        </div>
                        <div class="h3 fw-700 mb-3"></div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
                        <path fill="rgba(255,255,255,0.3)" fill-opacity="1" d="M0,128L34.3,112C68.6,96,137,64,206,96C274.3,128,343,224,411,250.7C480,277,549,235,617,213.3C685.7,192,754,192,823,181.3C891.4,171,960,149,1029,117.3C1097.1,85,1166,43,1234,58.7C1302.9,75,1371,149,1406,186.7L1440,224L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"></path>
                    </svg>
                </div>
				</div>
            </div>
            <div class="col-xl-3 col-md-6">
                <div class="card bg-warning text-white mb-4">
                    <div class="bg-grad-3 text-white rounded-lg mb-4 overflow-hidden" style="margin-bottom: 0 !important;">
                    <div class="px-3 pt-3">
                        <div class="opacity-50">
                            <span class="fs-12 d-block">TOTAL</span>
                            Categories
							<a class="small text-white stretched-link" href="{{ route('category.create') }}" style="float: right;">View Details</a>
                        </div>
                        <div class="h3 fw-700 mb-3"></div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
                        <path fill="rgba(255,255,255,0.3)" fill-opacity="1" d="M0,128L34.3,112C68.6,96,137,64,206,96C274.3,128,343,224,411,250.7C480,277,549,235,617,213.3C685.7,192,754,192,823,181.3C891.4,171,960,149,1029,117.3C1097.1,85,1166,43,1234,58.7C1302.9,75,1371,149,1406,186.7L1440,224L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"></path>
                    </svg>
                </div>
                </div>
            </div>
            <div class="col-xl-3 col-md-6">
                <div class="card bg-success text-white mb-4">
                   <div class="bg-grad-3 text-white rounded-lg mb-4 overflow-hidden" style="margin-bottom: 0 !important;">
                    <div class="px-3 pt-3">
                        <div class="opacity-50">
                            <span class="fs-12 d-block">TOTAL</span>
                            Videos
							<a class="small text-white stretched-link" href="{{ route('video.index') }}" style="float: right;">View Details</a>
                        </div>
                        <div class="h3 fw-700 mb-3"></div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
                        <path fill="rgba(255,255,255,0.3)" fill-opacity="1" d="M0,128L34.3,112C68.6,96,137,64,206,96C274.3,128,343,224,411,250.7C480,277,549,235,617,213.3C685.7,192,754,192,823,181.3C891.4,171,960,149,1029,117.3C1097.1,85,1166,43,1234,58.7C1302.9,75,1371,149,1406,186.7L1440,224L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"></path>
                    </svg>
                </div>
                </div>
            </div>
            <div class="col-xl-3 col-md-6">
                <div class="card bg-danger text-white mb-4">
                    <div class="bg-grad-3 text-white rounded-lg mb-4 overflow-hidden" style="margin-bottom: 0 !important;">
                    <div class="px-3 pt-3">
                        <div class="opacity-50">
                            <span class="fs-12 d-block">TOTAL</span>
                            Users
							<a class="small text-white stretched-link" href="{{ route('user.index') }}" style="float: right;">View Details</a>
                        </div>
                        <div class="h3 fw-700 mb-3"></div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
                        <path fill="rgba(255,255,255,0.3)" fill-opacity="1" d="M0,128L34.3,112C68.6,96,137,64,206,96C274.3,128,343,224,411,250.7C480,277,549,235,617,213.3C685.7,192,754,192,823,181.3C891.4,171,960,149,1029,117.3C1097.1,85,1166,43,1234,58.7C1302.9,75,1371,149,1406,186.7L1440,224L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"></path>
                    </svg>
                </div>
                </div>
            </div>
        </div>
        
        
        <div class="row">
            <div class="col-md-12">
                <div id="card" class="card mb-4">
                    <div class="card-header">
                        <i class="fas fa-table mr-1"></i>
                        Latest Post <span style="float: right;"><a class="small" href="{{ route('post.index') }}">View All <i class="fa fa-angle-double-right" aria-hidden="true"></i></a></span>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                                <thead>
                                    <tr>
                                        <th class="text-center">Id</th>
                                <th>Headline</th>
                                <th class="text-center">Time</th>
                                <th class="text-center">Publisher</th>
                                
                                <th class="text-center">Total Hit</th>
                                <th class="text-center">Action</th>
                                    </tr>
                                </thead>
                                <tfoot>
                                    
                                </tfoot>
        
                                </tbody>
                            </table>
                        </div>
                    </div>					
                </div>
            </div>
            <div class="col-md-6 d-none">
                <div id="card" class="card mb-4">
                    <div class="card-header">
                        <i class="fas fa-table mr-1"></i>
                        Latest Video
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                                <thead>
                                    <tr>
                                        <th class="text-center">Id</th>
                                        <th class="text-center">Thumbnail</th>
                                        <th>Title</th>
                                        <th class="text-center">Action</th>
                                    </tr>
                                </thead>
                                <tfoot>
                                  
                                </tfoot>
        
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
      
    </div>
</main>
    
    
    <!--<div class="right_col" role="main">-->
    <!--    <div class="">-->
    <!--        <div class="page-title">-->
    <!--            <div class="title_left">-->
    <!--                <h3>Dashboard</h3>-->
    <!--            </div>-->

    <!--            <div class="title_right">-->
    <!--                <div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">-->
    <!--                    <div class="input-group">-->
    <!--                        <input type="text" class="form-control" placeholder="Search for...">-->
    <!--                <span class="input-group-btn">-->
    <!--                  <button class="btn btn-default" type="button">Go!</button>-->
    <!--                </span>-->
    <!--                    </div>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>--> 

    <!--        <div class="clearfix"></div>-->

    <!--        <div class="row">-->
    <!--            <div class="col-md-12 col-sm-12 col-xs-12">-->
    <!--                @include('parts.message')-->
    <!--                <div class="x_panel">-->
    <!--                    <div class="x_title">-->
    <!--                        <h2>Dashboard</h2>-->
    <!--                        <ul class="nav navbar-right panel_toolbox">-->
    <!--                            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>-->
    <!--                            </li>-->
    <!--                            <li class="dropdown">-->
    <!--                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>-->
    <!--                                <ul class="dropdown-menu" role="menu">-->
    <!--                                    <li><a href="#">Settings 1</a>-->
    <!--                                    </li>-->
    <!--                                    <li><a href="#">Settings 2</a>-->
    <!--                                    </li>-->
    <!--                                </ul>-->
    <!--                            </li>-->
    <!--                            <li><a class="close-link"><i class="fa fa-close"></i></a>-->
    <!--                            </li>-->
    <!--                        </ul>-->
    <!--                        <div class="clearfix"></div>-->
    <!--                    </div>-->
    <!--                    <div class="x_content">-->

    <!--                        <div class="btn-group btn-group-justified">-->
    <!--                            <a href="{{ route('post.create') }}" type="button" class="btn btn-primary">New Post</a>-->
    <!--                            <a href="{{ route('tag.create') }}" type="button" class="btn btn-primary">New Tag</a>-->
    <!--                            <a href="{{ route('menu.create') }}" type="button" class="btn btn-primary">New Menu</a>-->
    <!--                            <a href="{{ route('category.create') }}" type="button" class="btn btn-primary">New Category</a>-->
    <!--                        </div>-->


    <!--                    </div>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->


    <!--</div>-->
@endsection