start page final changes

This commit is contained in:
Jottyfan
2025-05-29 16:51:55 +02:00
parent d3389e4813
commit 82ce501f39
2 changed files with 32 additions and 12 deletions

View File

@ -80,7 +80,7 @@ dependencies {
implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'org.springframework.boot:spring-boot-starter-web'
implementation 'org.springframework.boot:spring-boot-starter-validation' implementation 'org.springframework.boot:spring-boot-starter-validation'
implementation 'org.thymeleaf.extras:thymeleaf-extras-springsecurity6' implementation 'org.thymeleaf.extras:thymeleaf-extras-springsecurity6'
implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect:3.3.0' implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect:3.4.0'
implementation 'commons-io:commons-io:2.15.1' implementation 'commons-io:commons-io:2.15.1'

View File

@ -24,16 +24,41 @@
<a href="#" onclick="$('#fotoblock').fadeOut(1000); $('#welcomeblock').slideDown('slow');" class="btn btn-outline-secondary"><i class="fas fa-arrow-up"></i>&nbsp;Startseite</a> <a href="#" onclick="$('#fotoblock').fadeOut(1000); $('#welcomeblock').slideDown('slow');" class="btn btn-outline-secondary"><i class="fas fa-arrow-up"></i>&nbsp;Startseite</a>
</div> </div>
<div class="col-12"> <div class="col-12">
<th:block th:each="i : ${#numbers.sequence(1, 7)}"> <th:block th:each="i : ${#numbers.sequence(1, 83)}">
<a th:href="'https://www.onkelwernerfreizeiten.de/stock/stock' + ${i} + '.jpg'" data-fancybox="gallery" th:data-caption="'Bild ' + ${i}"> <a th:href="'https://www.onkelwernerfreizeiten.de/stock/stock' + ${#strings.toString(i < 10 ? '0' + i : i)} + '.jpg'" data-fancybox="gallery" th:data-caption="'Bild ' + ${i}">
<img th:src="'https://www.onkelwernerfreizeiten.de/stock/stock' + ${i} + '.jpg'" height="96px" class="m-1" /> <img th:src="'https://www.onkelwernerfreizeiten.de/stock/thumb_stock' + ${#strings.toString(i < 10 ? '0' + i : i)} + '.jpg'" height="96px" class="m-1" />
</a> </a>
</th:block> </th:block>
<script th:inline="javascript"> <script th:inline="javascript">
Fancybox.bind('[data-fancybox="gallery"]', { Fancybox.bind('[data-fancybox="gallery"]', {
}); });
function selectCamp(name) {
$('#fotoblock').slideUp('slow');
$('#infoblock').fadeIn(1000);
$('.description').hide();
$('.campbtn').removeClass('btn-secondary').removeClass('text-white').addClass("btn-secondary-outline");
$('#camp_' + name).show();
$('#btn_' + name).addClass('btn-secondary').removeClass("btn-secondary-outline").addClass('text-white');
}
</script> </script>
</div> </div>
<div class="col-12 center">
<h2 class="headlinefont">Unsere Freizeiten</h2>
</div>
<div class="col-12 center">
<!-- waiting for content from Jan
<button class="btn btn-outline-secondary" onclick="selectCamp('rehe')">Rehe</button>
-->
<button class="btn btn-outline-secondary" onclick="selectCamp('olfen')">Olfen</button>
<button class="btn btn-outline-secondary" onclick="selectCamp('growup')">Grow Up</button>
<button class="btn btn-outline-secondary" onclick="selectCamp('schweiz')">Schweiz</button>
<button class="btn btn-outline-secondary" onclick="selectCamp('heimfreizeit')">Heimfreizeit</button>
<button class="btn btn-outline-secondary" onclick="selectCamp('hohenhaslach')">Hohenhaslach</button>
</div>
<div class="col-12 center mt-3">
<a th:href="@{/camplist}" class="btn btn-outline-danger">zur Anmeldung</a>
</div>
<div class="col-12 center mt-3"> <div class="col-12 center mt-3">
<a href="#" onclick="$('#fotoblock').slideUp('slow'); $('#infoblock').fadeIn(1000);" class="btn btn-outline-secondary"><i class="fas fa-arrow-down"></i>&nbsp;weitere Infos</a> <a href="#" onclick="$('#fotoblock').slideUp('slow'); $('#infoblock').fadeIn(1000);" class="btn btn-outline-secondary"><i class="fas fa-arrow-down"></i>&nbsp;weitere Infos</a>
</div> </div>
@ -45,20 +70,15 @@
<div class="col-12 center"> <div class="col-12 center">
<h2 class="headlinefont">Unsere Freizeiten</h2> <h2 class="headlinefont">Unsere Freizeiten</h2>
</div> </div>
<script th:inline="javascript">
function selectCamp(name) {
$('.description').hide();
$('.campbtn').removeClass('btn-secondary').removeClass('text-white').addClass("btn-secondary-outline");
$('#camp_' + name).show();
$('#btn_' + name).addClass('btn-secondary').removeClass("btn-secondary-outline").addClass('text-white');
}
</script>
<div class="col-12 center"> <div class="col-12 center">
<!-- waiting for content from Jan
<button id="btn_rehe" class="btn btn-outline-secondary campbtn" onclick="selectCamp('rehe')">Rehe</button> <button id="btn_rehe" class="btn btn-outline-secondary campbtn" onclick="selectCamp('rehe')">Rehe</button>
-->
<button id="btn_olfen" class="btn btn-outline-secondary campbtn" onclick="selectCamp('olfen')">Olfen</button> <button id="btn_olfen" class="btn btn-outline-secondary campbtn" onclick="selectCamp('olfen')">Olfen</button>
<button id="btn_growup" class="btn btn-outline-secondary campbtn" onclick="selectCamp('growup')">Grow Up</button> <button id="btn_growup" class="btn btn-outline-secondary campbtn" onclick="selectCamp('growup')">Grow Up</button>
<button id="btn_schweiz" class="btn btn-outline-secondary campbtn" onclick="selectCamp('schweiz')">Schweiz</button> <button id="btn_schweiz" class="btn btn-outline-secondary campbtn" onclick="selectCamp('schweiz')">Schweiz</button>
<button id="btn_heimfreizeit" class="btn btn-outline-secondary campbtn" onclick="selectCamp('heimfreizeit')">Heimfreizeit</button> <button id="btn_heimfreizeit" class="btn btn-outline-secondary campbtn" onclick="selectCamp('heimfreizeit')">Heimfreizeit</button>
<button id="btn_hohenhaslach" class="btn btn-outline-secondary campbtn" onclick="selectCamp('hohenhaslach')">Hohenhaslach</button>
</div> </div>
<div id="camp_rehe" class="col-12 description" style="display: none"> <div id="camp_rehe" class="col-12 description" style="display: none">
<h2 class="headlinefont">Wochenendfreizeit in Rehe</h2> <h2 class="headlinefont">Wochenendfreizeit in Rehe</h2>