Onkel-Werner-Freizeiten/CampOrganizer2
1
1
Fork 0
Code Issues 7 Pull Requests Packages Projects Releases Wiki Activity

finetuning in layout

Browse Source
This commit is contained in:
Jottyfan
2024-02-23 11:50:33 +01:00
parent 8f69320505
commit 72952b9c7b
3 changed files with 31 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/main/resources/templates/camplist.html
View File

@@ -7,10 +7,6 @@
<body>
<th:block layout:fragment="content">
<div class="mainpage">
<div class="alert alert-warning alert-dismissible fade show block660" role="alert">
<span>alte Zugangsdaten ins neue System </span><a th:href="@{/migration/login}">umziehen</a>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Schließen"></button>
</div>
<div th:replace="~{/fragments/camplist.html::camplist(camps=${camps})}"></div>
</div>
</th:block>

63
src/main/resources/templates/fragments/camplist.html
View File

@@ -12,40 +12,37 @@
</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">
<table style="width: 100%">
<tr>
<td rowspan="5"><img th:src="@{/images/Icon_Stern.svg}" width="36px" height="36px" style="margin-left: 24px" /></td>
<td rowspan="5">
<div>
Biblische Geschichten<br /> Nachtwanderung<br /> Gruppenspiele<br /> Ausflüge<br /> Überraschungen
<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">
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>
</td>
<td><span class="cabin">Ort</span></td>
<td><a th:href="${c.url}" th:text="${c.locationName}" target="_blank"></a></td>
</tr>
<tr>
<td><img th:src="@{/images/Icon_Alter.svg}" width="36px" height="36px" style="margin-top: 24px" /></td>
<td><div th:text="${c.minAge} + ' - ' + ${c.maxAge} + ' Jahre'" style="margin-top: 24px"></div></td>
</tr>
<tr>
<td><img th:src="@{/images/Icon_Datum.svg}" width="36px" height="36px" style="margin-top: 24px" /></td>
<td><div th:text="${#temporals.format(c.arrive, 'dd.MM.')} + ' - ' + ${#temporals.format(c.depart, 'dd.MM.yyyy')}" th:if="${c.arrive != null&& c.depart != null}"
style="margin-top: 24px"></div></td>
</tr>
<tr>
<td><img th:src="@{/images/Icon_Preis.svg}" width="36px" height="36px" style="margin-top: 24px" /></td>
<td><div style="margin-top: 24px">
<p th:text="${c.price}"></p>
</div></td>
</tr>
<tr th:if="${c.bedsFemale + c.bedsMale > 0}">
<td><img th:src="@{/images/Icon_Bett.svg}" width="36px" height="36px" style="margin-top: 24px" /></td>
<td><div style="margin-top: 24px">
<p style="width: 200px" th:utext="${'es sind nur noch <br />' + (c.bedsFemale - c.blockedBedsFemale - c.usedBedsFemale) + ' Mädchen- und ' + (c.bedsMale - c.blockedBedsMale - c.usedBedsMale) + ' Jungs-<br />von ' + (c.bedsFemale + c.bedsMale) + ' Betten frei'}"></p>
</div></td>
</tr>
</table>
<div style="text-align: center; margin-top: 64px">
</div>
</div>
<div class="row g-5" th:if="${c.bedsFemale + c.bedsMale > 0}">
<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>
</div>
<div style="text-align: center; margin-top: 48px">
<a class="btn btn-linda buttonfont" th:href="@{/registration/{id}(id=${c.pk})}">jetzt anmelden</a>
</div>
</div>