@extends('admin.layouts.master')
@section('styles')
<style>
  .tab-container {
    padding: 10px;
    margin: 10px;
}

.tab-button {
    background-color: #f1f1f1;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    float: left;
    margin-right: 5px;
}

.tab-button:hover {
    background-color: #ddd;
}

.tab-button.active {
    background-color: #ddd;
}

.tab-content {
    display: none;
    padding: 20px;
    border: 1px solid #ddd;
    clear: both;
}

.tab-content h2 {
    margin-top: 0;
}

/* Show the active tab */
.tab-content.active {
    display: block;
}
.scroll-container {
  width: 100%; /* Set the width of the widget */
  overflow-x: auto; /* Enable horizontal scrolling */
  white-space: nowrap; /* Prevent content from wrapping to the next line */
  border: 1px solid #ccc; /* Add a border for styling (optional) */
  padding: 10px; /* Add padding for spacing (optional) */
}

.scroll-content {
  display: inline-block; /* Ensure the content is displayed in a horizontal line */
  /* Add your content styling here */
}
</style>
@endsection
@section('contents')
<div class="content-wrapper pb-0">
<div class="page-header flex-wrap">
  <h3 class="mb-0"> Hi, welcome Admin! <span class="pl-0 h6 pl-sm-2 text-muted d-inline-block">Admin Dashboard.</span>
  </h3>
  <!-- <div class="d-flex">
    <button type="button" class="btn btn-sm bg-white btn-icon-text border">
      <i class="mdi mdi-email btn-icon-prepend"></i> Email </button>
    <button type="button" class="btn btn-sm bg-white btn-icon-text border ml-3">
      <i class="mdi mdi-printer btn-icon-prepend"></i> Print </button>
    <button type="button" class="btn btn-sm ml-3 btn-success"> Add User </button>
  </div> -->
</div>
<div class="card">
<div class="row">
   <div class="tab-container">
        <a href="{{route('admin-dashboard')}}" class="tab-button @if($dashboard == 'dashboard') active @endif">Dashbaord</a>
        <a href="{{route('admin-welcome-dashboard')}}" class="tab-button @if($dashboard == 'welcome_dashboard') active @endif" >Welcome</a>
   </div>
</div>
<div class="row">
  <div class="col-md-12">
    <h3>My Favourites</h3>
    <div class="col-md-12">
      <div class="scroll-container">
        <div class="scroll-content">
            <div  >asdas</div>
            <div  >asdas</div>
            <div  >asdas</div>

        </div>
      </div>
    </div>
  </div>  
</div>
</div>
</div>
<div class="modal modal-add fade show" id="modal-default" aria-modal="true" role="dialog" style="padding-right: 17px; display: none;">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Search</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
         <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <form action="{{route('shift-save')}}" id="sub-admin-form" method="post" enctype="multipart/form-data">
          @csrf
          <div class="form-group">
            <div class="add-id">
            </div>
          </div>
          <div class="form-group">
            <label for="recipient-name" class="control-label mb-10">Search *:</label>
            <input type="text" class="form-control all-clean" id="Search" name="Search" value="{{old('Search')}}" placeholder="Please Enter Search" required>
          </div>
          
          
        </form>
        
      </div>
      <div class="modal-footer justify-content-between">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="$('#sub-admin-form').submit()"><spam id="title-button">Add</spam></button>
      </div>
    </div>
  </div>
</div> 
@endsection
@section('scripts')
@endsection