@extends('layout.app')

@section('content')

<div class="flex flex-col mt-2">
    <div class=" bg-white p-2 rounded-lg">
        <form action="" id="search">
            @csrf
            <div class="border-2 mb-2">

                <div class="bg-blue-100 block pt-4 pb-1">

                    <div class="grid md:grid-cols-3 gap-2">
                        <div class="px-2 flex justify-between items-center">
                            <label class="flex-1 block text-gray-700 text-sm font-bold mb-2" for="from_date">
                                Role Name
                            </label>

                            
                            <input
                            class="flex-1 relative w-full bg-white border border-gray-300 rounded-md shadow-sm pl-3 pr-10 py-2 text-left cursor-default focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
                               
                                name="name" type="text" placeholder="" required>
                        </div>

                       


                    </div>


                    <div class="grid grid-cols-2 p-2">


                        <div class="px-2 flex justify-between items-center">
                            

                            
                        </div>

                        <div>
                            <div class="flex justify-end">
                                <input type="hidden" name="changeType" value="packageChange">
                                <button @click="search"
                                    class="inline-block px-6 py-2 text-white bg-blue-600 float-right mr-2 mb-2"
                                    type="submit" id="searchBtn"><i class="fa fa-save"></i> Save</button>
                                <button class="inline-block px-4 py-2 text-white bg-yellow-600 float-right mr-2 mb-2"
                                    type="reset" id="reset">Reset</button>

                            </div>

                        </div>
                    </div>




                </div>


            </div>
        </form>





        
    </div>
</div>



@endsection

