85 lines
1.4 KiB
Vue
Executable File
85 lines
1.4 KiB
Vue
Executable File
<script lang="ts" setup>
|
|
|
|
import {toggleDark} from "~/utils";
|
|
</script>
|
|
|
|
<template>
|
|
<div class="BottomBar-Box">
|
|
<div class="Left-Text-Box">
|
|
<p @click="toggleDark" style="cursor: pointer">{{$colorMode.value=='dark'?'深色':'浅色'}}</p>
|
|
<p>隐私策略</p>
|
|
<p>关于我们</p>
|
|
</div>
|
|
<div class="Right-Text-Box">
|
|
<p>Copyright © 2024 by <a href="https://ys-api.mihoyo.com/event/download_porter/link/ys_cn/official/pc_default"
|
|
target="_blank">
|
|
原神玩的队</a></p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "base";
|
|
|
|
.BottomBar-Box {
|
|
grid-area: folder;
|
|
display: flex;
|
|
padding: 16px 24px;
|
|
align-items: center;
|
|
background: $light-bg-color;
|
|
border-top: $border;
|
|
.dark-mode &{
|
|
border-top: $border-dark;
|
|
}
|
|
}
|
|
|
|
.Left-Text-Box {
|
|
display: flex;
|
|
gap: $gap;
|
|
flex: 1;
|
|
|
|
p {
|
|
@include SC_Font;
|
|
color: $light-text-color;
|
|
font-size: 12px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: normal;
|
|
}
|
|
}
|
|
|
|
.Right-Text-Box {
|
|
@extend .Left-Text-Box;
|
|
justify-content: flex-end;
|
|
|
|
a {
|
|
cursor: pointer;
|
|
color: $primary-color;
|
|
}
|
|
}
|
|
|
|
.dark-mode {
|
|
.BottomBar-Box {
|
|
background: $dark-bg-color;
|
|
}
|
|
|
|
p {
|
|
color: $dark-text-color
|
|
}
|
|
}
|
|
|
|
.Fox {
|
|
position: fixed;
|
|
right: -40px;
|
|
bottom: -110px;
|
|
z-index: 20;
|
|
height: 400px;
|
|
width: 300px;
|
|
|
|
iframe {
|
|
height: 100%;
|
|
width: 100%;
|
|
border: unset;
|
|
}
|
|
}
|
|
</style> |