update log page i18n, fix top bar and settings panel BUG
This commit is contained in:
parent
ca75178a1f
commit
b87f300937
|
@ -157,6 +157,7 @@ const handleCustomBackground = () => {
|
|||
flex-shrink: 0;
|
||||
padding: 0 10px;
|
||||
height: 25px;
|
||||
width: 70px;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid $kungalgame-blue-4;
|
||||
border-left: none;
|
||||
|
|
|
@ -38,7 +38,7 @@ import {
|
|||
position: fixed;
|
||||
z-index: 9999;
|
||||
top: -250px;
|
||||
left: 120px;
|
||||
left: 150px;
|
||||
}
|
||||
.lass {
|
||||
position: absolute;
|
||||
|
|
|
@ -44,4 +44,12 @@ export default {
|
|||
master: 'Other Topics of The Master',
|
||||
},
|
||||
},
|
||||
update: {
|
||||
next: 'Next Version',
|
||||
update: 'Update Info',
|
||||
info: 'Update Preview / More Info',
|
||||
visit: 'Click to visit github',
|
||||
time: 'Estimated update time',
|
||||
history: 'History Version',
|
||||
},
|
||||
}
|
||||
|
|
|
@ -44,4 +44,12 @@ export default {
|
|||
master: '楼主的其它帖子',
|
||||
},
|
||||
},
|
||||
update: {
|
||||
next: '下个版本',
|
||||
update: '更新信息',
|
||||
info: '更新预览 / 更多信息',
|
||||
visit: '点击访问 github',
|
||||
time: '预计更新时间',
|
||||
history: '历史版本',
|
||||
},
|
||||
}
|
||||
|
|
|
@ -1,207 +0,0 @@
|
|||
<script setup lang="ts"></script>
|
||||
|
||||
<template>
|
||||
<!-- 支出 -->
|
||||
<div class="expenditure">
|
||||
<!-- 支出 -->
|
||||
<div class="expenditure-title">支出</div>
|
||||
<!-- 支出记录的容器 -->
|
||||
<div class="expenditure-container">
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 单条支出 -->
|
||||
<div class="single-expenditure">
|
||||
<!-- 支出原因 -->
|
||||
<div class="expenditure-reason">啊这可海星</div>
|
||||
<!-- 支出时间和金额 -->
|
||||
<div class="expenditure-result">
|
||||
<!-- 支出时间 -->
|
||||
<span class="expenditure-time">2019/10/07</span>
|
||||
<!-- 支出金额 -->
|
||||
<span class="expenditure-amount">- 1007 CNY</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 总支出 -->
|
||||
<div class="expenditure-sum">总支出: 1007 CNY</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/* 支出 */
|
||||
.expenditure {
|
||||
width: 49%;
|
||||
height: 300px;
|
||||
border: 1px solid $kungalgame-red-4;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
/* "支出"两个字 */
|
||||
.expenditure-title {
|
||||
font-size: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid $kungalgame-red-4;
|
||||
background-color: $kungalgame-trans-red-0;
|
||||
}
|
||||
/* 支出记录的容器 */
|
||||
.expenditure-container {
|
||||
flex-grow: 1;
|
||||
padding: 10px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
/* 滚动条的样式 */
|
||||
.expenditure-container::-webkit-scrollbar {
|
||||
display: inline;
|
||||
width: 4px;
|
||||
height: 0;
|
||||
background-color: $kungalgame-red-2;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.expenditure-container::-webkit-scrollbar-thumb {
|
||||
background: $kungalgame-blue-4;
|
||||
border-radius: 2px;
|
||||
}
|
||||
/* 单条支出 */
|
||||
.single-expenditure {
|
||||
margin-top: 20px;
|
||||
border-bottom: 1px solid $kungalgame-red-4;
|
||||
}
|
||||
/* 支出原因 */
|
||||
.expenditure-reason {
|
||||
border-left: 5px solid $kungalgame-red-4;
|
||||
padding-left: 5px;
|
||||
}
|
||||
/* 支出的时间和金额 */
|
||||
.expenditure-result {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
/* 支出时间 */
|
||||
.expenditure-time {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
/* 支出金额 */
|
||||
.expenditure-amount {
|
||||
padding: 0 5px;
|
||||
background-color: $kungalgame-red-2;
|
||||
}
|
||||
/* 总支出 */
|
||||
.expenditure-sum {
|
||||
height: 40px;
|
||||
font-size: 18px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-top: 1px solid $kungalgame-red-4;
|
||||
background-color: $kungalgame-trans-red-0;
|
||||
}
|
||||
</style>
|
|
@ -18,13 +18,13 @@ import KUNGalgameFooter from '@/components/KUNGalgameFooter.vue'
|
|||
<!-- 下个版本计划更新 -->
|
||||
<div class="next-ver">
|
||||
<!-- 标题 -->
|
||||
<div class="title">下个版本</div>
|
||||
<div class="title">{{ $t('update.next') }}</div>
|
||||
<Next />
|
||||
</div>
|
||||
<!-- 历史版本 -->
|
||||
<div class="history-ver">
|
||||
<!-- 标题 -->
|
||||
<div class="title">历史版本</div>
|
||||
<div class="title">{{ $t('update.history') }}</div>
|
||||
<!-- 历史更新的内容 -->
|
||||
<History />
|
||||
</div>
|
||||
|
|
|
@ -1,24 +1,32 @@
|
|||
<script setup lang="ts"></script>
|
||||
<script setup lang="ts">
|
||||
import { Icon } from '@iconify/vue'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- 更新的内容 -->
|
||||
<div class="article-next">
|
||||
<div class="describe">
|
||||
<div>更新信息</div>
|
||||
<div>{{ $t('update.update') }}</div>
|
||||
<p>1. 添加数据统计页面</p>
|
||||
<p>2. 修复关于我们页面布局</p>
|
||||
<p>3. 其他细节修复</p>
|
||||
</div>
|
||||
<!-- 更新预览 -->
|
||||
<div class="preview">
|
||||
<div>更新预览 / 更多信息</div>
|
||||
<a href="https://github.com/KUN1007/KUNGalGame-vue" target="_blank"
|
||||
>点击访问 github</a
|
||||
<div>{{ $t('update.info') }}</div>
|
||||
<a
|
||||
class="github"
|
||||
href="https://github.com/KUN1007/KUNGalGame-vue"
|
||||
target="_blank"
|
||||
>{{ $t('update.visit') }}</a
|
||||
>
|
||||
<a href="https://github.com/KUN1007/KUNGalGame-vue" target="_blank">
|
||||
<Icon class="icon" icon="raphael:github"
|
||||
/></a>
|
||||
</div>
|
||||
<!-- 预计更新时间 -->
|
||||
<div class="time">
|
||||
<span>预计更新时间: 2019/10/7</span>
|
||||
<span>{{ $t('update.time') }}: 2019/10/7</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -42,25 +50,30 @@
|
|||
}
|
||||
/* 更新预览 */
|
||||
.preview {
|
||||
margin-top: 100px;
|
||||
margin-top: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
& > a {
|
||||
margin-top: 10px;
|
||||
color: $kungalgame-blue-4;
|
||||
border-bottom: 2px solid $kungalgame-trans-white-8;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
border-bottom: 2px solid $kungalgame-blue-4;
|
||||
}
|
||||
}
|
||||
.github {
|
||||
margin-top: 10px;
|
||||
color: $kungalgame-blue-4;
|
||||
border-bottom: 2px solid $kungalgame-trans-white-8;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
border-bottom: 2px solid $kungalgame-blue-4;
|
||||
}
|
||||
}
|
||||
/* 预计更新时间 */
|
||||
.time {
|
||||
margin-top: 80px;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.icon {
|
||||
margin-top: 20px;
|
||||
font-size: 50px;
|
||||
color: $kungalgame-font-color-2;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in a new issue