parent
c59c94ebbb
commit
00279abafc
@ -7,6 +7,7 @@
|
||||
<title>CANTYONION.SITE</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="loading" class="loading"></div>
|
||||
<div id="app"></div>
|
||||
<script src="/src/main.ts" type="module"></script>
|
||||
</body>
|
||||
|
@ -1,5 +1,14 @@
|
||||
<script lang="ts" setup>
|
||||
import {onMounted} from "vue";
|
||||
import emitter from "@/utils/mitt.ts";
|
||||
|
||||
const loadingElement = document.getElementById("loading") as HTMLDivElement;
|
||||
|
||||
onMounted(() => {
|
||||
emitter.on('startLoading', on =>
|
||||
on ? loadingElement.classList.remove('stop') : loadingElement.classList.add('stop')
|
||||
)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -9,7 +9,7 @@ type Widget = {
|
||||
const littleWidget: Widget[] = [
|
||||
{
|
||||
icon: ['fas', 'gauge'],
|
||||
url: "/pi-dashboard/",
|
||||
url: "/netdata/",
|
||||
title: "Pi Dashboard",
|
||||
},
|
||||
{
|
||||
|
@ -1,5 +1,5 @@
|
||||
import {createApp} from 'vue'
|
||||
import './style.css'
|
||||
import './style.scss'
|
||||
import App from './App.vue'
|
||||
// import VueTypedJs from 'vue-typed-js'
|
||||
import router from "@/router";
|
||||
@ -13,13 +13,14 @@ import {
|
||||
faCodeBranch,
|
||||
faCloud,
|
||||
faChevronRight,
|
||||
faCodeCommit
|
||||
faCodeCommit,
|
||||
faCode
|
||||
} from '@fortawesome/free-solid-svg-icons'
|
||||
import {faWeibo, faQq, faGithubAlt, faSteamSymbol, faGitAlt} from '@fortawesome/free-brands-svg-icons'
|
||||
import {faWeibo, faQq, faGithubAlt, faSteamSymbol} from '@fortawesome/free-brands-svg-icons'
|
||||
|
||||
library.add(
|
||||
faClock, faXmark, faBlog, faGauge, faCodeBranch, faCloud, faWeibo, faQq, faGithubAlt, faSteamSymbol, faChevronRight,
|
||||
faCodeCommit, faGitAlt
|
||||
faCodeCommit, faCode
|
||||
)
|
||||
|
||||
createApp(App).use(router).component('font-awesome-icon', FontAwesomeIcon).mount('#app')
|
||||
|
@ -1,18 +0,0 @@
|
||||
@import 'lxgw-wenkai-lite-webfont/style.css';
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@font-face {
|
||||
font-family: 'BaconyScript';
|
||||
src: url("./assets/BaconyScript_PERSONAL_USE_ONLY.otf") format("opentype");
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "LXGW WenKai Lite", sans-serif;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
font-family: "LXGW WenKai Mono Lite", sans-serif;
|
||||
}
|
33
src/style.scss
Normal file
33
src/style.scss
Normal file
@ -0,0 +1,33 @@
|
||||
@import 'lxgw-wenkai-lite-webfont/style.css';
|
||||
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@font-face {
|
||||
font-family: 'BaconyScript';
|
||||
src: url("./assets/BaconyScript_PERSONAL_USE_ONLY.otf") format("opentype");
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "LXGW WenKai Lite", sans-serif;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
font-family: "LXGW WenKai Mono Lite", sans-serif;
|
||||
}
|
||||
|
||||
.loading {
|
||||
@apply fixed h-screen w-screen flex justify-center items-center z-[999] bg-blue-50 backdrop-blur-3xl bg-opacity-45 transition-all duration-500 opacity-100;
|
||||
|
||||
&::before {
|
||||
content: 'CantyOni_on\'s Index';
|
||||
font-family: 'BaconyScript', sans-serif;
|
||||
|
||||
@apply text-5xl lg:text-7xl text-gray-600;
|
||||
}
|
||||
}
|
||||
|
||||
.stop {
|
||||
@apply invisible opacity-0;
|
||||
}
|
@ -2,6 +2,7 @@ import mitt from 'mitt'
|
||||
|
||||
type Events = {
|
||||
openPost: IPost
|
||||
startLoading: boolean
|
||||
}
|
||||
|
||||
const emitter = mitt<Events>()
|
||||
|
@ -8,6 +8,7 @@ import CardTitle from "@/components/card/CardTitle.vue";
|
||||
import SectionCard from "@/components/card/SectionCard.vue";
|
||||
import {getActivity} from "@/api/git.ts";
|
||||
import GitCard from "@/components/card/GitCard.vue";
|
||||
import emitter from "@/utils/mitt.ts";
|
||||
|
||||
const recentPosts = ref<IPost[] | null>(null);
|
||||
const recentActivities = ref<IActivity[] | null>(null);
|
||||
@ -59,7 +60,6 @@ const reloadActivities = async () => {
|
||||
try {
|
||||
isLoading.value.git = true
|
||||
recentActivities.value = await getActivity()
|
||||
console.log(recentActivities.value)
|
||||
isLoading.value.git = false
|
||||
} catch (e) {
|
||||
isLoading.value.git = false
|
||||
@ -70,6 +70,8 @@ const reloadActivities = async () => {
|
||||
onMounted(async () => {
|
||||
await reloadPosts()
|
||||
await reloadActivities()
|
||||
|
||||
emitter.emit('startLoading', false)
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -97,7 +99,7 @@ onMounted(async () => {
|
||||
|
||||
<!-- Git部分 -->
|
||||
<section class="my-4 w-full px-4 sm:px-0">
|
||||
<card-title :icon="['fab', 'git-alt']" main-color="bg-green-500" sub-color="bg-green-600" title="最近活动"
|
||||
<card-title :icon="['fas', 'code']" main-color="bg-green-500" sub-color="bg-green-600" title="最近活动"
|
||||
url="/git/"/>
|
||||
|
||||
<section-card :empty="!hasActivities" :error="isError.git" :loading="isLoading.git" @reload="reloadActivities">
|
||||
@ -111,7 +113,7 @@ onMounted(async () => {
|
||||
</div>
|
||||
|
||||
|
||||
<footer class="mt-8 flex w-full items-end bg-white py-4 min-h-48">
|
||||
<footer class="mt-8 flex w-full items-end py-4 min-h-48 bg-gradient-to-t from-white">
|
||||
<div class="container mx-auto">
|
||||
<p class="text-center leading-8">©2024 All rights reserved.</p>
|
||||
<div class="flex justify-center gap-4">
|
||||
|
Loading…
x
Reference in New Issue
Block a user