github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-19 14:04:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: left pane style

Browse Source
This commit is contained in:
弱冠 2020-05-06 16:55:51 +08:00
parent 47838c19b9
commit c149f64e0f
2 changed files with 96 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/editor-skeleton/src/components/field/index.less
View File

@ -130,7 +130,7 @@
> .lc-field-head { > .lc-field-head {
padding-left: @x-gap/2; padding-left: @x-gap/2;
background: var(--color-block-background-light); background: var(--color-block-background-light);
border-bottom-color: var(--color-line-light); border-bottom-color: var(--color-line-light, rgba(31, 56, 88, .1));
> .lc-field-icon { > .lc-field-icon {
margin-right: @x-gap/2; margin-right: @x-gap/2;
} }

108
packages/editor-skeleton/src/layouts/workbench.less
View File

@ -54,12 +54,12 @@ body {
display: none; display: none;
} }
.lc-panel-title { .lc-panel-title {
height: 38px; height: 48px;
font-size: 14px; font-size: 16px;
background-color: var(--pane-title-bg-color,rgba(31,56,88,.04)); // background-color: var(--pane-title-bg-color,rgba(31,56,88,.04));
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: flex-start;
padding: 0 15px; padding: 0 15px;
border-bottom: 1px solid var(--color-line-normal,rgba(31,56,88,.1)); border-bottom: 1px solid var(--color-line-normal,rgba(31,56,88,.1));
@ -72,7 +72,7 @@ body {
.lc-panel-body { .lc-panel-body {
position: absolute; position: absolute;
top: 38px; top: 48px;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
@ -153,6 +153,72 @@ body {
} }
} }
*/ */
/*覆盖旧面板*/
/*组件面板*/
.ve-component-list {
.ve-component-list-body{
.ve-component-list-sidebar{
.ve-component-list-navigator{
.navigator-group{
&:last-child{
&::after{
display: none;
}
}
&::after{
content: '';
display: block;
height: 1px;
background-color: #EDEFF3;
line-height: 0;
margin: 4px 12px 0;
}
.navigator-group-head{
.navigator-group-title{
border-bottom: none;
}
}
.navigator-group-item{
border-left: 2px solid transparent;
&.active{
border-left-color: #0079f2;
border-right: none;
}
}
}
}
}
}
}
/*数据源*/
.engine-datapool{
.engine-datapool-view-group{
padding-top: 48px;
.engine-datapool-view-group-title{
height: 48px;
line-height: 48px;
font-size: 16px;
background-color: transparent;
padding: 0 16px;
border-bottom: 1px solid #EDEFF3;
}
}
}
/*动作面板*/
.ve-action-pane{
border-top: none;
.rc-tabs{
.rc-tabs-bar{
background-color: transparent;
.rc-tabs-tab{
line-height: 1;
&.rc-tabs-tab-active{
}
}
}
}
}
} }
.my-dock { .my-dock {
@ -222,8 +288,9 @@ body {
} }
.lc-pane-close{ .lc-pane-close{
position: absolute; position: absolute;
right: 10px; right: 16px;
top: 6px; top: 16px;
height: auto;
z-index: 2; z-index: 2;
.next-icon{ .next-icon{
line-height: 1; line-height: 1;
@ -231,17 +298,31 @@ body {
} }
.lc-tabs-title { .lc-tabs-title {
width: 100%; width: 100%;
height: 36px; height: 32px;
position: relative; position: relative;
display: center; display: center;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: rgba(31,56,88,0.04); // background: rgba(31,56,88,0.04);
border-bottom: 1px solid #EDEFF3;
margin-top: 48px;
.lc-tab-title{
flex: 1;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 2px solid transparent;
cursor: pointer;
&.actived{
border-bottom-color: #0079F2;
}
}
} }
.lc-tabs-content { .lc-tabs-content {
position: absolute; position: absolute;
top: 36px; top: 80px;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
@ -272,7 +353,7 @@ body {
height: 46px; height: 46px;
svg { svg {
fill: var(--color-icon-normal,rgba(31,56,88,.4)); // fill: var(--color-icon-normal,rgba(31,56,88,.4));
} }
&.has-tip{ &.has-tip{
@ -308,8 +389,9 @@ body {
} }
.lc-pane-close { .lc-pane-close {
position: absolute; position: absolute;
right: 10px; right: 16px;
top: 6px; top: 16px;
height: auto;
z-index: 2; z-index: 2;
.next-icon { .next-icon {
line-height: 1; line-height: 1;