71 lines
1.5 KiB
Vue
71 lines
1.5 KiB
Vue
<template>
|
|
<div id="app">
|
|
<router-view></router-view>
|
|
<Notification :position="'top-right'" :duration="3000" ref="notification" />
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import { ref, onMounted, watch, reactive ,provide} from "vue";
|
|
import Layout from "@/components/layout/index.vue";
|
|
import Notification from './components/global/Notification.vue'
|
|
import { gsap } from "gsap";
|
|
|
|
import { ScrollTrigger } from "gsap/ScrollTrigger";
|
|
|
|
gsap.registerPlugin(ScrollTrigger);
|
|
|
|
const notification = ref(null);
|
|
|
|
// 在根组件的 setup 函数中，将 addNotification 函数提供给子组件
|
|
provide('addNotification', (title, message) => {
|
|
notification.value.addNotification(title, message);
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
body,
|
|
html {
|
|
padding: 0;
|
|
margin: 0;
|
|
height: 100%;
|
|
position: relative;
|
|
font-family: "ui-sans-serif", "system-ui", "-apple-system",
|
|
"BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial",
|
|
"Noto Sans", "sans-serif", "Apple Color Emoji", "Segoe UI Emoji",
|
|
"Segoe UI Symbol", "Noto Color Emoji";
|
|
audio,
|
|
canvas,
|
|
embed,
|
|
iframe,
|
|
img,
|
|
object,
|
|
svg,
|
|
video {
|
|
display: block;
|
|
vertical-align: middle;
|
|
}
|
|
img,
|
|
video {
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
}
|
|
.fade-enter-active,
|
|
.fade-leave-active {
|
|
transition: opacity 0.5s ease;
|
|
}
|
|
|
|
.fade-enter-from,
|
|
.fade-leave-to {
|
|
opacity: 0;
|
|
}
|
|
@font-face {
|
|
font-family: "MyFont";
|
|
src: url("/fonts/myfont.ttf") format("truetype");
|
|
}
|
|
#app{
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
</style>
|