85 lines
2.5 KiB
Vue
85 lines
2.5 KiB
Vue
<script setup>
|
|
import {useMeta} from "quasar";
|
|
import {metaData} from "src/composables/meta";
|
|
import AppFooter from "components/AppFooter.vue";
|
|
import LatestFlightsSlider from "components/flights/slider/LatestFlightsSlider.vue";
|
|
import {onMounted} from "vue";
|
|
import {useFlightsStore} from "stores/Flights";
|
|
import {storeToRefs} from "pinia";
|
|
import TimelineDescription from "components/indexPage/TimelineDescription.vue";
|
|
|
|
useMeta(() => metaData({
|
|
title: "Polétání.cz",
|
|
description: "Polétání.cz je aplikace na ukládání a sdílení fotografií a tras z vyhlídkových letů.",
|
|
}));
|
|
|
|
onMounted(() => {
|
|
useFlightsStore().fetchPublic({limit: 5});
|
|
});
|
|
const {flights, isQueryRunning} = storeToRefs(useFlightsStore());
|
|
</script>
|
|
<template>
|
|
<q-layout view="lHh Lpr fff">
|
|
|
|
<q-header class="bg-semi-transparent text-black" elevated>
|
|
<q-toolbar>
|
|
<q-toolbar-title>
|
|
Polétání.cz
|
|
</q-toolbar-title>
|
|
|
|
<q-btn rounded class="q-mx-sm" :to="{name: 'login'}" flat>Přihlášení</q-btn>
|
|
<q-btn rounded class="q-mx-sm" :to="{name: 'registration'}" color="primary">Registrace</q-btn>
|
|
</q-toolbar>
|
|
</q-header>
|
|
|
|
<q-page-container class="q-py-none">
|
|
<q-page>
|
|
<div class="row q-mx-md">
|
|
<div class="col col-md-6">
|
|
<div class="info-box bg-semi-transparent q-mx-lg q-py-lg q-px-lg rounded-borders">
|
|
<div class="text-h3 text-center q-my-lg">Fotogalerie ze vzduchu</div>
|
|
|
|
<p>Polétání.cz je aplikace pro piloty, kteří si chtějí spravovat fotografie ze svých výletů, zobrazovat je na mapě a ukládat si trasy svých výletů.</p>
|
|
|
|
<div class="text-center q-my-lg">
|
|
<q-btn size="xl" :to="{name: 'registration'}" rounded color="secondary">Založit účet</q-btn>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 text-center">
|
|
<q-img src="hp/app_screenshot.png" fit="contain" class="app-screen" alt="Nahled aplikace"/>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 class="text-center">Poslední lety</h3>
|
|
<LatestFlightsSlider :items="flights"/>
|
|
|
|
<div class="row justify-center">
|
|
<div class="col-md-6 q-px-lg">
|
|
<TimelineDescription/>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</q-page>
|
|
</q-page-container>
|
|
<AppFooter />
|
|
</q-layout>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.bg-semi-transparent {
|
|
background: rgba(255, 255, 255, 0.6);
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
|
|
.info-box {
|
|
font-size: 150%;
|
|
}
|
|
|
|
.app-screen {
|
|
max-height: 85vh;
|
|
}
|
|
|
|
</style>
|