feat: add vue app entry point
This commit is contained in:
parent
c8509e6289
commit
020f7c1160
2 changed files with 46 additions and 0 deletions
34
src/App.vue
Normal file
34
src/App.vue
Normal file
|
@ -0,0 +1,34 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { reactive } from "vue";
|
||||||
|
|
||||||
|
import { RouterView } from "vue-router";
|
||||||
|
import SiteNavigation from "@/components/SiteNavigation.vue";
|
||||||
|
import NavToggle from "@/components/NavToggle.vue";
|
||||||
|
import HeaderBar from "@/components/HeaderBar.vue";
|
||||||
|
|
||||||
|
interface State {
|
||||||
|
navActive: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const state: State = reactive({
|
||||||
|
navActive: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const toggleNav = (): void => {
|
||||||
|
state.navActive = !state.navActive;
|
||||||
|
document.body.classList.toggle("scroll-lock");
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<SiteNavigation :isActive="state.navActive" @selected="toggleNav" />
|
||||||
|
|
||||||
|
<HeaderBar>
|
||||||
|
<NavToggle @click.prevent="toggleNav" />
|
||||||
|
<template #heading>{{ $route.meta.title }}</template>
|
||||||
|
</HeaderBar>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<RouterView />
|
||||||
|
</main>
|
||||||
|
</template>
|
12
src/main.ts
Normal file
12
src/main.ts
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
import { createApp } from "vue";
|
||||||
|
import App from "./App.vue";
|
||||||
|
import router from "./router";
|
||||||
|
|
||||||
|
import "normalize.css";
|
||||||
|
import "@/scss/main.scss";
|
||||||
|
|
||||||
|
const app = createApp(App);
|
||||||
|
|
||||||
|
app.use(router);
|
||||||
|
|
||||||
|
app.mount("body");
|
Loading…
Add table
Add a link
Reference in a new issue