@extends('layouts.defaultdashboard')
@section('content')
<style type="text/css">
.popup {
	zoom:1.0;
	position:relative;
	text-decoration:none;
}
.popup span {
	position:fixed;
	top:35%;
	
	width:350px;
	padding:10px;
	
	
	left:-999em;
	z-index:990;
        
}
.popup:hover {visibility:visible}
.popup:hover span {left:40%;}
* html .popup span {position:absolute;}
</style>
<div class="content-wrapper" style="width:100%;">
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="container">  
                <section class="dishes first-sec">
    
                    <div class="container p-b-2">
			            <div class="row">
				            <div class="col-md-12">
                                <div class="card-body">
                                    <table id="example1" class="table table-bordered table-striped">
                                        <thead>
                                            <tr>
                                                <th>Id</th>
                                                <th>Name</th>
                                                <th>Title</th>
                                                <th>Folder</th>
                                                <th>Order</th>
                                                <th>URL</th>
                                                <th>Action</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                                                                        @foreach($media as $med)  
                                                                                                <tr>
                                                    <td>{{$i}}</td>
                                                    <td>{{$med->name}}</td>
                                                    <td>{{$med->title}}</td>
                                                    <td>{{$med->folder}}</td>
                                                    <td>{{$med->display_order}}</td>
                                                    <td><p><a class="popup" href="#">{{$med->url}}<span><img style="width:550px;" src="{{$med->url}}"></span></a> </p></td>
                                                    <td><a href="{{ url('/dashboard/media/edit/'.$med->id) }}">Edit</a>-<a href="{{ url('/dashboard/media/delete/'.$med->id) }}">Delete</a></td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
			            </div>
		            </div>
	            </section>	
            </div>
        </div>
    </div>
</div>
@endsection