@extends('layouts.app')

@section('title')
    Start Balloting
@stop

@section('breadcrumb')
    <ol class="breadcrumb pull-right">
        <li><a href="{{ route('home') }}"><i class="fa fa-dashboard"></i> Home</a></li>

        <li class="active">Start Balloting </li>
    </ol>
@stop
@section('css')
    <style>
        .help-block {
            font-weight: bold;
        }

        span {
            display: inline-block;
        }
        .select2-container--default .select2-selection--single {
  width: 300px;
}
.slider {
  height: 30px;
  -webkit-appearance: none;
  appearance: none;
  background-color: #ddd;
  outline: none;
  padding: 0;
  margin: 0;
  border-radius: 0px;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #555;
  cursor: pointer;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.slider::-moz-range-thumb {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #555;
  cursor: pointer;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

    </style>

@stop

@section('content')

    <div class="container-fluid">
        <div class="row">

            {{-- <form class="form-horizontal" method='post' action="{{ route('balloting.start.store') }}"
                enctype="multipart/form-data" onsubmit="return preConfirm(this)">
                {{ csrf_field() }} --}}
                <div class="col-md-12">
                    @if ($errors->any())
                        <div class="white-box">
                            <h2>Errors</h2>
                            <ul>
                                {!! implode('', $errors->all('<li><span class="help-block"><strong>:message</strong></span></li>')) !!}
                            </ul>
                        </div>
                    @endif
                    <div class="white-box">
                        <h3 class="box-title m-b-0"><i class="icon-layers fa-fw"></i> Start Balloting</h3>
                        <p  class="text-muted  font-18">Some Pre-Conditions Before Start Balloting</p>
                        <p class="text-muted  font-13"> Note: All * fields are mandatory </p>

                        <hr>

                    </div>
                </div>










                @livewire('start-balloting')



              


        </div>
    </div>


    {{-- </form> --}}
    </div>
    </div>
    


@stop


@section('js')
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
@livewireScripts
@stop