@extends('layouts.index')

@push('css')
<link rel="stylesheet" href=" {{asset('assets/copy/style.css')}} ">
<link rel="stylesheet" href="{{asset('assets/vendor/quill/dist/quill.core.css')}} ">
<style>
  .select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    color: white !important;
    font-weight: 700 !important;
  }
</style>
<style>
  .program {
   color: white;
   font-weight: 700;
 }

 .icon {
   width: 5rem !important;
   height: 5rem !important;
 }

 .icon-shape i, .icon-shape svg {
   font-size: 28px !important;
 }

 .bg-kayu{
   background-image: url({{ asset('assets/img/bg-kayu.jpg') }});
 }

 .parent{
   background: greenyellow;
 }

 .child{
   background: bisque;
 }

 .pointer{
   cursor: pointer;
 }

 .break-word{
   max-width: 200px !important;
   word-wrap: break-word !important;
   white-space: inherit !important;
 }

 .table-responsive{
   max-height: 800px !important;
   overflow-y: scroll;
 }

 td{
   vertical-align: middle !important;
   text-align: center !important;
 }
 th{
   vertical-align: middle !important;
   text-align: center !important;
 }

 table td {
   position: relative;
 }

 .table-dark{
   position: sticky; top: 0;
   z-index: 999;
 }

 .table-bordered th, .table-bordered td { border: 1px solid #0A1D37!important }

 .table-striped>tbody>tr:nth-child(odd)>td,
 .table-striped>tbody>tr:nth-child(odd)>th {
   background-color: rgb(6, 184, 238);
   color: black;
 }
 .table-striped>tbody>tr:nth-child(even)>td,
 .table-striped>tbody>tr:nth-child(even)>th {
   background-color: bisque;
   color: black;
 }

 table td input {
   background: transparent;
   position: absolute;
   display: block;
   top:0;
   left:0;
   margin: 0;
   height: 100%;
   width: 100%;
   border: none;
   padding: 10px;
   box-sizing: border-box;
 }
</style>
@endpush

@section('content')
<div class="page-content">
  <div class="container-fluid">
    <div class="row">
      <div class="col-12">
        <div class="page-title-box d-flex align-items-center justify-content-between">
          <div class="page-title">
            <h4 class="mb-0 font-size-18">Data Grafik</h4>
            <ol class="breadcrumb">
              <li class="breadcrumb-item active">Welcome to {{ env('APP_NAME') }}</li>
            </ol>
          </div>
        </div>
      </div>
    </div>

    <div class="page-content-wrapper">
      <div class="row">
        <div class="col">
          <div class="card-wrapper">
            <!-- Default browser form validation -->
            <div class="card">
              <!-- Card body -->
              <div class="card-body">
                <div class="card-title">
                  <h3 class="mb-0">Setting Sidebar Content</h3>
                </div>
                <form method="POST" action="{{route('article.store')}}" id="tes">
                  @csrf

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="title">Title<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="title" id="title" required>
                    </div>
                  </div>

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="content">Konten<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="content" id="content" required>
                    </div>
                  </div>    

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="file">Image Url<i class="text-danger">*</i> </label>
                      <input type="file" name="file" id="file" class="form-control">
                    </div>
                  </div>


                  <button class="btn btn-info" type="submit">Simpan</button>
                </form>
              </div>
            </div>

            <div class="card">
              <!-- Card body -->
              <div class="card-body">
                <div class="card-title">
                  <h3 class="mb-0">Setting Grafik Pie Chart</h3>
                </div>
                <form method="POST" action="{{route('article.store')}}" id="tes">
                  @csrf

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="title">Title<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="title" id="title" required>
                    </div>
                  </div>

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="content">Konten<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="content" id="content" required>
                    </div>
                  </div>    

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="file">Image Url<i class="text-danger">*</i> </label>
                      <input type="file" name="file" id="file" class="form-control">
                    </div>
                  </div>


                  <button class="btn btn-info" type="submit">Simpan</button>
                </form>
              </div>
            </div>

            <div class="card">
              <!-- Card body -->
              <div class="card-body">
                <div class="card-title">
                  <h3 class="mb-0">Setting Grafik Line Chart</h3>
                </div>
                <form method="POST" action="{{route('article.store')}}" id="tes">
                  @csrf

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="title">Title<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="title" id="title" required>
                    </div>
                  </div>

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="content">Konten<i class="text-danger">*</i> </label>
                      <input type="text" class="form-control" name="content" id="content" required>
                    </div>
                  </div>    

                  <div class="col-md-12 mb-3">
                    <div class="form-group">
                      <label class="form-control-label" for="file">Image Url<i class="text-danger">*</i> </label>
                      <input type="file" name="file" id="file" class="form-control">
                    </div>
                  </div>


                  <button class="btn btn-info" type="submit">Simpan</button>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>
</div>

@endsection

@push('js')

<script>
  $(document).ready(function(){

  });
</script>
@endpush