mirror of
https://github.com/the1812/Bilibili-Evolved.git
synced 2025-11-04 21:22:45 +08:00
67 lines
1.2 KiB
Vue
67 lines
1.2 KiB
Vue
<template>
|
|
<div class="minimal-home-operations">
|
|
<VButton
|
|
round
|
|
icon
|
|
class="minimal-home-operations-refresh"
|
|
title="刷新"
|
|
@click="
|
|
backToTop()
|
|
$emit('refresh')
|
|
"
|
|
>
|
|
<VIcon icon="mdi-refresh" :size="size" />
|
|
</VButton>
|
|
<VButton round icon class="minimal-home-operations-top" title="返回顶部" @click="backToTop">
|
|
<VIcon icon="mdi-arrow-up" :size="size" />
|
|
</VButton>
|
|
</div>
|
|
</template>
|
|
<script lang="ts">
|
|
import { defineComponent } from 'vue'
|
|
import { VButton, VIcon } from '@/ui'
|
|
|
|
export default defineComponent({
|
|
components: { VButton, VIcon },
|
|
emits: ['refresh'],
|
|
data() {
|
|
return {
|
|
size: 28,
|
|
}
|
|
},
|
|
methods: {
|
|
backToTop() {
|
|
window.scrollTo(0, 0)
|
|
},
|
|
},
|
|
})
|
|
</script>
|
|
<style lang="scss">
|
|
@import 'common';
|
|
@import 'effects';
|
|
|
|
.minimal-home-operations {
|
|
@include v-center(12px);
|
|
position: fixed;
|
|
bottom: 48px;
|
|
right: 48px;
|
|
.be-button {
|
|
padding: 8px !important;
|
|
opacity: 0.5;
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
&-refresh {
|
|
.mdi {
|
|
@include rotate();
|
|
}
|
|
}
|
|
&-top {
|
|
.mdi:hover {
|
|
@include bounce-y(-2);
|
|
}
|
|
}
|
|
}
|
|
</style>
|