diff --git a/public/index.html b/public/index.html index c524612..6ed26c9 100644 --- a/public/index.html +++ b/public/index.html @@ -22,8 +22,8 @@ .chromeframe { margin: 0.2em 0; - background: #4B9AE9; - color: #000; + background: #0b542b; + color: #fff; padding: 0.2em 0; } @@ -46,7 +46,7 @@ margin: -75px 0 0 -75px; border-radius: 50%; border: 3px solid transparent; - border-top-color: #4B9AE9; + border-top-color: #0b542b; -webkit-animation: spin 2s linear infinite; -ms-animation: spin 2s linear infinite; -moz-animation: spin 2s linear infinite; @@ -64,7 +64,7 @@ bottom: 5px; border-radius: 50%; border: 3px solid transparent; - border-top-color: #4B9AE9; + border-top-color: #0b542b; -webkit-animation: spin 3s linear infinite; -moz-animation: spin 3s linear infinite; -o-animation: spin 3s linear infinite; @@ -81,7 +81,7 @@ bottom: 15px; border-radius: 50%; border: 3px solid transparent; - border-top-color: #4B9AE9; + border-top-color: #0b542b; -moz-animation: spin 1.5s linear infinite; -o-animation: spin 1.5s linear infinite; -ms-animation: spin 1.5s linear infinite; @@ -181,7 +181,7 @@ #loader-wrapper .load_title { font-family: 'Open Sans'; - color: #4B9AE9; + color: #0b542b; font-size: 19px; width: 100%; text-align: center; @@ -196,7 +196,7 @@ font-weight: normal; font-style: italic; font-size: 13px; - color: #4B9AE9; + color: #0b542b; opacity: 0.5; } diff --git a/src/assets/scss/_base.scss b/src/assets/scss/_base.scss index 1bcab2d..f19d6d3 100644 --- a/src/assets/scss/_base.scss +++ b/src/assets/scss/_base.scss @@ -315,7 +315,7 @@ img { ------------------------------ */ .site-content { position: relative; - padding: 15px; + padding: 8px 0 0; &__wrapper { position: relative; @@ -325,7 +325,7 @@ img { background: $content--background-color; } &--tabs { - padding: 40px 0 0; + padding: 48px 0 0; } > .el-tabs { > .el-tabs__header { @@ -334,9 +334,10 @@ img { left: 230px; right: 0; z-index: 930; - padding: 0 55px 0 15px; + padding: 0 55px 0 0; // box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .12), 0 0 6px 0 rgba(0, 0, 0, .04); background-color: #fff; + margin-bottom: 0; > .el-tabs__nav-wrap { margin-bottom: 0; &:after { diff --git a/src/assets/scss/_variables.scss b/src/assets/scss/_variables.scss index 9995f32..a2be420 100644 --- a/src/assets/scss/_variables.scss +++ b/src/assets/scss/_variables.scss @@ -1,6 +1,6 @@ // 站点主色 // tips: 要达到整站主题修改效果, 请确保[$--color-primary]站点主色与[/src/element-ui-theme/index.js]文件中[import './element-[#17B3A3]/index.css']当前主题色一致 -$--color-primary: #09542b; +$--color-primary: #0b542b; // Navbar $navbar--background-color: $--color-primary; diff --git a/src/element-theme.scss b/src/element-theme.scss new file mode 100644 index 0000000..30d54b9 --- /dev/null +++ b/src/element-theme.scss @@ -0,0 +1,8 @@ +/* 覆盖 element-ui 默认主题色 */ +$--color-primary: #0b542b; + +/* 修正 element-ui 字体路径变量 */ +$--font-path: '~element-ui/lib/theme-chalk/fonts'; + +/* 引入 element-ui 源码 */ +@import "~element-ui/packages/theme-chalk/src/index"; diff --git a/src/main.js b/src/main.js index 0f0d862..ad73676 100644 --- a/src/main.js +++ b/src/main.js @@ -14,7 +14,8 @@ import VueCookie from 'vue-cookie' // api: https://github.com/alfhen/ import ElementUI from 'element-ui'; // api: https://github.com/ElemeFE/element import meta from 'vue-meta' import "./style/tailwindcss.css"; -import 'element-ui/lib/theme-chalk/index.css'; +// import 'element-ui/lib/theme-chalk/index.css'; +import '@/element-theme.scss'; // 引入自定义的 Element UI 主题 import '@/icons' // api: http://www.iconfont.cn/ import '@/utils/plugins' import '@/assets/scss/index.scss' diff --git a/src/views/common/home.vue b/src/views/common/home.vue index c89f998..7629000 100644 --- a/src/views/common/home.vue +++ b/src/views/common/home.vue @@ -8,6 +8,33 @@ --> diff --git a/src/views/main-content.vue b/src/views/main-content.vue index 5a1a92d..a0cfd98 100644 --- a/src/views/main-content.vue +++ b/src/views/main-content.vue @@ -8,6 +8,7 @@ v-if="$route.meta.isTab" v-model="mainTabsActiveName" :closable="true" + type="card" @tab-click="selectedTabHandle" @tab-remove="removeTabHandle" > @@ -56,8 +57,8 @@ item.title.length > 6 ? `${item.title.slice(0, 6)}...` : item.title }} - - + +