labswp_2019_sose_geocaching/frontend/src/pages/Index.vue

50 lines
1.8 KiB
Vue

<template>
<div class="q-pa-md">
<q-card class="my-card q-mb-md" style="max-width: 600px">
<q-parallax
src="https://www.buga2019.de/we-bilder/2.Aktuelles/BUGA-Zwerg/zwerg-im-gras-buga-heilbronn-2019.jpg?m=1550501506"
:height="200"
/>
<q-card-section>
<div class="text-h6">GeoCaching</div>
<div class="text-body2">Willkommen</div>
<q-expansion-item
expand-separator
rounded-borders
class="bg-green-3 text-black shadow-2 full-width q-mt-md"
label="Was ist GeoCaching?"
>
<q-card>
<q-card-section>
GeoCaching ist eine spielerische Führung, eine Schnitzeljagd, über die Bundesgartenschau.
Es gibt mehrere Routen (Caches), von denen man wählen kann. Auf jedem Cache gibt es mehrere Stationen, bei denen Rätsel und Aufgaben gelöst werden müssen, um die nächste zu finden.
Eine Station ist eine QR-Code, bei dessen einscannen das nächste Rätsel freigeschaltet wird.
Findet ein Cacher alle Stationen eines Caches erhält er eine kleine Belohnung und sammelt Punkte für eine Rangliste.
</q-card-section>
</q-card>
</q-expansion-item>
</q-card-section>
</q-card>
<q-card class="my-card" style="max-width: 600px">
<q-parallax
src="https://www.buga2019.de/we-bilder/1.Bundesgartenschau/171205_BUGA-2019_Sommerinsel_LOMA_430px.jpg?m=1550501561"
:height="200"
/>
<q-card-section>
<div class="text-h6">Loslegen</div>
<q-btn color="green-3" text-color="black" class="full-width q-mt-md" label="Zu den Caches" to="/Overview"/>
</q-card-section>
</q-card>
</div>
</template>
<script>
export default {
data () {
return {
}
}
}
</script>