commit
50adca44e8
2
.env
2
.env
@ -10,7 +10,7 @@ VITE_DESC_HELLO_OTHER = "Oops !"
|
||||
VITE_DESC_TEXT_OTHER = "哎呀,这都被你发现了( 再点击一次可关闭 )"
|
||||
|
||||
# 社交链接
|
||||
## 请在根目录下的 socialLinks.json 文件中配置
|
||||
## 请在 public 目录下的 socialLinks.json 文件中配置
|
||||
|
||||
# 网站链接
|
||||
## 请在 src/components/Links/index.vue 文件中配置
|
||||
|
@ -4,7 +4,7 @@
|
||||
"github": "https://github.com/imsyy/home",
|
||||
"home": "https://imsyy.top",
|
||||
"private": true,
|
||||
"version": "4.0.1",
|
||||
"version": "4.0.2",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
|
@ -12,7 +12,7 @@
|
||||
"name": "QQ",
|
||||
"icon": "/images/icon/qq.png",
|
||||
"tip": "有什么事吗",
|
||||
"url": "https://wpa.qq.com/msgrd?v=3&uin=1539250352&site=qq&menu=yes"
|
||||
"url": "https://res.abeim.cn/api/qq/?qq=1539250352"
|
||||
}, {
|
||||
"name": "Email",
|
||||
"icon": "/images/icon/email.png",
|
||||
|
@ -41,6 +41,7 @@ import {
|
||||
} from "@vicons/fa";
|
||||
|
||||
// 网站链接数据
|
||||
// 建议不要超出6个,若需要超出请自行调整样式
|
||||
let linksData = [
|
||||
{
|
||||
icon: Blog,
|
||||
|
@ -4,7 +4,7 @@
|
||||
<!-- Logo -->
|
||||
<div class="logo">
|
||||
<img class="logo-img" :src="siteLogo" alt="logo" />
|
||||
<div class="name">
|
||||
<div class="name text-hidden">
|
||||
<span class="bg">{{ siteUrl[0] }}</span>
|
||||
<span class="sm">.{{ siteUrl[1] }}</span>
|
||||
</div>
|
||||
@ -91,6 +91,7 @@ watch(
|
||||
}
|
||||
.name {
|
||||
width: 100%;
|
||||
height: 142px;
|
||||
margin-left: 12px;
|
||||
transform: translateY(-8px);
|
||||
font-family: "Pacifico-Regular";
|
||||
@ -112,6 +113,7 @@ watch(
|
||||
width: 100px;
|
||||
}
|
||||
.name {
|
||||
height: 128px;
|
||||
.bg {
|
||||
font-size: 4.5rem;
|
||||
}
|
||||
@ -151,5 +153,28 @@ watch(
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
@media (max-width: 390px) {
|
||||
.logo {
|
||||
flex-direction: column;
|
||||
.logo-img {
|
||||
display: none;
|
||||
}
|
||||
.name {
|
||||
margin-left: 0;
|
||||
height: auto;
|
||||
transform: none;
|
||||
text-align: center;
|
||||
.bg {
|
||||
font-size: 3.5rem;
|
||||
}
|
||||
.sm {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.description {
|
||||
margin-top: 2.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -65,6 +65,7 @@ onMounted(() => {
|
||||
backdrop-filter: blur(0);
|
||||
animation: fade;
|
||||
-webkit-animation: fade 0.5s;
|
||||
transition: all 0.5s;
|
||||
@media (max-width: 840px) {
|
||||
max-width: 100%;
|
||||
justify-content: center;
|
||||
@ -95,12 +96,16 @@ onMounted(() => {
|
||||
.tip {
|
||||
display: none;
|
||||
margin-right: 12px;
|
||||
animation: fade;
|
||||
-webkit-animation: fade 0.5s;
|
||||
}
|
||||
&:hover {
|
||||
background-color: #00000040;
|
||||
backdrop-filter: blur(5px);
|
||||
.tip {
|
||||
display: block;
|
||||
@media (min-width: 768px) {
|
||||
&:hover {
|
||||
background-color: #00000040;
|
||||
backdrop-filter: blur(5px);
|
||||
.tip {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -76,6 +76,13 @@ p {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
// 文字超出
|
||||
.text-hidden {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
// 弹窗样式
|
||||
.el-message {
|
||||
--el-message-bg-color: #00000040 !important;
|
||||
|
@ -14,7 +14,8 @@ const store = mainStore();
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.left {
|
||||
flex: 1 0 0%;
|
||||
// flex: 1 0 0%;
|
||||
width: 50%;
|
||||
margin-right: 10px;
|
||||
transform: translateY(20px);
|
||||
&.hidden {
|
||||
@ -22,6 +23,7 @@ const store = mainStore();
|
||||
}
|
||||
@media (max-width: 720px) {
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div :class="store.mobileOpenState ? 'right' : 'right hidden'">
|
||||
<!-- 移动端 Logo -->
|
||||
<div class="logo" @click="store.mobileFuncState = !store.mobileFuncState">
|
||||
<div class="logo text-hidden" @click="store.mobileFuncState = !store.mobileFuncState">
|
||||
<span class="bg">{{ siteUrl[0] }}</span>
|
||||
<span class="sm">.{{ siteUrl[1] }}</span>
|
||||
</div>
|
||||
@ -26,16 +26,17 @@ let siteUrl = import.meta.env.VITE_SITE_URL.split(".");
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.right {
|
||||
flex: 1 0 0%;
|
||||
// flex: 1 0 0%;
|
||||
width: 50%;
|
||||
margin-left: 0.75rem;
|
||||
.logo {
|
||||
width: 80%;
|
||||
font-family: "Pacifico-Regular";
|
||||
font-size: 1.75rem;
|
||||
position: fixed;
|
||||
width: 140px;
|
||||
text-align: center;
|
||||
top: 8%;
|
||||
left: calc(50% - 70px);
|
||||
top: 6%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
transition: all 0.3s;
|
||||
animation: fade;
|
||||
-webkit-animation: fade 0.5s;
|
||||
@ -48,6 +49,7 @@ let siteUrl = import.meta.env.VITE_SITE_URL.split(".");
|
||||
}
|
||||
@media (max-width: 720px) {
|
||||
margin-left: 0;
|
||||
width: 100%;
|
||||
&.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
@ -1,19 +1,39 @@
|
||||
<template>
|
||||
<div class="set" @mouseenter="closeShow = true" @mouseleave="closeShow = false" @click.stop>
|
||||
<div
|
||||
class="set"
|
||||
@mouseenter="closeShow = true"
|
||||
@mouseleave="closeShow = false"
|
||||
@click.stop
|
||||
>
|
||||
<transition name="el-fade-in-linear">
|
||||
<close-one class="close" theme="filled" size="28" fill="#ffffff60" v-show="closeShow"
|
||||
@click="store.setOpenState = false" />
|
||||
<close-one
|
||||
class="close"
|
||||
theme="filled"
|
||||
size="28"
|
||||
fill="#ffffff60"
|
||||
v-show="closeShow"
|
||||
@click="store.setOpenState = false"
|
||||
/>
|
||||
</transition>
|
||||
<el-row :gutter="40">
|
||||
<el-col :span="12" class="left">
|
||||
<div class="logo">
|
||||
<div class="logo text-hidden">
|
||||
<span class="bg">{{ siteUrl[0] }}</span>
|
||||
<span class="sm">.{{ siteUrl[1] }}</span>
|
||||
</div>
|
||||
<div class="version">
|
||||
<div class="num">v {{ config.version }}</div>
|
||||
<el-tooltip content="Github 源代码仓库" placement="right" :show-arrow="false">
|
||||
<github-one class="github" theme="outline" size="24" @click="jumpTo(config.github)" />
|
||||
<el-tooltip
|
||||
content="Github 源代码仓库"
|
||||
placement="right"
|
||||
:show-arrow="false"
|
||||
>
|
||||
<github-one
|
||||
class="github"
|
||||
theme="outline"
|
||||
size="24"
|
||||
@click="jumpTo(config.github)"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<el-card class="update">
|
||||
@ -47,10 +67,16 @@
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from "vue";
|
||||
import { CloseOne, SettingTwo, GithubOne, AddOne, Bug } from "@icon-park/vue-next";
|
||||
import {
|
||||
CloseOne,
|
||||
SettingTwo,
|
||||
GithubOne,
|
||||
AddOne,
|
||||
Bug,
|
||||
} from "@icon-park/vue-next";
|
||||
import { mainStore } from "@/store";
|
||||
import Set from "@/components/Set/index.vue";
|
||||
import config from '@/../package.json';
|
||||
import config from "@/../package.json";
|
||||
const store = mainStore();
|
||||
|
||||
let closeShow = ref(false);
|
||||
@ -60,9 +86,19 @@ let siteUrl = import.meta.env.VITE_SITE_URL.split(".");
|
||||
|
||||
// 更新日志
|
||||
let upData = reactive({
|
||||
new: ["采用 Vue 进行重构", "音乐歌单支持快速自定义", "壁纸支持个性化设置", "音乐播放器支持音量控制"],
|
||||
fix: ["修复天气 API", "时光胶囊显示错误", "移动端动画及细节", "图标更换为 IconPark"],
|
||||
})
|
||||
new: [
|
||||
"采用 Vue 进行重构",
|
||||
"音乐歌单支持快速自定义",
|
||||
"壁纸支持个性化设置",
|
||||
"音乐播放器支持音量控制",
|
||||
],
|
||||
fix: [
|
||||
"修复天气 API",
|
||||
"时光胶囊显示错误",
|
||||
"移动端动画及细节",
|
||||
"图标更换为 IconPark",
|
||||
],
|
||||
});
|
||||
|
||||
// 跳转源代码仓库
|
||||
const jumpTo = (url) => {
|
||||
@ -115,6 +151,8 @@ const jumpTo = (url) => {
|
||||
transform: translateY(-8%);
|
||||
font-family: "Pacifico-Regular";
|
||||
// line-height: 5rem;
|
||||
width: 100%;
|
||||
height: 260px;
|
||||
|
||||
.bg {
|
||||
font-size: 5rem;
|
||||
@ -133,7 +171,7 @@ const jumpTo = (url) => {
|
||||
|
||||
.num {
|
||||
font-size: 2rem;
|
||||
font-family: 'Pacifico-Regular';
|
||||
font-family: "Pacifico-Regular";
|
||||
}
|
||||
|
||||
.github {
|
||||
|
@ -42,7 +42,8 @@ export default ({
|
||||
VitePWA({
|
||||
registerType: 'autoUpdate',
|
||||
devOptions: {
|
||||
enabled: true
|
||||
enabled: true,
|
||||
navigateFallbackAllowlist: [/^index.html$/]
|
||||
},
|
||||
workbox: {
|
||||
runtimeCaching: [{
|
||||
|
Loading…
Reference in New Issue
Block a user