labswp_2019_sose_geocaching/frontend/src/layouts/MyLayout.vue
2019-03-19 23:01:54 +01:00

122 lines
3.1 KiB
Vue

<template>
<q-layout view="lHh Lpr lFf">
<q-header elevated class="glossy">
<q-toolbar>
<q-btn
flat
dense
round
@click="leftDrawerOpen = !leftDrawerOpen"
aria-label="Menu"
>
<q-icon name="menu" />
</q-btn>
<q-toolbar-title>
Quasar App
</q-toolbar-title>
<div>Quasar v{{ $q.version }}</div>
</q-toolbar>
</q-header>
<q-drawer v-model="leftDrawerOpen" bordered content-class="bg-grey-2">
<q-list>
<q-item-label header>Essential Links</q-item-label>
<q-item
clickable
tag="a"
target="_blank"
href="http://v1.quasar-framework.org"
>
<q-item-section avatar>
<q-icon name="school" />
</q-item-section>
<q-item-section>
<q-item-label>Docs</q-item-label>
<q-item-label caption>v1.quasar-framework.org</q-item-label>
</q-item-section>
</q-item>
<q-item
clickable
tag="a"
target="_blank"
href="https://github.com/quasarframework/"
>
<q-item-section avatar>
<q-icon name="code" />
</q-item-section>
<q-item-section>
<q-item-label>Github</q-item-label>
<q-item-label caption>github.com/quasarframework</q-item-label>
</q-item-section>
</q-item>
<q-item
clickable
tag="a"
target="_blank"
href="http://chat.quasar-framework.org"
>
<q-item-section avatar>
<q-icon name="chat" />
</q-item-section>
<q-item-section>
<q-item-label>Discord Chat Channel</q-item-label>
<q-item-label caption>chat.quasar-framework.org</q-item-label>
</q-item-section>
</q-item>
<q-item
clickable
tag="a"
target="_blank"
href="https://forum.quasar-framework.org"
>
<q-item-section avatar>
<q-icon name="record_voice_over" />
</q-item-section>
<q-item-section>
<q-item-label>Forum</q-item-label>
<q-item-label caption>forum.quasar-framework.org</q-item-label>
</q-item-section>
</q-item>
<q-item
clickable
tag="a"
target="_blank"
href="https://twitter.com/quasarframework"
>
<q-item-section avatar>
<q-icon name="rss_feed" />
</q-item-section>
<q-item-section>
<q-item-label>Twitter</q-item-label>
<q-item-label caption>@quasarframework</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-drawer>
<q-page-container>
<router-view />
</q-page-container>
</q-layout>
</template>
<script>
import { openURL } from "quasar";
export default {
name: "MyLayout",
data() {
return {
leftDrawerOpen: this.$q.platform.is.desktop
};
},
methods: {
openURL
}
};
</script>
<style></style>