159 lines
2.3 KiB
Vue
159 lines
2.3 KiB
Vue
<template>
|
|
<div id="app">
|
|
<Layout></Layout>
|
|
<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";
|
|
import { BlockChain } from '@/components/chain/BlockChain';
|
|
|
|
gsap.registerPlugin(ScrollTrigger);
|
|
|
|
const notification = ref(null);
|
|
|
|
// 在根组件的 setup 函数中，将 addNotification 函数提供给子组件
|
|
provide('addNotification', (title, message) => {
|
|
notification.value.addNotification(title, message);
|
|
});
|
|
|
|
onMounted(() => {
|
|
new BlockChain().preparePassport();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
body,
|
|
html {
|
|
background-color: #17141B;
|
|
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");
|
|
// "@vueuse/core": "^9.12.0",
|
|
|
|
// }
|
|
#app{
|
|
height: 100%;
|
|
position: relative;
|
|
//background: #0c0c18;
|
|
}
|
|
div,
|
|
span,
|
|
object,
|
|
iframe,
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6,
|
|
p,
|
|
blockquote,
|
|
pre,
|
|
abbr,
|
|
address,
|
|
cite,
|
|
code,
|
|
del,
|
|
dfn,
|
|
em,
|
|
img,
|
|
ins,
|
|
kbd,
|
|
q,
|
|
samp,
|
|
small,
|
|
strong,
|
|
sub,
|
|
sup,
|
|
var,
|
|
b,
|
|
i,
|
|
dl,
|
|
dt,
|
|
dd,
|
|
ol,
|
|
ul,
|
|
li,
|
|
fieldset,
|
|
form,
|
|
label,
|
|
legend,
|
|
table,
|
|
caption,
|
|
tbody,
|
|
tfoot,
|
|
thead,
|
|
tr,
|
|
th,
|
|
td,
|
|
article,
|
|
aside,
|
|
canvas,
|
|
details,
|
|
figcaption,
|
|
figure,
|
|
footer,
|
|
header,
|
|
hgroup,
|
|
menu,
|
|
nav,
|
|
section,
|
|
summary,
|
|
time,
|
|
mark,
|
|
audio,
|
|
video {
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
outline: 0;
|
|
font-size: 100%;
|
|
vertical-align: baseline;
|
|
background: transparent;
|
|
list-style: none;
|
|
word-break: keep-all;
|
|
word-wrap: break-word;
|
|
}
|
|
</style>
|