config html form

master
Gustavo Luigi 2022-07-07 21:22:26 +02:00
parent 0b937d63fa
commit 8a41cb03ff
1 changed files with 198 additions and 262 deletions

View File

@ -1,31 +1,25 @@
@extends('template.'.config('settings.template').'.content.master') @extends('template.'.config('settings.template').'.content.master')
@section('content') @section('head')




<div class="row" style="padding-top: 60px;">
<div class="col-6">
<h1 class="mt-2">Alpaka Tour</h1>
<br>

<style> <style>
p{ p{
font-size: 20px; font-size: 20px;
margin-bottom: 23px; margin-bottom: 23px;
} }
</style> </style>

@stop
@section('content')
<div class="row" style="padding-top: 60px;">
<div class="col-6">
<h1 class="mt-2">Alpaka Tour</h1>
<br>
<p> <p>
Nach einer kurzen Einführung starten wir unsere Wanderung Nach einer kurzen Einführung starten wir unsere Wanderung
</p> </p>

<p> <p>
Sie lernen das sanftmütige Wesen der Tiere näher kennen und genießen die Sie lernen das sanftmütige Wesen der Tiere näher kennen und genießen die
wunderschöne Landschaft. Die Alpakas geben das Tempo vor, so dass die Tour auch für wunderschöne Landschaft. Die Alpakas geben das Tempo vor, so dass die Tour auch für
Kinder geeignet ist. Kinder geeignet ist.
</p> </p>

<p> <p>
Allerdings dürfen Kinder unter 10 Jahren nur in Begleitung eines Allerdings dürfen Kinder unter 10 Jahren nur in Begleitung eines
Erwachsenen ein Alpaka führen. Während der Wanderung erfahren Sie viel Erwachsenen ein Alpaka führen. Während der Wanderung erfahren Sie viel
@ -35,29 +29,21 @@
Unsere Wanderung führt uns größtenteils abseits befahrener Straßen auf Wander - und Unsere Wanderung führt uns größtenteils abseits befahrener Straßen auf Wander - und
Fußwegen durch die Landschaft rund um unseren Hof. Fußwegen durch die Landschaft rund um unseren Hof.
</p> </p>

<p> <p>
Um die Wanderung bequem genießen zu können, empfehlen wir wandertaugliches Um die Wanderung bequem genießen zu können, empfehlen wir wandertaugliches
Schuhwerk und der Witterung angepasste Kleidung. Schuhwerk und der Witterung angepasste Kleidung.
</p> </p>

<p> <p>
Unsere Alpakawanderungen finden bei jeder Witterung und auch im Winter statt. Unsere Alpakawanderungen finden bei jeder Witterung und auch im Winter statt.
</p> </p>

<p> <p>
Hunde dürfen leider nicht mit laufen, weil unsere Alpakas das nicht gewohnt sind. Hunde dürfen leider nicht mit laufen, weil unsere Alpakas das nicht gewohnt sind.
</p> </p>

<p> <p>
Für Rückfragen und Reservierungen stehen wir Ihnen gerne zur Verfügung und Für Rückfragen und Reservierungen stehen wir Ihnen gerne zur Verfügung und
freuen uns auf Ihren Besuch. freuen uns auf Ihren Besuch.
</p> </p>


<h5>Preise</h5> <h5>Preise</h5>


<table class="table"> <table class="table">
<thead> <thead>
<tr> <tr>
@ -69,56 +55,51 @@
<tr> <tr>
<td>Erwachsene mit Alpaka</td> <td>Erwachsene mit Alpaka</td>
<td>20 €</td> <td>20 €</td>

</tr> </tr>
<tr> <tr>
<td>Kinder mit Alpaka</td> <td>Kinder mit Alpaka</td>
<td>15 €</td> <td>15 €</td>

</tr> </tr>
<tr> <tr>
<td>Jede Person ohne Alpaka</td> <td>Jede Person ohne Alpaka</td>
<td>5 €</td> <td>5 €</td>

</tr> </tr>
</tbody> </tbody>
</table> </table>



</div> </div>

