@extends('frontend_landing_page.master')

@section('content')

@php 
        $allpage = DB::table('all_page_images')->where('id', 1)->first(); 
    @endphp

<style>
    .display{
        display: none!important;
    }
</style>

<div class="container-fluid pt-5 bg-primary hero-header">
        <div class="container pt-5">
            <div class="row g-5 pt-5">
                <div class="col-lg-6 align-self-center text-center text-lg-start mb-lg-5">
                    <h1 class="display-4 text-white mb-4 animated slideInRight">Register</h1>
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb justify-content-center justify-content-lg-start mb-0">
                            <li class="breadcrumb-item"><a class="text-white" href="{{ URL('/')}}">Home</a></li>
                            
                            <li class="breadcrumb-item text-white active" aria-current="page">Register</li>
                        </ol>
                    </nav>
                </div>
                <div class="col-lg-6 align-self-end text-center text-lg-end">
                    <img class="img-fluid" src=" {{ URL::to($allpage->image) }}" alt="image" style="max-height: 300px;">
                </div>
            </div>
        </div>
    </div>
    <!-- Hero End -->


    <!-- Full Screen Search Start -->
    <div class="modal fade" id="searchModal" tabindex="-1">
        <div class="modal-dialog modal-fullscreen">
            <div class="modal-content" style="background: rgba(20, 24, 62, 0.7);">
                <div class="modal-header border-0">
                    <button type="button" class="btn btn-square bg-white btn-close" data-bs-dismiss="modal"
                        aria-label="Close"></button>
                </div>
                <div class="modal-body d-flex align-items-center justify-content-center">
                    <div class="input-group" style="max-width: 600px;">
                        <input type="text" class="form-control bg-transparent border-light p-3"
                            placeholder="Type search keyword">
                        <button class="btn btn-light px-4"><i class="bi bi-search"></i></button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Full Screen Search End -->


    <!-- Contact Start -->
    <div class="container-fluid py-5">
        <div class="container py-5">
            <div class="mx-auto text-center wow fadeIn" data-wow-delay="0.1s" style="max-width: 500px;">
         
                <h1 class="mb-4">Register</h1>
               
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-7">
                   
                    <div class="wow fadeIn" data-wow-delay="0.3s">
                    <form action="{{ route('register') }}" method="POST">
                                @csrf
                            <div class="row g-3">
                            <div class="col-md-12">
                                    <div class="form-floating">
                                        <input type="text" name="name" class="form-control" placeholder="Your Name" required>
                                        <label >Name</label>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-floating">
                                        <input type="text" name="phone" class="form-control" placeholder="Your Phone" required>
                                        <label >Phone</label>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-floating">
                                        <input type="email" name="email" class="form-control" placeholder="Your Email" required>
                                        <label >Email</label>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-floating">
                                        <input type="password" name="password" class="form-control"  placeholder="Your Password" required>
                                        <label >Password</label>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-floating">
                                        <input type="password" name="password_confirmation" class="form-control"  placeholder="Confirm Password" required>
                                        <label >Confirm Password</label>
                                    </div>
                                </div>
                               
                             
                                
                                <div class="col-6">
                                    <button class="btn btn-primary w-100 py-3" type="submit">REGISTER</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Contact End -->
        
    <script>
$('input[name="phone"]').keypress(
    function(event) {
        if (event.keyCode == 46 || event.keyCode == 8) {
            //do nothing
        } else {
            if (event.keyCode < 48 || event.keyCode > 57) {
                event.preventDefault();
            }
        }
    }
);
</script>

@endsection