JourneyJoker/templates/frontend/index.html

299 lines
20 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends "frontend/base.html" %}
{% load static %}
{% load i18n %}
{% load testimonials %}
{% load dbsetting %}
{% load offeroptions %}
{% block "styles" %}
<link rel="stylesheet" href="{% static "vendor/css/jquery-ui.css" %}">
{% endblock %}
{% block "content" %}
<!--========================= FLEX SLIDER =====================-->
<section class="flexslider-container" id="flexslider-container-1">
<div class="flexslider slider" id="slider-1">
<ul class="slides">
<li class="item-1" style="background:linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)),url({% static "frontend/images/stgilgen.jpg" %}) 50% 0%;background-size:cover;
height:100%;">
<div class=" meta">
<div class="container">
<h2>{% trans "Willkommen bei JourneyJoker" %}</h2>
<h1>{% trans "Mein Urlaub nach Maß" %}</h1>
<a href="#" class="btn btn-default">{% trans "Wie geht das?" %}</a>
</div><!-- end container -->
</div><!-- end meta -->
</li><!-- end item-1 -->
<!--<li class="item-2" style="background:linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)),url({% static "frontend/images/homepage-slider-1.jpg" %}) 50% 0%;background-size:cover;
height:100%;">
<div class=" meta">
<div class="container">
<h2>Discover</h2>
<h1>Australia</h1>
<a href="#" class="btn btn-default">View More</a>
</div>
</div>
</li>-->
</ul>
</div><!-- end slider -->
{% if request.user.is_superuser or not request.user.partnerprofile %}
<div class="search-tabs" id="search-tabs-1">
<div class="container">
<div class="row">
<div class="col-md-12">
<ul class="nav nav-tabs justify-content-center">
<li class="nav-item active"><div style="background-color: white;" class="nav-link" onclick="return false;" href="#"><span><i class="fa fa-building"></i></span><span class="d-md-inline-flex d-none st-text">Angebote einholen</span></div></li>
</ul>
<div class="tab-content">
<div id="flights" class="tab-pane in active">
<form method="POST" action="{% url "auction:create_inquiry" %}">
{% csrf_token %}
<div class="row">
<div class="col-12 col-md-12 col-lg-5 col-xl-4">
<div class="row">
<div class="col-12 col-md-6 col-lg-6">
<div class="form-group left-icon">
<input id="id_destination_name" name="destination_name" type="text" class="form-control" required placeholder="{% trans "Zielort" %}" >
<input id="id_destination_lat" name="destination_lat" type="text" style="display: none;">
<input id="id_destination_lon" name="destination_lon" type="text" style="display: none;">
<i class="fa fa-map-marker"></i>
</div>
</div><!-- end columns -->
<div class="col-12 col-md-6 col-lg-6">
<div class="form-group left-icon">
<input id="id_budget" name="budget" type="number" step="1" class="form-control" required placeholder="{% trans "Budget" %}" >
<i class="fa fa-euro-sign"></i>
</div>
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end columns -->
<div class="col-12 col-md-12 col-lg-5 col-xl-4">
<div class="row">
<div class="col-6 col-md-6 col-lg-6">
<div class="form-group left-icon">
<input id="id_arrival" name="arrival" type="text" class="form-control dpd1" required placeholder="{% trans "Anreise" %}" >
<i class="fa fa-calendar"></i>
</div>
</div><!-- end columns -->
<div class="col-6 col-md-6 col-lg-6">
<div class="form-group right-icon">
<select id="id_min_nights" name="min_nights" class="form-control">
<option value="0">Dauer Egal!</option>
<option value="1">Kurztrip (2 3 Nächte)</option>
<option value="2">mehr als 3 Nächte</option>
</select>
<i class="fa fa-clock"></i>
</div>
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end columns -->
<div class="col-12 col-md-12 col-lg-2 col-xl-2">
<div class="row">
<div class="col-6 col-md-6 col-lg-6">
<div class="form-group right-icon">
<select id="id_adults" name="adults" class="form-control">
<option value="1">1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Erwachsene*r</option>
<option value="2">2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Erwachsene</option>
<option value="3">3&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Erwachsene</option>
<option value="4">4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Erwachsene</option>
<option value="5">5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Erwachsene</option>
</select>
<i class="fa fa-users"></i>
</div>
</div>
<div class="col-6 col-md-6 col-lg-6">
<div class="form-group right-icon">
<select id="id_children" name="children" class="form-control">
<option value="0">0&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kinder</option>
<option value="1">1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kind</option>
<option value="2">2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kinder</option>
<option value="3">3&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kinder</option>
<option value="4">4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kinder</option>
<option value="5">5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Kinder</option>
</select>
<i class="fa fa-child"></i>
</div>
</div>
</div>
</div><!-- end columns -->
<div class="col-12 col-md-12 col-lg-12 col-xl-2 search-btn">
<button class="btn btn-orange">{% trans "Los!" %}</button>
</div><!-- end columns -->
</div><!-- end row -->
</form>
</div><!-- end flights -->
</div><!-- end tab-content -->
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end container -->
</div><!-- end search-tabs -->
{% endif %}
</section><!-- end flexslider-container -->
<!--=============== HOTEL OFFERS ===============-->
<section id="hotel-offers" class="section-padding">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="page-heading">
<h2>Teilnehmende Hotels</h2>
<hr class="heading-line" />
</div><!-- end page-heading -->
<div class="owl-carousel owl-theme owl-custom-arrow" id="owl-hotel-offers">
<div class="item">
<div class="main-block hotel-block">
<div class="main-img">
<a href="#">
<img src="{% static "frontend/images/hotel-1.jpg" %}" class="img-fluid" alt="hotel-img" />
</a>
<div class="main-mask">
<ul class="list-unstyled list-inline offer-price-1">
<li class="list-inline-item price">12<span class="divider">|</span><span class="pkg">Buchungen diese Woche</span></li>
<li class="list-inline-item rating">
{% autoescape off %}{% stars 5 1 "orange" %}{% endautoescape %}
{% autoescape off %}{% hearts 5 "red" %}{% endautoescape %}
</li>
</ul>
</div><!-- end main-mask -->
</div><!-- end offer-img -->
<div class="main-info hotel-info">
<div class="arrow">
<a href="#"><span><i class="fa fa-angle-right"></i></span></a>
</div><!-- end arrow -->
<div class="main-title hotel-title">
<a href="#">Habbo Hotel</a>
<p>1010 Wien</p>
</div><!-- end hotel-title -->
</div><!-- end hotel-info -->
</div><!-- end hotel-block -->
</div><!-- end item -->
</div><!-- end owl-hotel-offers -->
<div class="view-all text-center">
<a href="#" class="btn btn-orange">{% trans "Alle anzeigen" %}</a>
</div><!-- end view-all -->
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end container -->
</section><!-- end hotel-offers -->
<!--==================== HIGHLIGHTS ====================-->
<section id="highlights" class="section-padding back-size">
<div class="container">
<div class="row">
<div class="col-12 col-md-12 col-lg-12 col-xl-12">
<div class="row">
<div class="col-12 col-md-4 col-lg-4 col-xl-4 d-flex justify-content-center">
<div class="highlight-box">
<div class="h-icon">
<span><i class="fa fa-user-astronaut"></i></span>
</div><!-- end h-icon -->
<div class="h-text">
<span class="numbers">2496</span>
<p>{% trans "zufriedene Kunden" %}</p>
</div><!-- end h-text -->
</div><!-- end highlight-box -->
</div><!-- end columns -->
<div class="col-12 col-md-4 col-lg-4 col-xl-4 d-flex justify-content-center">
<div class="highlight-box">
<div class="h-icon">
<span><i class="fa fa-concierge-bell"></i></span>
</div><!-- end h-icon -->
<div class="h-text cruise">
<span class="numbers">1906</span>
<p>{% trans "teilnehmende Unterkünfte" %}</p>
</div><!-- end h-text -->
</div><!-- end highlight-box -->
</div><!-- end columns -->
<div class="col-12 col-md-4 col-lg-4 col-xl-4 d-flex justify-content-center">
<div class="highlight-box">
<div class="h-icon">
<span><i class="fa fa-compass"></i></span>
</div><!-- end h-icon -->
<div class="h-text taxi">
<span class="numbers">2033</span>
<p>{% trans "gebuchte Reisen" %}</p>
</div><!-- end h-text -->
</div><!-- end highlight-box -->
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end container -->
</section><!-- end highlights -->
<!--==================== TESTIMONIALS ====================-->
<section id="testimonials" class="section-padding back-size">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="page-heading white-heading">
<h2>{% trans "Kundenmeinungen" %}</h2>
<hr class="heading-line" />
</div><!-- end page-heading -->
<div class="carousel slide" data-ride="carousel" id="quote-carousel">
<div class="carousel-inner text-center">
{% testimonials as test %}
{% for t in test %}
<div class="carousel-item {% if forloop.first %}active{% endif %}">
<blockquote>{{ t.text }}</blockquote>
<div class="rating">
{% autoescape off %}{% stars t.stars %}{% endautoescape %}
{% autoescape off %}{% hearts t.hearts %}{% endautoescape %}
</div>
<small>{{ t.name }}</small>
</div><!-- end item -->
{% endfor %}
</div><!-- end carousel-inner -->
<ol class="carousel-indicators mx-auto">
{% for t in test %}
<li data-target="#quote-carousel" data-slide-to="{{ forloop.counter0 }}" class="active"><img src="{{ t.image.url }}" class="img-fluid d-block" alt="client-img"></li>
{% endfor %}
</ol>
</div><!-- end quote-carousel -->
</div><!-- end columns -->
</div><!-- end row -->
</div><!-- end container -->
</section><!-- end testimonials -->
{% endblock %}
{% block "scripts" %}
<script src="{% static "vendor/js/jquery-ui.js" %}"></script>
<script src="{% static "frontend/js/custom-autocomplete.js" %}"></script>
{% endblock %}