<div class="col-5 offset-1 mt-5"> <div class="col-5 offset-1 mt-5">
<div class="card shadow-lg" style="background-color: #ebe5d84d"> <div class="card shadow-lg" style="background-color: #ebe5d84d">
<div class="card-body"> <div class="card-body">
<form> @if(session()->has('success'))
<div class="alert alert-success">
{{session()->get('success')}}
</div>
@endif
@if(session()->has('error'))
<div class="alert alert-danger">
{{session()->get('error')}}
</div>
@endif
<x-form id-name="reserva-tour" channels="resposta-cliente,notificacao-fazenda">
<h4 class="text-center">Alpaka Tour Anfragen</h5> <h4 class="text-center">Alpaka Tour Anfragen</h5>
<br> <br>

<div class="mb-4"> <div class="mb-4">
<label for="exampleInputEmail1" class="form-label">Vor und Nachname</label> <label for="exampleInputEmail1" class="form-label">Vor und Nachname</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Max Meyer" name="name"> <input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Max Meyer" name="name">
</div> </div>

<div class="mb-4"> <div class="mb-4">
<label for="exampleInputEmail1" class="form-label">Telefonnummer</label> <label for="exampleInputEmail1" class="form-label">Telefonnummer</label>
<input type="tel" class="form-control" id="exampleInputEmail1" name="tel" aria-describedby="emailHelp" placeholder="09654 5529550"> <input type="tel" class="form-control" id="exampleInputEmail1" name="tel" aria-describedby="emailHelp" placeholder="09654 5529550">
</div> </div>

<div class="mb-4"> <div class="mb-4">
<label for="exampleInputEmail1" class="form-label">E-Mail Adresse</label> <label for="exampleInputEmail1" class="form-label">E-Mail Adresse</label>
<input type="email" class="form-control" name="email" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="vor.nachname@areya.de" > <input type="email" class="form-control" name="email" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="vor.nachname@areya.de" >
</div> </div>


<div class="mb-5"> <div class="mb-5">
<label for="exampleInputEmail1" class="form-label">Wunschdatum Alpakatour</label> <label for="exampleInputEmail1" class="form-label">Wunschdatum Alpakatour</label>
<input type="date" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" min="2021-07-17"> <input type="date" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" min="2021-07-17">
</div> </div>

<div class="row"> <div class="row">
<div class="col-6"> <div class="col-6">
<div class="mb-5"> <div class="mb-5">
@ -141,7 +122,6 @@
<div class="col-6"> <div class="col-6">
<div class="mb-5"> <div class="mb-5">
<label for="anzahlkinder" class="form-label">Anzahl Kinder</label> <label for="anzahlkinder" class="form-label">Anzahl Kinder</label>

<select class="form-select" aria-label="Default select example" id="anzahlkinder"> <select class="form-select" aria-label="Default select example" id="anzahlkinder">
<option selected disabled>Anzahl Kinder</option> <option selected disabled>Anzahl Kinder</option>
<option value="1">1</option> <option value="1">1</option>
@ -158,10 +138,8 @@
</div> </div>
</div> </div>
</div> </div>

<div class="mb-5"> <div class="mb-5">
<label for="anzahlkinder" class="form-label">Anzahl Alpakas</label> <label for="anzahlkinder" class="form-label">Anzahl Alpakas</label>

<select class="form-select" aria-label="Default select example" id="anzahlalpakas"> <select class="form-select" aria-label="Default select example" id="anzahlalpakas">
<option selected disabled>Anzahl Alpakas</option> <option selected disabled>Anzahl Alpakas</option>
<option value="1">1</option> <option value="1">1</option>
@ -171,16 +149,11 @@
<option value="5">5</option> <option value="5">5</option>
<option value="6">6</option> <option value="6">6</option>
<option value="7">7</option> <option value="7">7</option>

</select> </select>
</div> </div>
<br> <br>

<div style="margin-left: 20px;"> <div style="margin-left: 20px;">

<h5>Kosten</h5> <h5>Kosten</h5>


<table class="table"> <table class="table">
<thead> <thead>
<tr> <tr>
@ -194,65 +167,36 @@
<td>1X</td> <td>1X</td>
<td>Kinder</td> <td>Kinder</td>
<td>3456€</td> <td>3456€</td>

</tr> </tr>
<tr> <tr>
<td>2X</td> <td>2X</td>
<td>Erwachsene</td> <td>Erwachsene</td>
<td>345€</td> <td>345€</td>

