From 17b0294951ff2099a3d0e05c283910e24945500e Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Tue, 3 Jul 2018 09:48:23 +0800
Subject: [PATCH] no message
Former-commit-id: 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly 13af02b4d4c4033582b2762f14fbe8802ec5fc02 [formerly b9712ed794d1db939f9b2bdbb67c8a69d71f89a8 [formerly b6115665f5243c3103684226e0bde661d55597f7]]]]]
Former-commit-id: e3cc9b0aad9cacee0133f5f4c85d43cde717cc9c
Former-commit-id: 63d819826ff2aeb0ca7a811f8b7ddfbe2df048d1
Former-commit-id: 7ebe1bb886125ee3de1c15cd5cbf14c392480af8 [formerly 8df52d9a84afa8e50895c9611ab439b58bfa1d90]
Former-commit-id: ccf6ecbd64a1a2fd5283effabd054bcebc799b6d
Former-commit-id: afde6581b46898bbb98e299ebd7194dc0577f934
Former-commit-id: 8278de89c188805da05d81e10c7aba77bb64c336
Former-commit-id: 89a57f2fae80b360ab76a9d3f2bc99540adaf519
Former-commit-id: 03bf8adadfa169fee5cb039818e415ceb92fd787
---
.../d2-layout-main-group.xmind.REMOVED.git-id | 1 +
src/assets/style/theme/theme-base.scss | 120 ++++++++++++------
src/assets/style/theme/theme.scss | 6 +-
.../components/-menu-side/index.vue | 9 --
src/components/core/d2-layout-main/index.vue | 20 +--
5 files changed, 98 insertions(+), 58 deletions(-)
create mode 100644 design/d2-layout-main-group.xmind.REMOVED.git-id
diff --git a/design/d2-layout-main-group.xmind.REMOVED.git-id b/design/d2-layout-main-group.xmind.REMOVED.git-id
new file mode 100644
index 00000000..ba2b8b21
--- /dev/null
+++ b/design/d2-layout-main-group.xmind.REMOVED.git-id
@@ -0,0 +1 @@
+f6ee530a7841eb687cae7821453739533292ddd6
\ No newline at end of file
diff --git a/src/assets/style/theme/theme-base.scss b/src/assets/style/theme/theme-base.scss
index d427046e..6226317d 100644
--- a/src/assets/style/theme/theme-base.scss
+++ b/src/assets/style/theme/theme-base.scss
@@ -1,3 +1,82 @@
+// 整体框架结构
+.d2-layout-main-group {
+ height: 100%;
+ width: 100%;
+ background-size: cover;
+ background-position: center;
+ overflow: hidden;
+ position: relative;
+ // 背景上面的半透明遮罩
+ .d2-layout-main-mask {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ left: 0px;
+ }
+ // 内容层
+ .d2-layout-main-content {
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ bottom: 0px;
+ left: 0px;
+ $d2-theme-header-height: 60px;
+ .d2-theme-header {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ right: 0px;
+ height: $d2-theme-header-height;
+ }
+ .d2-theme-container {
+ position: absolute;
+ top: $d2-theme-header-height;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ display: flex;
+ flex-direction: row;
+ .d2-theme-container-aside {
+ transition: width .3s;
+ flex-grow: 0;
+ position: relative;
+ .d2-layout-main-menu-side {
+ position: absolute;
+ top: 0px;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ overflow: hidden;
+ }
+ }
+ .d2-theme-container-main {
+ flex-grow: 1;
+ padding: 0px;
+ position: relative;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ .d2-theme-container-main-header {
+ flex-grow: 0;
+ }
+ .d2-theme-container-main-body {
+ flex-grow: 1;
+ margin-top: 1px;
+ position: relative;
+ }
+ }
+ }
+ }
+}
+
+
+
+
+
+
+
+
// 主题公用
.d2-layout-main-group {
&.grayMode {
@@ -8,30 +87,10 @@
filter: grayscale(100%);
filter: gray;
}
- height: 100%;
- width: 100%;
- background-size: cover;
- background-position: center;
- overflow: hidden;
- position: relative;
- // 背景上面的半透明遮罩
- .layout-main-mask {
- position: absolute;
- top: 0px;
- right: 0px;
- bottom: 0px;
- left: 0px;
- }
// 主体
- .el-container.d2-layout-main-content {
- position: absolute;
- top: 0px;
- right: 0px;
- bottom: 0px;
- left: 0px;
+ .d2-layout-main-content {
// [布局] 顶栏
- .el-header.d2-theme-header {
- padding: 0px;
+ .d2-theme-header {
// logo区域
.logo-group {
transition: width .3s;
@@ -96,11 +155,9 @@
}
}
// [布局] 顶栏下面
- .el-container.d2-theme-container {
+ .d2-theme-container {
// 侧边栏
- .el-aside.d2-theme-container-aside {
- transition: width .3s;
- overflow: auto;
+ .d2-theme-container-aside {
// [菜单] 正常状态
.el-menu {
@extend %unable-select;
@@ -155,15 +212,9 @@
}
}
// 右下 主体
- .el-main.d2-theme-container-main {
- padding: 0px;
- position: relative;
- overflow: hidden;
- display: flex;
- flex-direction: column;
+ .d2-theme-container-main {
// 主体部分分为多页面控制器 和主体
.d2-theme-container-main-header {
- flex-grow: 0;
// 多页面控制器
.d2-multiple-page-control-group {
display: flex;
@@ -203,9 +254,6 @@
}
// 主体
.d2-theme-container-main-body {
- flex-grow: 1;
- margin-top: 1px;
- position: relative;
// 布局组件
.container-component {
// 卡片布局组件
diff --git a/src/assets/style/theme/theme.scss b/src/assets/style/theme/theme.scss
index d5cd96d7..d1d22f2d 100644
--- a/src/assets/style/theme/theme.scss
+++ b/src/assets/style/theme/theme.scss
@@ -115,9 +115,9 @@
}
}
// [布局] 顶栏下面
- .el-container.d2-theme-container {
+ .d2-theme-container {
// 侧边栏
- .el-aside.d2-theme-container-aside {
+ .d2-theme-container-aside {
// 菜单为空的时候显示的信息
.menu-empty {
background: $theme-aside-menu-empty-background-color;
@@ -191,7 +191,7 @@
}
}
}
- .el-main.d2-theme-container-main {
+ .d2-theme-container-main {
// 主体部分分为多页面控制器 和主体
.d2-theme-container-main-header {
// 多页面控制器
diff --git a/src/components/core/d2-layout-main/components/-menu-side/index.vue b/src/components/core/d2-layout-main/components/-menu-side/index.vue
index 480eb8fa..673e1e6f 100644
--- a/src/components/core/d2-layout-main/components/-menu-side/index.vue
+++ b/src/components/core/d2-layout-main/components/-menu-side/index.vue
@@ -78,12 +78,3 @@ export default {
}
}
-
-
diff --git a/src/components/core/d2-layout-main/index.vue b/src/components/core/d2-layout-main/index.vue
index 5a2f5cb2..60025cb2 100644
--- a/src/components/core/d2-layout-main/index.vue
+++ b/src/components/core/d2-layout-main/index.vue
@@ -6,9 +6,9 @@
-
+
-
+