mirror of
https://github.com/paricafe/misskey.git
synced 2024-11-25 06:16:42 -06:00
Go to top
This commit is contained in:
parent
7ec9b03990
commit
41e657b64e
2 changed files with 35 additions and 17 deletions
|
@ -2,13 +2,13 @@
|
|||
<div class="nav">
|
||||
<ul>
|
||||
<template v-if="$store.getters.isSignedIn">
|
||||
<li class="home" :class="{ active: $route.name == 'index' }">
|
||||
<li class="home" :class="{ active: $route.name == 'index' }" @click="goToTop">
|
||||
<router-link to="/">
|
||||
%fa:home%
|
||||
<p>%i18n:@home%</p>
|
||||
</router-link>
|
||||
</li>
|
||||
<li class="deck" :class="{ active: $route.name == 'deck' }">
|
||||
<li class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop">
|
||||
<router-link to="/deck">
|
||||
%fa:columns%
|
||||
<p>%i18n:@deck% <small>(beta)</small></p>
|
||||
|
@ -82,6 +82,14 @@ export default Vue.extend({
|
|||
|
||||
game() {
|
||||
(this as any).os.new(MkGameWindow);
|
||||
},
|
||||
|
||||
goToTop(e: HTMLElement) {
|
||||
if (e.classList.contains('active'))
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -9,6 +9,9 @@
|
|||
<div class="left">
|
||||
<x-nav/>
|
||||
</div>
|
||||
<div class="center">
|
||||
<div class="icon" @click="goToTop"></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<x-search/>
|
||||
<x-account v-if="$store.getters.isSignedIn"/>
|
||||
|
@ -42,6 +45,14 @@ export default Vue.extend({
|
|||
XPost,
|
||||
XClock,
|
||||
},
|
||||
methods: {
|
||||
goToTop() {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$store.commit('setUiHeaderHeight', 48);
|
||||
|
||||
|
@ -142,26 +153,25 @@ root(isDark)
|
|||
max-width 1300px
|
||||
margin 0 auto
|
||||
|
||||
&:before
|
||||
content ""
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
display block
|
||||
width 100%
|
||||
height 48px
|
||||
background-image isDark ? url('/assets/desktop/header-icon.dark.svg') : url('/assets/desktop/header-icon.light.svg')
|
||||
background-size 24px
|
||||
background-position center
|
||||
background-repeat no-repeat
|
||||
opacity 0.3
|
||||
> .center
|
||||
margin auto
|
||||
> .icon
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
display block
|
||||
width 48px
|
||||
height 48px
|
||||
background-image isDark ? url('/assets/desktop/header-icon.dark.svg') : url('/assets/desktop/header-icon.light.svg')
|
||||
background-size 24px
|
||||
background-position center
|
||||
background-repeat no-repeat
|
||||
opacity 0.3
|
||||
|
||||
> .left
|
||||
margin 0 auto 0 0
|
||||
height 48px
|
||||
|
||||
> .right
|
||||
margin 0 0 0 auto
|
||||
height 48px
|
||||
|
||||
> *
|
||||
|
|
Loading…
Reference in a new issue