@extends('layout.Main')

@section('container')
<div class="page-content">
    <div class="container-fluid">
        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <div class="page-title-box">
                    <div class="row">
                        <div class="col">
                            <h4 class="page-title">Ship List</h4>
                        </div><!--end col-->
                        <div class="col-auto align-self-center">
                            <a href="#" class="btn btn-sm btn-outline-primary" id="Dash_Date">
                                <span class="day-name" id="Day_Name">Today:</span>&nbsp;
                                <span class="" id="Select_date">Jan 11</span>
                                <i data-feather="calendar" class="align-self-center icon-xs ms-1"></i>
                            </a>
                            <a href="#" class="btn btn-sm btn-outline-primary">
                                <i data-feather="download" class="align-self-center icon-xs"></i>
                            </a>
                        </div><!--end col-->  
                    </div><!--end row-->                                                              
                </div><!--end page-title-box-->
            </div><!--end col-->
        </div><!--end row-->
        <!-- end page title end breadcrumb -->
        <div class="row">
            @foreach ($ships as $ship )
            <div class="col-md-3">
                <div class="card">
                    <div class="card-body">                                  
                        <img src="{{ url('') }}/assets/images/ship/{{ $ship->ship_image }}" alt="" class="d-block mx-auto my-4" height="150">
                        <div class="row my-4">
                            <div class="col">
                                <span class="badge badge-light mb-2">Life Style</span>
                                <a href="#" class="title-text d-block">{{ $ship->ship_name }}</a>
                            </div>
                            <div class="col-auto">
                                <small class="text-muted font-14">{{ $ship->ship_desc }}</small>
                            </div>      
                        </div> 
                        <a href="/dashboard/{{ $ship->ship_id }}" class="btn btn-soft-primary w-100">Masuk Dashboard</a>      
                    </div><!--end card-body-->
                </div><!--end card-->
            </div><!--end col-->
            @endforeach
           
                                                      
        </div>  <!--end row-->
     
    </div><!-- container -->

    <footer class="footer text-center text-sm-start">
        &copy; <script>
            document.write(new Date().getFullYear())
        </script> Dastone <span class="text-muted d-none d-sm-inline-block float-end">Crafted with <i
                class="mdi mdi-heart text-danger"></i> by Mannatthemes</span>
    </footer><!--end footer-->
</div>
   
@endsection