R40fendt/ritzenbergen-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Nuxt

Browse Source
This commit is contained in:
Jonas
2026-04-26 22:02:24 +02:00
commit 73442783b7
1470 changed files with 43422 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
app/components/startseite/Bilderbuch.vue Normal file
View File

@@ -0,0 +1,111 @@
<script lang="ts" setup>
import RitzenbergenLib from "../../ritzenbergenlib.ts";
import {ref} from "vue";
async function loadImage(path: string) {
try{
const response = await fetch(RitzenbergenLib.RitzenbergenLib.api(path), {
headers: {
"Accept":"image/png"
}
});
if(!response.ok) return false;
const blob = await response.blob();
return URL.createObjectURL(blob);
}
catch(e){
console.warn(e);
}
}
loadImage("randomimage.php?path=/doppelkopf&recursive=1&tn=1&color=white&text=Doppelkopf&size=3").then((url)=>{
images.value[0]=url;
});
loadImage("randomimage.php?path=/erntefest&recursive=1&tn=1&color=white&text=Erntefest&size=3").then((url)=>{
images.value[1]=url;
});
loadImage("randomimage.php?path=/fussball&recursive=1&tn=1&color=white&text=Fußballturnier&size=3").then((url)=>{
images.value[2]=url;
});
loadImage("randomimage.php?path=/osterfeuer&recursive=1&tn=1&color=white&text=Osterfeuer&size=3").then((url)=>{
images.value[3]=url;
});
const images=ref([]);
</script>
<template>
<section
class="gallery09 cid-u6k7q0xbqP"
id="gallery-9-u6k7q0xbqP"
v-if="images[0]"
>
<div class="container">
<div class="row justify-content-center">
<div class="col-12 col-md-12 col-lg-4 main-text">
<div class="">
<h5
class="mbr-section-title mbr-fonts-style mt-0 mb-4 display-2"
>
<strong>Bilderbuch Ritzenbergen</strong>
</h5>
<h6
class="mbr-section-subtitle mbr-fonts-style mt-0 mb-4 display-7"
>
Klicke auf ein Bild um in unsere Galerie zu
gelangen. Die Bilder sind nach Jahreszahl und
Kategorie geordnet.
</h6>
</div>
</div>
<div class="col-lg-8 side-features row">
<div
class="item features-image col-12 col-md-6 col-lg-6 active"
>
<div class="item-wrapper">
<div class="item-img">
<RouterLink to="/galerie/doppelkopf"
><img :src="images[0]"
/></RouterLink>
</div>
</div>
</div>
<div
class="item features-image col-12 col-md-6 col-lg-6 active"
>
<div class="item-wrapper">
<div class="item-img">
<RouterLink to="/galerie/erntefest"
><img :src="images[1]"
/></RouterLink>
</div>
</div>
</div>
<div
class="item features-image col-12 col-md-6 col-lg-6 active"
>
<div class="item-wrapper">
<div class="item-img">
<RouterLink to="/galerie/fussball"
><img :src="images[2]"
/></RouterLink>
</div>
</div>
</div>
<div
class="item features-image col-12 col-md-6 col-lg-6 active"
>
<div class="item-wrapper">
<div class="item-img">
<RouterLink to="/galerie/osterfeuer"
><img :src="images[3]"
/></RouterLink>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
<style></style>