@extends('rubandroll.layouts.app')

@section('meta-title')Kapcsolat - Rub & Roll Barbecue @endsection

@section('meta-keywords') @endsection

@section('meta-description') @endsection

@section('content')

<section id="page-title" class="page-title bg-overlay {{--bg-parallax--}} bg-overlay-gradient">
    <div class="bg-section">
        @if($page->image)
        <img src="{{ url($page->getFirstMediaUrl('image', 'cover')) }}" alt="" />
        @else
        <img src="assets/images/page-title/4.jpg" alt="Background" />
        @endif
    </div>
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12">
                <div class="col-xs-12 col-sm-12 col-md-12">
	                <div class="title title-8 text-center">
	                    <div class="title--content">
	                        <div class="title--subtitle">Rub & Roll</div>
	                        <div class="title--heading">
	                            <h1>{{ __('Kapcsolat') }}</h1>
	                        </div>
	                    </div>
	                    <div class="clearfix"></div>
	                </div>
	            </div>
            </div>
        </div>
    </div>
</section>

<section id="contact1" class="contact contact-1">
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12">
                <div class="form-container">
                    <div class="row">
                        <div class="col-xs-12 col-sm-12 col-md-6">
                            <div class="contact--desc">
                                {!! $page->body !!}
                            </div>
                            <div class="row mb-30">
                                <div class="col-xs-12 col-sm-6 col-md-6">
                                    <div class="contact--info">
                                        <h3>{{ __('Címünk') }}</h3>
                                        <p>1055 Budapest, Szent István körút 13.</p>
                                        <p>2100 Gödöllő, Táncsics Mihály út 5.</p>
                                        <a class="link--styled" href="#" target="_blank">{{ __('Útvonaltervezés') }}</a>
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-6 col-md-6">
                                    <div class="contact--info">
                                        <h3>{{ __('Telefon') }}</h3>
                                        <p>+36 1 611 0199</p>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-xs-12 col-sm-6 col-md-6">
                                    <div class="contact--info">
                                        <h3>{{ __('Email címünk') }}</h3>
                                        <p>hello@rubandroll.hu</p>
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-6 col-md-6">
                                    <div class="contact--info">
                                        <h3>{{ __('Kövess minket') }}</h3>
                                        <div class="social-icons">
                                            <a href="https://www.facebook.com/rubandroll/" target="_blank"><i class="fa fa-facebook"></i></a>
                                            <a href="https://www.instagram.com/rubandrollbbq/" target="_blank"><i class="fa fa-instagram"></i></a>
                                            <a href="https://www.tripadvisor.co.hu/Restaurant_Review-g274887-d9459367-Reviews-Rub_Roll_Barbecue-Budapest_Central_Hungary.html" target="_blank"><i class="fa fa-tripadvisor"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xs-12 col-sm-12 col-md-6">
                            <div class="contact-form">
                                <form method="post" action="assets/php/contact.php" class="contactForm mb-0">
                                    @csrf
{{--                                    <form method="post" action="{{ action('PageController@postContact') }}" class="contactForm mb-0">--}}

                                    <div class="row">
                                        <div class="col-md-12">
                                            <input type="text" class="form-control" name="name" id="name" placeholder="{{ __('Név') }}:" required>
                                        </div>
{{--                                        <div class="col-md-6">--}}
{{--                                            <input type="text" class="form-control" name="contact-last" id="last" placeholder="{{ __('Keresztnév') }}" required>--}}
{{--                                        </div>--}}
                                        <div class="col-md-6">
                                            <input type="email" class="form-control" name="email" id="email" placeholder="{{ __('Email cím') }}:" required>
                                        </div>
                                        <div class="col-md-6">
                                            <input type="text" class="form-control" name="phone" id="phone" placeholder="{{ __('Telefonszám') }}:" required>
                                        </div>
                                        <div class="col-md-12">
                                            <textarea class="form-control" name="message" id="message" rows="2" placeholder="{{ __('Üzenet') }}" required></textarea>
                                        </div>
                                        <div class="col-md-12">
                                            <input type="submit" value="{{ __('Küldés') }}" name="submit" class="btn btn--secondary btn--block mt-10">
                                        </div>
                                        <div class="col-xs-12 col-sm-12 col-md-12">
											<!--Alert Message-->
                            				<div class="contact-result"></div>
										</div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="google-maps pb-0 pt-0">
    <div class="container-fluid pr-0 pl-0">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 pr-0 pl-0">
                <div id="googleMap" style="width:100%;height:350px;">
                </div>
            </div>
        </div>
    </div>
    <script src="assets/js/jquery-2.2.4.min.js"></script>
    <script src="https://maps.google.com/maps/api/js?sensor=true&amp;key=AIzaSyDCxFtCYvLWTZcu_6ow8hEeUxEtHh3-JCI"></script>
    <script src="assets/js/plugins/jquery.gmap.min.js"></script>

    <script>
        $('#googleMap').gMap({
            address: "1055 Budapest Szent István körút 13.",
            zoom: 15,
            maptype: 'ROADMAP',
            markers: [{
                address: "1055 Budapest Szent István körút 13.",
                maptype: 'ROADMAP',
                icon: {
                    image: "assets/images/marker.png",
                    iconsize: [76, 61],
                    iconanchor: [17, 35]
                }
            }]
        });

    </script>
</section>

@endsection