Skip to content

Commit c00a36d

Browse files
committed
updated color picker and UI of material editor.
1 parent 66135f2 commit c00a36d

21 files changed

Lines changed: 682 additions & 263 deletions

resources/ui/css/base.bss

16.1 KB
Binary file not shown.

resources/ui/css/base.css

Lines changed: 465 additions & 20 deletions
Large diffs are not rendered by default.
1.68 KB
Binary file not shown.

resources/ui/css/custom_classes.css

Lines changed: 97 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -124,10 +124,10 @@
124124
-fx-min-width: 200px;
125125
-fx-pref-width: -fx-min-width;
126126
-fx-max-width: -fx-min-width;
127-
-fx-min-height: 26;
127+
-fx-min-height: 26px;
128128
-fx-pref-height: -fx-min-height;
129129
-fx-max-height: -fx-min-height;
130-
-fx-padding: 0 6px 0 0;
130+
-fx-padding: 0px 6px 0px 0px;
131131
}
132132

133133
.audio-viewer-editor-param-value {
@@ -208,7 +208,7 @@
208208
.transparent-text-area:focused {
209209
-fx-border-color: transparent;
210210
-fx-border-width: 0px;
211-
-fx-border-insets: 0;
211+
-fx-border-insets: 0px;
212212
-fx-padding: 0px;
213213
}
214214

@@ -282,7 +282,7 @@
282282
.flat-button {
283283
-fx-background: transparent;
284284
-fx-background-color: -fx-background;
285-
-fx-background-insets: 0;
285+
-fx-background-insets: 0px;
286286
-fx-background-radius: 2px;
287287
-fx-border-color: transparent;
288288
-fx-border-width: 0px;
@@ -311,47 +311,117 @@
311311
******************************************************************************/
312312

313313
.input-control-toolbar-button {
314-
-fx-min-height: 24;
314+
-fx-min-height: 24px;
315315
-fx-pref-height: -fx-min-height;
316316
-fx-max-height: -fx-min-height;
317-
-fx-min-width: 24;
317+
-fx-min-width: 24px;
318318
-fx-pref-width: -fx-min-width;
319319
-fx-max-width: -fx-min-width;
320320
}
321321

322322
/*******************************************************************************
323323
* *
324-
* File Editor Toolbar Button *
324+
* File Editor *
325325
* *
326326
******************************************************************************/
327327

328328
.file-editor-toolbar-button {
329-
-fx-min-height: 24;
329+
-fx-min-height: 24px;
330330
-fx-pref-height: -fx-min-height;
331331
-fx-max-height: -fx-min-height;
332-
-fx-min-width: 24;
332+
-fx-min-width: 24px;
333333
-fx-pref-width: -fx-min-width;
334334
-fx-max-width: -fx-min-width;
335335
}
336336

337-
/*******************************************************************************
338-
* *
339-
* File Editor Toolbar Label *
340-
* *
341-
******************************************************************************/
342-
343337
.file-editor-toolbar-label {
344-
-fx-min-height: 24;
338+
-fx-min-height: 24px;
339+
-fx-pref-height: -fx-min-height;
340+
-fx-max-height: -fx-min-height;
341+
}
342+
343+
.file-editor-toolbar-field {
344+
-fx-min-height: 24px;
345+
-fx-pref-height: -fx-min-height;
346+
-fx-max-height: -fx-min-height;
347+
}
348+
349+
.file-editor-main-split-pane {
350+
-fx-background-color: transparent;
351+
}
352+
353+
.file-editor-toolbar {
354+
-fx-background-color: -var-background-color;
355+
-fx-border-color: -var-border-color;
356+
-fx-border-width: 0px 0px 1px 0px;
357+
-fx-min-height: 30px;
345358
-fx-pref-height: -fx-min-height;
346359
-fx-max-height: -fx-min-height;
360+
-fx-padding: 10px, 0px, 0px, 0px;
361+
-fx-alignment: center-left;
347362
}
363+
364+
.file-editor-editor-area {
365+
}
366+
367+
.file-editor-tool-split-pane {
368+
-fx-background-color: transparent;
369+
-fx-orientation: vertical;
370+
}
371+
372+
.file-editor-tool-component {
373+
-fx-background-color: -var-background-color;
374+
-fx-min-width: 30px;
375+
}
376+
348377
/*******************************************************************************
349378
* *
350-
* File Editor Toolbar Field *
379+
* Material File Editor *
351380
* *
352381
******************************************************************************/
353382

354-
.file-editor-toolbar-field {
383+
.material-file-editor-properties-component {
384+
-fx-background-color: transparent;
385+
-fx-alignment: top-left;
386+
-fx-padding: 0px 5px 0px 4px;
387+
}
388+
389+
.material-file-editor-param-control {
390+
-fx-alignment: center-left;
391+
-fx-padding: 1px 0px 1px 0px;
392+
}
393+
394+
.material-file-editor-param-control-name {
395+
-fx-min-height: 24px;
396+
-fx-pref-height: -fx-min-height;
397+
-fx-max-height: -fx-min-height;
398+
-fx-alignment: center-right;
399+
-fx-text-alignment: right;
400+
-fx-padding: 0px 2px 0px 0px;
401+
}
402+
403+
.material-file-editor-param-control-texture-preview {
404+
-fx-min-height: 30px;
405+
-fx-pref-height: -fx-min-height;
406+
-fx-max-height: -fx-min-height;
407+
-fx-min-width: 30px;
408+
-fx-pref-width: -fx-min-width;
409+
-fx-max-width: -fx-min-width;
410+
-fx-border-color: -var-border-color;
411+
-fx-border-width: 1px;
412+
}
413+
414+
.material-file-editor-param-control-button {
415+
-fx-min-height: 20px;
416+
-fx-pref-height: -fx-min-height;
417+
-fx-max-height: -fx-min-height;
418+
-fx-min-width: 20px;
419+
-fx-pref-width: -fx-min-width;
420+
-fx-max-width: -fx-min-width;
421+
-fx-padding: 1px;
422+
}
423+
424+
.material-file-editor-param-control-color-picker {
355425
-fx-min-height: 24;
356426
-fx-pref-height: -fx-min-height;
357427
-fx-max-height: -fx-min-height;
@@ -384,39 +454,39 @@
384454

385455
.settings-dialog-label {
386456
-fx-alignment: center-right;
387-
-fx-min-width: 250;
457+
-fx-min-width: 250px;
388458
-fx-pref-width: -fx-min-width;
389459
-fx-max-width: -fx-min-width;
390-
-fx-min-height: 26;
460+
-fx-min-height: 26px;
391461
-fx-pref-height: -fx-min-height;
392462
-fx-max-height: -fx-min-height;
393-
-fx-padding: 0 6 0 0;
463+
-fx-padding: 0px 6px 0px 0px;
394464
}
395465

396466
.settings-dialog-short-label {
397467
-fx-alignment: center;
398-
-fx-min-height: 26;
468+
-fx-min-height: 26px;
399469
-fx-pref-height: -fx-min-height;
400470
-fx-max-height: -fx-min-height;
401-
-fx-min-width: 20;
471+
-fx-min-width: 20px;
402472
-fx-max-width: -fx-min-width;
403473
-fx-mpref-width: -fx-min-width;
404474
}
405475

406476
.settings-dialog-field {
407477
-fx-alignment: center-left;
408-
-fx-min-height: 26;
478+
-fx-min-height: 26px;
409479
-fx-pref-height: -fx-min-height;
410480
-fx-max-height: -fx-min-height;
411-
-fx-min-width: 20;
481+
-fx-min-width: 20px;
412482
}
413483

414484
/* transparent list view */
415485

416486
.transparent-list-view {
417487
-fx-background-color: transparent;
418-
-fx-background-insets: 0;
419-
-fx-padding: 0;
488+
-fx-background-insets: 0px;
489+
-fx-padding: 0px;
420490
-fx-effect: null;
421491
}
422492

@@ -535,10 +605,6 @@
535605
-fx-background-color: -fx-body-color;
536606
}
537607

538-
.material-param-control {
539-
-fx-alignment: center-left;
540-
}
541-
542608
.abstract-param-control {
543609
-fx-padding: 0 0 0 0;
544610
}

resources/ui/css/custom_ids.bss

-1.7 KB
Binary file not shown.

resources/ui/css/custom_ids.css

Lines changed: 20 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -26,17 +26,35 @@
2626
-fx-max-width: -fx-min-width;
2727
}
2828

29+
/*******************************************************************************
30+
* *
31+
* Main Split Pane *
32+
* *
33+
******************************************************************************/
34+
2935
#MainSplitPane {
3036
-fx-background-color: transparent;
3137
}
3238

39+
/*******************************************************************************
40+
* *
41+
* Global Left Tool Component *
42+
* *
43+
******************************************************************************/
44+
3345
#GlobalLeftToolComponent {
34-
-fx-min-width: 26;
46+
-fx-min-width: 28;
3547
-fx-tab-max-height: 18;
3648
}
3749

