@extends('layouts.front')

@section('title')

Pet Clap || Profile Setup step-1

@stop

@section('page-class')
    user-profile-fluid user-profile2-fluid
@parent
@stop

@section('content')
<div class="container user-form-2">
    <div class="custom-form-2">
        <div class="row">
            <div class="col-12">
                <form id="step2-form" action="{{route('provider.save.profile.step2')}}">
                    <div class="upper-style">
                        <h2>Tick and fill the rates of Services you provide</h2>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Pet Walking</label>
                            <span class="custom-user-label">
                                <input name="range" id="" type="text" placeholder="00.00">
                                <b>Walk</b>
                            </span>
                        </div>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Pet Training</label>
                            <span class="custom-user-label">
                                <input name="range" id="" type="text" placeholder="00.00">
                                <b>Session</b>
                            </span>
                        </div>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Pet Grooming</label>
                        </div>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Basic Grooming</label>
                            <span class="custom-user-label">
                                <input name="range" id="" type="text" placeholder="00.00">
                                <b>Service</b> (Bath, Dry, Ear Clean and Nail Trip)
                            </span>
                        </div>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Full Grooming</label>
                            <span class="custom-user-label">
                                <input name="range" id="" type="text" placeholder="00.00">
                                <b>Service</b> (Hair Cut, Bath, Dry, Ear Clean and Nail Trip)
                            </span>
                        </div>
                        <div class="form-group mt-3 mb-3">
                            <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Boarding and Day Care</label>
                            <span class="custom-user-label">
                                <input name="range" id="" type="text" placeholder="00.00">
                                <b>Night & Day</b>
                            </span>
                        </div>
                    </div>
                    <div class="lower-style row mb-4">
                        <div class="col-12">
                            <h2>About your service place (optional)</h2>
                        </div>
                        <div class="col-6 lower-left">
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">You have Kids (1-10 Years)</label>
                                <span class="custom-user-label">
                                    <input name="range" id="" type="text" placeholder="No. of Kids">
                                </span>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Has a Fenced Yard</label>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Smoking Household</label>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Air Conditioner</label>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Have Dog</label>
                                <span class="custom-user-label">
                                    <input name="range" id="" type="text" placeholder="Dog Breed" class="mr-3">
                                    <input name="range" id="" type="text" placeholder="Weight in lbs">
                                </span>
                            </div>
                        </div>
                        <div class="col-6 lower-right">
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Your Own House/Flat</label>
                                <span class="custom-user-label">
                                    <input name="range" id="" type="text" placeholder="Number of floors/BHK">
                                </span>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Have a garden near you?</label>
                                <span class="custom-user-label">
                                    <input name="range" id="" type="text" placeholder="How far in metres?">
                                </span>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Have Cats?</label>
                                <span class="custom-user-label">
                                    <input name="range" id="" type="text" placeholder="Number of Cats">
                                </span>
                            </div>
                            <div class="form-group mt-3 mb-3">
                                <label class="ml-3 mr-3"><input type="checkbox" class="mr-3" name="">Do you have cage ?</label>
                            </div>
                        </div>
                        <div class="col-12 mt-3">
                            <div class="form-group custom-user-text">
                                <label for="experience"><b>Total Working Experience</b></label>
                                <span class="custom-user-label ml-2">
                                    <input name="experience" id="" type="text" placeholder="Experience" required data-parsley-required-message="Please provide experience">
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="custom-form-button">
                        <a href="user-profile1.html">
                            <button type="button" class="btn btn-styling mr-3" data-toggle="modal" data-target="">Back
                            </button>
                        </a>
                        <a href="user-profile3.html">
                            <button type="submit" class="btn btn-styling" data-toggle="modal" data-target="">Next
                                <i class="fa fa-arrow-right ml-2" aria-hidden="true"></i>
                            </button>
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>


@section('scripts')
<script src="{{asset('front/js/vendor/parsley.min.js')}}"></script>

<script type="text/javascript">

    $("#step2-form").parsley({
       errorClass: 'is-invalid text-danger',
       successClass: 'is-valid',
       errorsWrapper: '<span class="form-text text-danger"></span>',
       errorTemplate: '<span></span>',
       trigger: 'change'
    });

</script>


@parent
@stop 

@endsection