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

Merge branch 'release/0.9.0' of gitlab.alibaba-inc.com:ali-lowcode/ali-lowcode-engine into release/0.9.0

Browse Source
This commit is contained in:
kangwei 2020-07-14 15:43:35 +08:00
commit 4df110c5d5
3 changed files with 51 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,8 +1,7 @@
@x-gap: 10px;
@x-gap: 12px;
@y-gap: 8px;
.lc-field {
// head
.lc-field-head {
display: flex;
align-items: center;
@ -61,23 +60,11 @@
}
}
.lc-field-icon {
// margin-right: @x-gap;
transform-origin: center;
transition: transform 0.1s;
}
}
// &.lc-plain-field {
// // for top-level style
// // padding: 8px 10px;
// > .lc-field-body {
// flex: 1;
// min-width: 0;
// display: flex;
// align-items: center;
// }
// }
&.lc-inline-field {
display: flex;
align-items: center;
@ -111,29 +98,33 @@
&.lc-block-field, &.lc-accordion-field {
display: block;
&:not(:first-child) {
border-top: 1px solid var(--color-line-normal);
&:first-child {
> .lc-field-head {
border-top: none;
}
}
> .lc-field-head {
// padding-left: @x-gap;
height: 32px;
display: flex;
align-items: center;
font-weight: 500;
// background: var(--color-block-background-shallow, rgba(31,56,88,.06));
// border-bottom: 1px solid var(--color-line-normal);
// color: var(--color-title);
background: var(--color-block-background-shallow, rgba(31,56,88,.06));
border-top: 1px solid var(--color-line-normal,rgba(31,56,88,.1));
border-bottom: 1px solid var(--color-line-normal,rgba(31,56,88,.1));
color: var(--color-title);
padding: 0 16px;
background-color: #F7F9FC;
color: #8F9BB3;
user-select: none;
> .lc-field-icon {
color: #8F9BB3;
}
}
> .lc-field-body {
// padding: @y-gap @x-gap/2;
padding: 16px;
padding: 12px;
.lc-inline-field{
margin-bottom: 16px;
margin-bottom: 12px;
&:last-child{
margin-bottom: 0;
}
@ -162,10 +153,15 @@
&.lc-accordion-field {
position: relative;
// collapsed
&:last-child.lc-field-is-collapsed{
border-bottom: 1px solid var(--color-line-normal);
&.lc-field-is-collapsed {
margin-bottom: 6px;
}
// collapsed
// &:last-child.lc-field-is-collapsed{
// border-bottom: 1px solid var(--color-line-normal);
// }
&.lc-field-is-collapsed {
> .lc-field-head .lc-field-icon {
transform: rotate(180deg);
@ -200,14 +196,19 @@
.lc-accordion-field, .lc-block-field {
> .lc-field-head {
padding-left: @x-gap/2;
padding-left: @x-gap;
background: var(--color-block-background-light);
border-bottom-color: var(--color-line-light, rgba(31, 56, 88, .1));
border-bottom: none;
border-top: none;
> .lc-field-icon {
// margin-right: @x-gap/2;
margin-right: 0;
}
}
> .lc-field-body {
padding: 8px;
}
}
// 3rd level field title width should short

16
packages/editor-skeleton/src/components/mixed-setter/style.less
View File

@ -6,7 +6,7 @@
position: relative;
>.lc-setter-actions {
position: absolute;
right: -2px;
right: -4px;
top: 50%;
transform: translate(100%, -50%);
.lc-switch-trigger {
@ -18,11 +18,19 @@
}
.lc-title {
cursor: pointer;
.lc-title-icon svg {
fill: #8F9BB3;
}
}
.variable-binded {
background: var(--color-brand, #006cff);
color: #fff!important;
border-radius: 3px;
.lc-title-icon svg {
fill: #fff;
}
}
}
.next-input,.next-date-picker,.next-month-picker {
@ -42,7 +50,7 @@
margin-right: 0;
>.lc-setter-actions {
position: absolute;
right: 16px;
right: 12px;
top: 0;
height: 32px;
transform: none;
@ -56,8 +64,8 @@
position: static;
margin-right: 0;
> .lc-setter-actions{
right: 32px;
top: 6px;
right: 36px;
top: 4px;
transform: none;
}
}

14
packages/editor-skeleton/src/components/settings/settings-primary-pane.tsx
View File

@ -42,22 +42,26 @@ export class SettingsPrimaryPane extends Component<{ editor: Editor }> {
const items = [];
let l = 3;
while (l-- > 0 && node) {
const _node = node;
const props =
l === 2
? {}
: {
onMouseOver: hoverNode.bind(null, node, true),
onMouseOut: hoverNode.bind(null, node, false),
onMouseOver: hoverNode.bind(null, _node, true),
onMouseOut: hoverNode.bind(null, _node, false),
onClick: () => {
selectNode.call(null, node);
const getName = (node) => {
if (!_node) {
return;
}
selectNode.call(null, _node);
const getName = (node: any) => {
const npm = node?.componentMeta?.npm;
return [npm?.package, npm?.componentName].filter((item) => !!item).join('-') ||
node?.componentMeta?.componentName ||
'';
};
const selected = getName(current);
const target = getName(node);
const target = getName(_node);
editor?.emit('skeleton.settingsPane.Breadcrumb', {
selected,
target,