63 lines
3.8 KiB
HTML
63 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns:th="http://www.thymeleaf.org" layout:decorate="~{template}" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
|
|
<body>
|
|
<div th:fragment="camplist(camps)">
|
|
<div class="accordion block660" id="accordionExample">
|
|
<div class="accordion-item" th:each="c : ${camps}">
|
|
<h2 class="accordion-header" style="background: transparent" th:id="'heading' + ${c.pk}">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" th:data-bs-target="'#collapse' + ${c.pk}" aria-expanded="false" th:aria-controls="'collapse' + ${c.pk}">
|
|
<span th:text="${c.name}" class="headlinefont"></span><span class="headlinefont"> </span><span th:text="${#numbers.formatInteger(c.year, 0)}" class="headlinefont"
|
|
th:if="${c.year != null}"></span>
|
|
</button>
|
|
</h2>
|
|
<div th:id="'collapse' + ${c.pk}" class="accordion-collapse collapse" th:aria-labelledby="'heading' + ${c.pk}" data-bs-parent="#accordionExample">
|
|
<div class="accordion-body">
|
|
<div class="container">
|
|
<div class="row g-5">
|
|
<div class="col-2 d-flex align-items-center">
|
|
<img th:src="@{/images/Icon_Stern.svg}" width="36px" height="36px" />
|
|
</div>
|
|
<div class="col-4 d-flex align-items-center" th:utext="${c.campdescription}">
|
|
Biblische Geschichten<br /> Nachtwanderung<br /> Gruppenspiele<br /> Ausflüge<br /> Überraschungen
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="container">
|
|
<div class="row g-3">
|
|
<div class="col-4 cabin">Ort</div>
|
|
<div class="col-8">
|
|
<a th:href="${c.url}" th:text="${c.locationName}" target="_blank"></a>
|
|
</div>
|
|
<div class="col-4"><img th:src="@{/images/Icon_Alter.svg}" width="36px" height="36px" /></div>
|
|
<div class="col-8" th:text="${c.minAge} + ' - ' + ${c.maxAge} + ' Jahre'"></div>
|
|
<div class="col-4"><img th:src="@{/images/Icon_Datum.svg}" width="36px" height="36px" /></div>
|
|
<div class="col-8"><span th:text="${#temporals.format(c.arrive, 'dd.MM.')} + ' - ' + ${#temporals.format(c.depart, 'dd.MM.yyyy')}" th:if="${c.arrive != null && c.depart != null}"></span></div>
|
|
<div class="col-4"><img th:src="@{/images/Icon_Preis.svg}" width="36px" height="36px" /></div>
|
|
<div class="col-8"><p th:text="${c.price}"></p></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row g-5" th:if="${c.bedsFemale + c.bedsMale > 0 and c.bookingHasStarted}">
|
|
<div class="col-2"><img th:src="@{/images/Icon_Bett.svg}" width="48px" height="48px" /></div>
|
|
<div class="col-10 d-flex align-items-center" th:text="${'es sind nur noch ' + (c.bedsFemale - c.blockedBedsFemale - c.usedBedsFemale) + ' Mädchen- und ' + (c.bedsMale - c.blockedBedsMale - c.usedBedsMale) + ' Jungs- von ' + (c.bedsFemale + c.bedsMale) + ' Betten frei'}"></div>
|
|
<div class="col-12 alert alert-info alert-dismissible fade show" role="alert">
|
|
Sollten alle Betten bereits belegt sein, wird Deine Anmeldung auf die Warteliste gesetzt.
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Schließen"></button>
|
|
</div>
|
|
</div>
|
|
<div class="row g-5" th:unless="${c.bookingHasStarted}">
|
|
<div class="col-12 alert alert-info" role="alert">
|
|
Die Anmeldung wird erst am <span th:text="${#temporals.format(c.startBooking, 'dd.MM.yyyy, HH:mm')}"></span> Uhr, freigeschaltet.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: center; margin-top: 48px" th:if="${c.bookingHasStarted}">
|
|
<a class="btn btn-linda buttonfont" th:href="@{/registration/{id}(id=${c.pk})}">jetzt anmelden</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |