Skip to content

Commit 6f6b73b

Browse files
committed
style: add style varibles and update some styles
1 parent e3e5123 commit 6f6b73b

File tree

17 files changed

+81
-297
lines changed

17 files changed

+81
-297
lines changed

packages/designer/src/builtin-simulator/bem-tools/borders.less

Lines changed: 8 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
}
1818
& > &-status {
1919
margin-left: 5px;
20-
color: #3c3c3c;
20+
color: var(--color-text, #3c3c3c);
2121
transform: translateY(-100%);
2222
font-weight: lighter;
2323
}
@@ -46,7 +46,7 @@
4646
opacity: 1;
4747
max-height: 100%;
4848
overflow: hidden;
49-
color: white;
49+
color: var(--color-icon-reverse, white);
5050
&:hover {
5151
background: var(--color-brand-light, #006cff);
5252
}
@@ -56,8 +56,8 @@
5656
display: inline-block;
5757
width: 8px;
5858
height: 8px;
59-
border: 1px solid #197aff;
60-
background: #fff;
59+
border: 1px solid var(--color-brand, #197aff);
60+
background: var(--color-block-background-normal, #fff);
6161
pointer-events: auto;
6262
z-index: 2;
6363
}
@@ -73,19 +73,16 @@
7373
&:after {
7474
content: "";
7575
display: block;
76-
border: 1px solid #197aff;
77-
background: #fff;
78-
// background: #738397;
76+
border: 1px solid var(--color-brand, #197aff);
77+
background: var(--color-block-background-normal, #fff);
7978
border-radius: 2px;
80-
// animation: flashing 1.5s infinite linear;
8179
}
8280

8381
&.e,
8482
&.w {
8583
cursor: ew-resize;
8684
&:after {
8785
width: 4px;
88-
// height: calc(100% - 20px);
8986
min-height: 50%;
9087
}
9188
}
@@ -94,62 +91,24 @@
9491
&.s {
9592
cursor: ns-resize;
9693
&:after {
97-
// width: calc(100% - 20px);
9894
min-width: 50%;
9995
height: 4px;
10096
}
10197
}
10298
}
10399

104-
// &&-hovering {
105100
&&-detecting {
106101
z-index: 1;
107102
border-style: dashed;
108-
background: rgba(0,121,242,.04);
109-
110-
&.x-loop {
111-
border-color: rgba(138, 93, 226, 0.8);
112-
background: rgba(138, 93, 226, 0.04);
113-
114-
>.@{scope}-title {
115-
color: rgba(138, 93, 226, 1.0);
116-
}
117-
}
118-
119-
&.x-condition {
120-
border-color: rgba(255, 99, 8, 0.8);
121-
background: rgba(255, 99, 8, 0.04);
122-
>.@{scope}-title {
123-
color: rgb(255, 99, 8);
124-
}
125-
}
103+
background: var(--color-block-background-light, rgba(0,121,242,.04));
126104
}
127105

128106
&&-selecting {
129107
z-index: 2;
130108
border-width: 2px;
131109

132-
&.x-loop {
133-
border-color: rgba(147, 112, 219, 1.0);
134-
background: rgba(147, 112, 219, 0.04);
135-
136-
>@{scope}-title {
137-
color: rgba(147, 112, 219, 1.0);
138-
}
139-
&.highlight {
140-
background: transparent;
141-
}
142-
}
143-
144-
&.x-condition {
145-
border-color: rgb(255, 99, 8);
146-
>@{scope}-title {
147-
color: rgb(255, 99, 8);
148-
}
149-
}
150-
151110
&.dragging {
152-
background: rgba(182, 178, 178, 0.8);
111+
background: var(--color-layer-mask-background, rgba(182, 178, 178, 0.8));
153112
border: none;
154113
}
155114
}

packages/designer/src/builtin-simulator/bem-tools/insertion.less

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,6 @@
2323
}
2424

2525
&.invalid {
26-
background-color: red;
26+
background-color: var(--color-function-error, red);
2727
}
2828
}

packages/designer/src/builtin-simulator/host.less

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@
3131
max-height: calc(100% - 32px);
3232
max-width: calc(100% - 32px);
3333
transform: translateX(-50%);
34-
box-shadow: 0 2px 10px 0 rgba(31,56,88,.15);
34+
box-shadow: 0 2px 10px 0 var(--color-block-background-shallow, rgba(31,56,88,.15));
3535
}
3636

3737
&-device-iphonex { // 增加默认的小程序的壳
@@ -44,7 +44,7 @@
4444
background: url(https://img.alicdn.com/tfs/TB1b4DHilFR4u4jSZFPXXanzFXa-750-1574.png) no-repeat top;
4545
background-size: 375px 812px;
4646
border-radius: 44px;
47-
box-shadow: rgba(0, 0, 0, 0.1) 0 36px 42px;
47+
box-shadow: var(--color-block-background-shallow, rgba(0, 0, 0, 0.1)) 0 36px 42px;
4848
.@{scope}-canvas-viewport {
4949
width: auto;
5050
top: 50px;
@@ -78,7 +78,7 @@
7878
bottom: 16px;
7979
left: 16px;
8080
width: auto;
81-
box-shadow: 0 1px 4px 0 rgba(31, 50, 88, 0.125);
81+
box-shadow: 0 1px 4px 0 var(--color-block-background-shallow, rgba(31, 50, 88, 0.125));
8282
}
8383

8484
&-content {

packages/designer/src/builtin-simulator/node-selector/index.less

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
margin-top: 2px;
4949
&-content {
5050
padding-left: 6px;
51-
background: #78869a;
51+
background: var(--color-layer-tooltip-background, #78869a);
5252
display: inline-flex;
5353
border-radius: 3px;
5454
align-items: center;

packages/designer/src/designer/drag-ghost/ghost.less

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@
77
flex-direction: column;
88
align-items: center;
99
pointer-events: none;
10-
background-color: rgba(0, 0, 0, 0.4);
11-
box-shadow: 0 0 6px grey;
10+
background-color: var(--color-block-background-deep-dark, rgba(0, 0, 0, 0.4));
11+
box-shadow: 0 0 6px var(--color-block-background-shallow, grey);
1212
transform: translate(-10%, -50%);
1313
.lc-ghost {
1414
.lc-ghost-title {

packages/designer/src/less-variables.less

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -99,19 +99,19 @@
9999
@brand-link-hover: #2e76a6;
100100

101101
// F1-1-7 A10
102-
@brand-danger-alpha-7: rgba(240, 70, 49, 0.9);
102+
@brand-danger-alpha-7: rgba(240, 70, 49, 0.1);
103103
// F1-1-8 A6
104104
@brand-danger-alpha-8: rgba(240, 70, 49, 0.8);
105105
// F2-1-2 A80
106106
@brand-warning-alpha-2: rgba(250, 189, 14, 0.8);
107107
// F2-1-7 A10
108-
@brand-warning-alpha-7: rgba(250, 189, 14, 0.9);
108+
@brand-warning-alpha-7: rgba(250, 189, 14, 0.1);
109109
// F3-1-2 A80
110110
@brand-success-alpha-2: rgba(102, 188, 92, 0.8);
111111
// F3-1-7 A10
112-
@brand-success-alpha-7: rgba(102, 188, 92, 0.9);
112+
@brand-success-alpha-7: rgba(102, 188, 92, 0.1);
113113
// F4-1-7 A10
114-
@brand-link-alpha-7: rgba(102, 188, 92, 0.9);
114+
@brand-link-alpha-7: rgba(102, 188, 92, 0.1);
115115

116116
// 文本色
117117
@text-primary-color: @dark-alpha-3;

packages/editor-core/src/widgets/tip/style.less

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@
156156
opacity: 0;
157157
border-radius: 3px;
158158
padding: 6px 8px;
159-
text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
159+
text-shadow: 0 -1px var(--color-field-label, rgba(0, 0, 0, 0.3));
160160
font-size: var(--font-size-text);
161161
line-height: 14px;
162162
max-width: 200px;
@@ -178,19 +178,19 @@
178178
height: 8px;
179179
&:after {
180180
border: 6px solid transparent;
181-
border-top-color: rgba(0, 0, 0, 0.7);
181+
border-top-color: var(--color-layer-tooltip-background, rgba(0, 0, 0, 0.7));
182182
}
183183
}
184184
&.lc-theme-black {
185-
background: rgba(0, 0, 0, 0.7);
185+
background: var(--color-icon-pane, rgba(0, 0, 0, 0.7));
186186
.lc-arrow:after {
187-
border-top-color: rgba(0, 0, 0, 0.7);
187+
border-top-color: var(--color-layer-tooltip-background, rgba(0, 0, 0, 0.7));
188188
}
189189
}
190190
&.lc-theme-green {
191-
background: #57a672;
191+
background: var(--color-function-success-dark, #57a672);
192192
.lc-arrow:after {
193-
border-top-color: #57a672;
193+
border-top-color: var(--color-function-success-dark, #57a672);
194194
}
195195
}
196196
&.lc-visible {

packages/editor-core/src/widgets/title/title.less

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
cursor: help;
2222
text-decoration-line: underline;
2323
text-decoration-style: dashed;
24-
text-decoration-color: rgba(31, 56, 88, .3);
24+
text-decoration-color: var(--color-text-light, rgba(31, 56, 88, .3));
2525
}
2626
line-height: initial !important;
2727
word-break: break-all;

packages/editor-skeleton/src/components/field/fields.tsx

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -203,40 +203,6 @@ export class Field extends Component<FieldProps> {
203203
*/
204204
function createValueState(/* valueState?: number, onClear?: (e: React.MouseEvent) => void */) {
205205
return null;
206-
207-
/*
208-
let tip: any = null;
209-
let className = 'lc-valuestate';
210-
let icon: any = null;
211-
if (valueState) {
212-
if (valueState < 0) {
213-
// multiple value 橘黄色点: tip:多种值,点击清除
214-
tip = intlNode('Multiple Value, Click to Clear');
215-
className += ' valuestate-multiple';
216-
icon = <IconClear size={6} />;
217-
} else if (valueState === 10) {
218-
// isset orangered tip: 必填项
219-
tip = intlNode('Required');
220-
className += ' valuestate-required';
221-
onClear = undefined;
222-
} else if (valueState > 0) {
223-
// isset 蓝点 tip: 已设置值,点击清除
224-
tip = intlNode('Setted Value, Click to Clear');
225-
className += ' valuestate-isset';
226-
icon = <IconClear size={6} />;
227-
}
228-
} else {
229-
onClear = undefined;
230-
// unset 占位空间
231-
}
232-
233-
return (
234-
<i className={className} onClick={onClear}>
235-
{icon}
236-
{tip && <Tip>{tip}</Tip>}
237-
</i>
238-
);
239-
*/
240206
}
241207

242208
export interface PopupFieldProps extends FieldProps {

0 commit comments

Comments
 (0)