Improve desktop UX (#4262)

* wip

* wip

* wip

* wip

* wip

* wip

* Merge

* wip

* wip

* wip

* wip

* wip

* wip
This commit is contained in:
syuilo
2019-02-15 05:08:59 +09:00
committed by GitHub
parent 38ca514f53
commit 53422ffcb2
60 changed files with 1132 additions and 1222 deletions

View File

@ -2,20 +2,20 @@
<div class="nav">
<ul>
<template v-if="$store.getters.isSignedIn">
<template v-if="$store.state.device.deckDefault">
<li class="deck" :class="{ active: $route.name == 'deck' || $route.name == 'index' }" @click="goToTop">
<template v-if="$store.state.device.deckMode">
<li class="deck active" @click="goToTop">
<router-link to="/"><fa icon="columns"/><p>{{ $t('deck') }}</p></router-link>
</li>
<li class="home" :class="{ active: $route.name == 'home' }" @click="goToTop">
<router-link to="/home"><fa icon="home"/><p>{{ $t('home') }}</p></router-link>
<li class="home">
<a @click="toggleDeckMode(false)"><fa icon="home"/><p>{{ $t('home') }}</p></a>
</li>
</template>
<template v-else>
<li class="home" :class="{ active: $route.name == 'home' || $route.name == 'index' }" @click="goToTop">
<li class="home active" @click="goToTop">
<router-link to="/"><fa icon="home"/><p>{{ $t('home') }}</p></router-link>
</li>
<li class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop">
<router-link to="/deck"><fa icon="columns"/><p>{{ $t('deck') }}</p></router-link>
<li class="deck">
<a @click="toggleDeckMode(true)"><fa icon="columns"/><p>{{ $t('deck') }}</p></a>
</li>
</template>
<li class="messaging">
@ -70,6 +70,11 @@ export default Vue.extend({
}
},
methods: {
toggleDeckMode(deck) {
this.$store.commit('device/set', { key: 'deckMode', value: deck });
location.reload();
},
onReversiInvited() {
this.hasGameInvitations = true;
},