From bbcabd409def4fbc3ae16de4783f3622b8de776a Mon Sep 17 00:00:00 2001 From: liyang <1711467488@qq.com> Date: Mon, 4 Jun 2018 14:26:51 +0800 Subject: [PATCH] no message Former-commit-id: 638153021a82cf494e930a9f7bb29cd5add3c964 Former-commit-id: 7163441389d505d2fd3fcfcc98a4f6b8ca606bbf Former-commit-id: 98306739ecb79c797976635f3fe2ac2d5d6caaae --- .../style/theme/{classic.scss => _bak.scss} | 48 ++++- src/assets/style/theme/classic/index.scss | 1 + src/assets/style/theme/classic/setting.scss | 1 + src/assets/style/theme/theme-base.scss | 166 ++++++++++++++++++ src/components/core/CardFull/index.vue | 45 ----- src/components/core/MainLayout/index.vue | 2 +- static/image/bg/star.jpg.REMOVED.git-id | 1 + 7 files changed, 217 insertions(+), 47 deletions(-) rename src/assets/style/theme/{classic.scss => _bak.scss} (66%) create mode 100644 src/assets/style/theme/classic/index.scss create mode 100644 src/assets/style/theme/classic/setting.scss create mode 100644 src/assets/style/theme/theme-base.scss create mode 100644 static/image/bg/star.jpg.REMOVED.git-id diff --git a/src/assets/style/theme/classic.scss b/src/assets/style/theme/_bak.scss similarity index 66% rename from src/assets/style/theme/classic.scss rename to src/assets/style/theme/_bak.scss index b730a417..97ed2787 100644 --- a/src/assets/style/theme/classic.scss +++ b/src/assets/style/theme/_bak.scss @@ -2,16 +2,62 @@ $theme-color: #EFF4F8; +$border-color: #d8dfea; // 默认主题 .layout-main { &.classic { height: 100vh; width: 100vw; background-color: $theme-color; + background-image: url('/static/image/bg/2.jpg'); + background-size: cover; + background-position: center; .el-card { box-shadow: none; &:hover { - box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5); + // box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5); + box-shadow: none; + } + } + .dd-card-full { + position: absolute; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + border-top: 1px solid $border-color; + border-left: 1px solid $border-color; + border-right: 1px solid $border-color; + background-color: #fff; + overflow: hidden; + color: #303133; + &:hover { + // box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5); + box-shadow: none; + } + .dd-card-full__header { + position: absolute; + top: 0px; + left: 0px; + width: 100%; + padding: 18px 20px; + border-bottom: 1px solid $border-color; + box-sizing: border-box; + } + .dd-card-full__body { + position: absolute; + padding: 20px; + left: 0px; + right: 0px; + bottom: 0px; + overflow: auto; + } + .dd-card-full__footer { + position: absolute; + bottom: 0px; + left: 0px; + width: 100%; + padding: 18px 20px; + border-top: 1px solid $border-color; + box-sizing: border-box; } } // [布局] 顶栏 diff --git a/src/assets/style/theme/classic/index.scss b/src/assets/style/theme/classic/index.scss new file mode 100644 index 00000000..54de7534 --- /dev/null +++ b/src/assets/style/theme/classic/index.scss @@ -0,0 +1 @@ +@import '../theme-base.scss'; \ No newline at end of file diff --git a/src/assets/style/theme/classic/setting.scss b/src/assets/style/theme/classic/setting.scss new file mode 100644 index 00000000..4fece6a7 --- /dev/null +++ b/src/assets/style/theme/classic/setting.scss @@ -0,0 +1 @@ +$theme-name: 'star' \ No newline at end of file diff --git a/src/assets/style/theme/theme-base.scss b/src/assets/style/theme/theme-base.scss new file mode 100644 index 00000000..33a61628 --- /dev/null +++ b/src/assets/style/theme/theme-base.scss @@ -0,0 +1,166 @@ +@import '~@/assets/style/public.scss'; + +$theme-color: #EFF4F8; + +$border-color: #d8dfea; +// 默认主题 +.classic { + height: 100vh; + width: 100vw; + background-color: $theme-color; + background-image: url('/static/image/bg/star.jpg'); + background-size: cover; + background-position: center; + .el-card { + box-shadow: none; + &:hover { + // box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5); + box-shadow: none; + } + } + .dd-card-full { + position: absolute; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + border-top: 1px solid $border-color; + border-left: 1px solid $border-color; + border-right: 1px solid $border-color; + background-color: #fff; + overflow: hidden; + color: #303133; + &:hover { + // box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5); + box-shadow: none; + } + .dd-card-full__header { + position: absolute; + top: 0px; + left: 0px; + width: 100%; + padding: 18px 20px; + border-bottom: 1px solid $border-color; + box-sizing: border-box; + } + .dd-card-full__body { + position: absolute; + padding: 20px; + left: 0px; + right: 0px; + bottom: 0px; + overflow: auto; + } + .dd-card-full__footer { + position: absolute; + bottom: 0px; + left: 0px; + width: 100%; + padding: 18px 20px; + border-top: 1px solid $border-color; + box-sizing: border-box; + } + } + // [布局] 顶栏 + .el-header { + padding: 0px; + // logo区域 + .logo-group { + transition: width .3s; + float: left; + text-align: center; + img { + height: 60px; + } + } + // 折叠侧边栏切换按钮 + .toggle-sidemenu-btn { + float: left; + height: 60px; + width: 60px; + display: flex; + justify-content: center; + align-items: center; + user-select: none; + cursor: pointer; + i { + font-size: 20px; + color: $color-text-normal; + margin-top: 4px; + &:hover { + color: $color-primary; + } + } + } + // [菜单] 顶栏 + .el-menu { + float: left; + border-bottom: none; + background-color: transparent; + .el-menu-item { + border-bottom: none; + border-top: 2px solid transparent; + &:hover { + background-color: transparent; + } + &.is-active { + border-bottom: none; + border-top: 2px solid $color-primary; + background-color: transparent; + } + } + } + // 顶栏右侧的按钮 + .btn-group { + float: right; + height: 60px; + display: flex; + align-items: center; + .btn-text { + color: $color-text-normal; + } + .el-dropdown { + user-select: none; + cursor: pointer; + } + } + } + // [布局] 顶栏下面 + .el-container { + // 侧边栏 + .el-aside { + transition: width .3s; + overflow: inherit; + // 空菜单 + .dd-side-menu-empty { + background-color: rgba(#000, .03); + margin: $margin; + margin-top: 0px; + border-radius: 4px; + line-height: 100px; + text-align: center; + color: $color-text-sub; + } + // [菜单] 正常状态 + .el-menu { + background-color: transparent; + border-right: none; + .el-submenu__title { + &:hover { + background-color: rgba(#000, .05); + } + } + } + // [菜单] 折叠状态 + .el-menu--collapse { + background-color: transparent; + .el-submenu__title { + text-align: center; + } + } + } + .el-main { + padding: 0px; + position: relative; + overflow: hidden; + } + } +} diff --git a/src/components/core/CardFull/index.vue b/src/components/core/CardFull/index.vue index 76cf9ea6..9ac535a0 100644 --- a/src/components/core/CardFull/index.vue +++ b/src/components/core/CardFull/index.vue @@ -65,48 +65,3 @@ export default { } } - - - diff --git a/src/components/core/MainLayout/index.vue b/src/components/core/MainLayout/index.vue index 3baabc18..f3da37bb 100644 --- a/src/components/core/MainLayout/index.vue +++ b/src/components/core/MainLayout/index.vue @@ -50,5 +50,5 @@ export default { diff --git a/static/image/bg/star.jpg.REMOVED.git-id b/static/image/bg/star.jpg.REMOVED.git-id new file mode 100644 index 00000000..7ee432a8 --- /dev/null +++ b/static/image/bg/star.jpg.REMOVED.git-id @@ -0,0 +1 @@ +5d5d5cae76bf221fe4df90af31aba1800c621bc3 \ No newline at end of file