</tr> </tr>
<tr> <tr>
<td>4X</td> <td>4X</td>
<td>Erwachsene</td> <td>Erwachsene</td>
<td>28€</td> <td>28€</td>

</tr> </tr>

<tr class="fw-bolder"> <tr class="fw-bolder">
<td>Gesammt:</td> <td>Gesammt:</td>
<td></td> <td></td>
<td>28€</td> <td>28€</td>


</tr> </tr>
</tbody> </tbody>
</table> </table>

<p class="fw-light fst-italic" style="font-size:13px;">Geld wird nach Bestätigung per Überweisung oder Bar vor der Tour bezahlt.</p> <p class="fw-light fst-italic" style="font-size:13px;">Geld wird nach Bestätigung per Überweisung oder Bar vor der Tour bezahlt.</p>

</div> </div>
<button type="submit" class="btn btn-ci btn-lg d-block mt-5">


<a class="btn btn-ci btn-lg d-block mt-5">
<svg style="fill: white; width: 18px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M424 336h-96c-22.1 0-40-17.9-40-40s17.9-40 40-40h88s96-107 96-160-43-96-96-96-96 43-96 96c0 29.8 30.3 76.7 56.9 112H328c-48.5 0-88 39.5-88 88s39.5 88 88 88h96c22.1 0 40 17.9 40 40s-17.9 40-40 40H135.1c26.6-35.3 56.9-82.2 56.9-112 0-53-43-96-96-96S0 299 0 352s96 160 96 160h328c48.5 0 88-39.5 88-88s-39.5-88-88-88zM368 96c0-26.5 21.5-48 48-48s48 21.5 48 47.9c-.5 13.4-20.8 48.2-48 84.4-27.2-36.2-47.5-70.9-48-84.3zM96 436.3c-27.2-36.2-47.5-70.9-48-84.3 0-26.5 21.5-48 48-48s48 21.5 48 47.9c-.5 13.4-20.8 48.2-48 84.4zM96 336c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16-7.2-16-16-16zM432 96c0-8.8-7.2-16-16-16s-16 7.2-16 16 7.2 16 16 16 16-7.2 16-16z"/></svg> <svg style="fill: white; width: 18px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M424 336h-96c-22.1 0-40-17.9-40-40s17.9-40 40-40h88s96-107 96-160-43-96-96-96-96 43-96 96c0 29.8 30.3 76.7 56.9 112H328c-48.5 0-88 39.5-88 88s39.5 88 88 88h96c22.1 0 40 17.9 40 40s-17.9 40-40 40H135.1c26.6-35.3 56.9-82.2 56.9-112 0-53-43-96-96-96S0 299 0 352s96 160 96 160h328c48.5 0 88-39.5 88-88s-39.5-88-88-88zM368 96c0-26.5 21.5-48 48-48s48 21.5 48 47.9c-.5 13.4-20.8 48.2-48 84.4-27.2-36.2-47.5-70.9-48-84.3zM96 436.3c-27.2-36.2-47.5-70.9-48-84.3 0-26.5 21.5-48 48-48s48 21.5 48 47.9c-.5 13.4-20.8 48.2-48 84.4zM96 336c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16-7.2-16-16-16zM432 96c0-8.8-7.2-16-16-16s-16 7.2-16 16 7.2 16 16 16 16-7.2 16-16z"/></svg>
Alpaka Tour anfragen Alpaka Tour anfragen
</a> </button>
</form> </x-form>



</div> </div>
</div> </div>


</div> </div>
</div> </div>











<section> <section>

<div class="row text-center" style="font-size: 20px; margin-top:100px;"> <div class="row text-center" style="font-size: 20px; margin-top:100px;">
<div class="col-6 col-md-3 mb-5"> <div class="col-6 col-md-3 mb-5">
<img src="{{asset('template/images/alpakas-1.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy"> <img src="{{asset('template/images/alpakas-1.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
@ -266,16 +210,8 @@
<div class="col-6 col-md-3 mb-5"> <div class="col-6 col-md-3 mb-5">
<img src="{{asset('template/images/alpakas-3.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy"> <img src="{{asset('template/images/alpakas-3.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
</div> </div>

</div> </div>
</section> </section>




@stop @stop


@section('scripts') @section('scripts')

@stop @stop