1
0
mirror of https://github.com/h3poteto/whalebird-desktop synced 2025-02-01 09:56:46 +01:00

Merge pull request #1052 from h3poteto/fix/design/scroll

Fix scrollbar design for preferences and settings
This commit is contained in:
AkiraFukushima 2019-09-27 00:02:52 +09:00 committed by GitHub
commit 6e1456b48d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 38 deletions

View File

@ -74,6 +74,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
#preferences { #preferences {
height: 100%; height: 100%;
overflow: auto;
.header { .header {
text-align: center; text-align: center;

View File

@ -1,39 +1,40 @@
<template> <template>
<el-container id="settings"> <el-container id="settings">
<el-header class="header"> <el-header class="header">
<el-row> <el-row>
<el-col :span="23"> <el-col :span="23">
<h1>{{ $t('settings.title') }}</h1> <h1>{{ $t('settings.title') }}</h1>
</el-col> </el-col>
<el-col :span="1"> <el-col :span="1">
<el-button type="text" icon="el-icon-close" @click="close" class="close-button" role="button"></el-button> <el-button type="text" icon="el-icon-close" @click="close" class="close-button" role="button"></el-button>
</el-col> </el-col>
</el-row> </el-row>
</el-header> </el-header>
<el-container> <el-container>
<div v-shortkey="['esc']" @shortkey="close"></div> <div v-shortkey="['esc']" @shortkey="close"></div>
<el-aside width="240px" class="menu"> <el-aside width="240px" class="menu">
<el-menu <el-menu
:default-active="activeRoute()" :default-active="activeRoute()"
class="setting-menu" class="setting-menu"
:text-color="primaryColor" :text-color="primaryColor"
:background-color="backgroundColor" :background-color="backgroundColor"
:router="true"> :router="true"
<el-menu-item :index="`/${id()}/settings/general`"> >
<icon name="cog" class="icon" scale="1.3"></icon> <el-menu-item :index="`/${id()}/settings/general`">
<span>{{ $t('settings.general.title') }}</span> <icon name="cog" class="icon" scale="1.3"></icon>
</el-menu-item> <span>{{ $t('settings.general.title') }}</span>
<el-menu-item :index="`/${id()}/settings/timeline`"> </el-menu-item>
<icon name="align-left" class="icon" scale="1.3"></icon> <el-menu-item :index="`/${id()}/settings/timeline`">
<span>{{ $t('settings.timeline.title') }}</span> <icon name="align-left" class="icon" scale="1.3"></icon>
</el-menu-item> <span>{{ $t('settings.timeline.title') }}</span>
</el-menu> </el-menu-item>
</el-aside> </el-menu>
<el-main> </el-aside>
<router-view></router-view> <el-main>
</el-main> <router-view></router-view>
</el-main>
</el-container>
</el-container> </el-container>
</el-container>
</template> </template>
<script> <script>
@ -47,18 +48,18 @@ export default {
backgroundColor: state => state.App.theme.background_color backgroundColor: state => state.App.theme.background_color
}) })
}, },
created () { created() {
this.$store.commit('Settings/changeAccountID', this.id()) this.$store.commit('Settings/changeAccountID', this.id())
this.$router.push(`/${this.id()}/settings/general`) this.$router.push(`/${this.id()}/settings/general`)
}, },
methods: { methods: {
id () { id() {
return this.$route.params.id return this.$route.params.id
}, },
close () { close() {
this.$router.push(`/${this.id()}/home`) this.$router.push(`/${this.id()}/home`)
}, },
activeRoute () { activeRoute() {
return this.$route.path return this.$route.path
} }
} }
@ -68,6 +69,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
#settings { #settings {
height: 100%; height: 100%;
overflow: auto;
.header { .header {
text-align: center; text-align: center;