50+
/*******************************************************************************
51+
* *
52+
* Global Bottom Tool Component *
53+
* *
54+
******************************************************************************/
55+
3856
#GlobalBottomToolComponent {
39-
-fx-min-height: 26;
57+
-fx-min-height: 28;
4058
-fx-tab-max-height: 18;
4159
}
4260

@@ -68,39 +86,6 @@
6886
-fx-tab-max-height: 18;
6987
}
7088

71-
/*******************************************************************************
72-
* *
73-
* File Editor *
74-
* *
75-
******************************************************************************/
76-
77-
#FileEditorToolbar {
78-
-fx-background-color: -var-background-color;
79-
-fx-border-color: -var-border-color;
80-
-fx-border-width: 0px 0px 1px 0px;
81-
-fx-min-height: 30;
82-
-fx-pref-height: -fx-min-height;
83-
-fx-max-height: -fx-min-height;
84-
-fx-padding: 10, 0, 0, 0;
85-
-fx-alignment: center-left;
86-
}
87-
88-
#FileEditorEditorArea {
89-
}
90-
91-
#FileEditorMainSplitPane {
92-
-fx-background-color: transparent;
93-
}
94-
95-
#FileEditorToolSplitPane {
96-
-fx-background-color: transparent;
97-
-fx-orientation: vertical;
98-
}
99-
100-
#FileEditorToolComponent {
101-
-fx-min-width: 26;
102-
}
103-
10489
/*******************************************************************************
10590
* *
10691
* Text File Editor *
@@ -239,62 +224,12 @@
239224
* *
240225
******************************************************************************/
241226

