feat:样式调整

This commit is contained in:
fit2cloud-chenyw 2021-03-08 11:57:18 +08:00
parent 708208d6d1
commit 3df90648a1
3 changed files with 17 additions and 9 deletions

View File

@ -13,12 +13,12 @@
<el-dropdown-item :disabled="language==='en'" command="en">
English
</el-dropdown-item>
<el-dropdown-item :disabled="language==='es'" command="es">
<!-- <el-dropdown-item :disabled="language==='es'" command="es">
Español
</el-dropdown-item>
<el-dropdown-item :disabled="language==='ja'" command="ja">
日本語
</el-dropdown-item>
</el-dropdown-item> -->
</el-dropdown-menu>
</el-dropdown>
</template>

View File

@ -7,6 +7,9 @@
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo">
<!-- <svg-icon icon-class="system" class="sidebar-logo" /> -->
<h1 class="sidebar-title">{{ title }} </h1>
</router-link>
</transition>
@ -23,15 +26,19 @@ export default {
}
},
data() {
const { title } = this.$store.state.permission.currentRoutes.meta
return {
title: 'Vue Admin Template',
title: title,
logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
// logo: icon
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/styles/variables.scss";
@import "~@/styles/sidebar.scss";
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
}
@ -46,7 +53,8 @@ export default {
width: 100%;
height: 50px;
line-height: 50px;
background: #2b2f3a;
// background: #2b2f3a;
background-color: $menuBg;
text-align: center;
overflow: hidden;
@ -64,7 +72,7 @@ export default {
& .sidebar-title {
display: inline-block;
margin: 0;
color: #fff;
// color: #fff;
font-weight: 600;
line-height: 50px;
font-size: 14px;

View File

@ -28,9 +28,9 @@
<screenfull id="screenfull" class="right-menu-item hover-effect" />
</el-tooltip>
<el-tooltip :content="$t('navbar.size')" effect="dark" placement="bottom">
<!-- <el-tooltip :content="$t('navbar.size')" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip>
</el-tooltip> -->
<lang-select class="right-menu-item hover-effect" />
</template>
@ -64,14 +64,14 @@ import variables from '@/styles/variables.scss'
import { isExternal } from '@/utils/validate'
import Doc from '@/components/Doc'
import Screenfull from '@/components/Screenfull'
import SizeSelect from '@/components/SizeSelect'
// import SizeSelect from '@/components/SizeSelect'
import LangSelect from '@/components/LangSelect'
export default {
name: 'Topbar',
components: {
AppLink,
Screenfull,
SizeSelect,
// SizeSelect,
LangSelect,
Doc
},