242-
#MaterialFileEditorToolbarBox {
243-
-fx-min-height: 24;
244-
-fx-pref-height: -fx-min-height;
245-
-fx-max-height: -fx-min-height;
246-
-fx-min-width: 300;
247-
-fx-pref-width: -fx-min-width;
248-
-fx-max-width: -fx-min-width;
249-
}
250-
251-
#MaterialFileEditorToolbarSmallBox {
252-
-fx-min-height: 24;
253-
-fx-pref-height: -fx-min-height;
254-
-fx-max-height: -fx-min-height;
255-
-fx-min-width: 150;
256-
-fx-pref-width: -fx-min-width;
257-
-fx-max-width: -fx-min-width;
258-
}
259-
260-
#MaterialFileEditorPropertiesComponent {
261-
-fx-background-color: -var-background-color;
262-
-fx-alignment: top-left;
263-
-fx-padding: 0 5 0 4;
264-
}
265-
266-
#MaterialParamControlParamName {
267-
-fx-min-height: 24;
268-
-fx-pref-height: -fx-min-height;
269-
-fx-max-height: -fx-min-height;
270-
-fx-alignment: center-right;
271-
-fx-text-alignment: right;
272-
-fx-padding: 0 2 0 0;
273-
}
274-
275-
#MaterialParamControlButton {
276-
-fx-min-height: 20;
277-
-fx-pref-height: -fx-min-height;
278-
-fx-max-height: -fx-min-height;
279-
-fx-min-width: 20;
280-
-fx-pref-width: -fx-min-width;
281-
-fx-max-width: -fx-min-width;
282-
-fx-padding: 1;
283-
}
284-
285227
#MaterialParamControlSpinner {
286228
-fx-min-height: 24;
287229
-fx-pref-height: -fx-min-height;
288230
-fx-max-height: -fx-min-height;
289231
}
290232

291-
#MaterialParamControlColorPicker {
292-
-fx-alignment: center;
293-
-fx-min-height: 24;
294-
-fx-pref-height: -fx-min-height;
295-
-fx-max-height: -fx-min-height;
296-
}
297-
298233
#MaterialParamComboBox {
299234
-fx-min-height: 24;
300235
-fx-pref-height: -fx-min-height;
@@ -329,17 +264,6 @@
329264
-fx-max-width: -fx-min-width;
330265
}
331266

332-
#Texture2DMaterialParamControlPreview {
333-
-fx-min-height: 30;
334-
-fx-pref-height: -fx-min-height;
335-
-fx-max-height: -fx-min-height;
336-
-fx-min-width: 30;
337-
-fx-pref-width: -fx-min-width;
338-
-fx-max-width: -fx-min-width;
339-
-fx-border-color: -fx-color-panel-50;
340-
-fx-border-width: 1;
341-
}
342-
343267
#MaterialRenderStatePolyOffsetField {
344268
-fx-min-height: 22;
345269
-fx-pref-height: -fx-min-height;

resources/ui/css/dark-color.bss

74 Bytes
Binary file not shown.

resources/ui/css/dark-color.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,8 @@
4141
-var-tree-cell-selected-color: -fx-focus-color;
4242
-var-tree-cell-hover-color: derive(-var-background-color, 50%);
4343

44+
-var-slider-track-background-color: #2d303b;
45+
4446
-fx-shadow-panel: dropshadow(two-pass-box, rgba(0, 0, 0, 0.5), 10, 0.01, 1, 1);
4547
-fx-shadow-menu: dropshadow(two-pass-box, rgba(32, 34, 42, 0.5), 20, 0.01, 1, 1);
4648
-fx-shadow-control: dropshadow(three-pass-box, #1a1a1a, 4, 0.1, 0, 1);

0 commit comments

Comments
 (0)