1 /*
2 * Copyright (c) 2014, Oracle and/or its affiliates.
3 * All rights reserved. Use is subject to license terms.
4 *
5 * This file is available and licensed under the following license:
6 *
7 * Redistribution and use in source and binary forms, with or without
8 * modification, are permitted provided that the following conditions
9 * are met:
10 *
11 * - Redistributions of source code must retain the above copyright
12 * notice, this list of conditions and the following disclaimer.
13 * - Redistributions in binary form must reproduce the above copyright
14 * notice, this list of conditions and the following disclaimer in
15 * the documentation and/or other materials provided with the distribution.
16 * - Neither the name of Oracle Corporation nor the names of its
17 * contributors may be used to endorse or promote products derived
18 * from this software without specific prior written permission.
19 *
20 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
21 * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
22 * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
23 * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
24 * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
25 * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
26 * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
27 * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
28 * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
29 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
30 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
31 */
32
33 /*******************************************************************************
34 * *
35 * Preset colours for the theme *
36 * *
37 ******************************************************************************/
38
39 .theme-presets {
40 -sb-base: rgb(147, 147, 147);
41 -sb-base-dark: derive(-sb-base, -60%);
42
43 -sb-header-text: derive(-sb-base, -70%);
44 -sb-header-text-dimmed: derive(-sb-base, -45%);
45 -sb-header-detail: derive(-sb-base, -45%);
46 -sb-header-height: 32;
47
48 -sb-content-text: derive(-sb-base, 75%);
49 -sb-content-text-dimmed: derive(-sb-base, 25%);
50 -sb-content-detail: derive(-sb-base, 55%);
51 -sb-content-background: derive(-sb-base, -32%);
52
53 -sb-grad-hi: derive(-sb-base, 65%);
54 -sb-sharp-edge-hi: derive(-sb-base, 20%);
55 -sb-flat: -sb-base;
56 -sb-sharp-edge-lo: derive(-sb-base, -40%);
57
58 -sb-text-control-inner: rgb(90, 90, 90);
59 -sb-text-control-outer: rgb(135, 135, 135);
60
61 -sb-scrollbar-thumb: -sb-flat;
62
63 -sb-focus-color: rgb(105, 255, 205);
64 -sb-focus-inner-background: derive(-sb-flat, 10%);
65 -sb-selected-bar-color: rgb(75, 155, 210);
66 -sb-selected-bar-unfocused-color: derive(-sb-content-background, 20%);
67
68 -sb-line-art: derive(-sb-base, 40%);
69 -sb-line-art-accent: rgb(105, 255, 205);
70
71 -sb-css-winner-color: rgb(125, 125, 85);
72 -sb-warning-panel: rgb(230, 225, 140);
73 -sb-warning-panel-text: derive(-sb-base, -50%);
74 -sb-warning-panel-text-dimmed: derive(-sb-base, -20%);
75 -sb-message-panel: rgb(185, 220, 240);
76 }
77
78 /*******************************************************************************
79 * *
80 * Common UI Styling *
81 * *
82 ******************************************************************************/
83
84 /*******************************************************************************
85 * Common UI Styling - Menus *
86 ******************************************************************************/
87
88 .theme-presets .context-menu {
89 -fx-background-color:
90 derive(-sb-sharp-edge-lo, -30%), derive(-sb-content-background, -20%);
91 -fx-background-insets: 0, 1;
92 -fx-background-radius: 0;
93 }
94 .theme-presets .context-menu .separator:horizontal .line {
95 -fx-border-color:
96 derive(-sb-text-control-outer, -20%), derive(-sb-content-background, -20%);
97 -fx-border-insets: 0, 1 0 0 0;
98 }
99 .theme-presets .context-menu .menu-item > .label {
100 -fx-text-fill: -sb-content-text;
101 }
102
103 .theme-presets .custom-menu-item {
104 -fx-padding: 4 8 4 8;
105 }
106 .theme-presets .custom-menu-item:focused {
107 -fx-background: derive(-sb-content-background, -20%);
108 -fx-background-color: -fx-background;
109 }
110
111 .theme-presets .menu > .right-container > .arrow {
112 -fx-background-color: -sb-content-detail;
113 }
114
115 .theme-presets .radio-menu-item:checked > .left-container > .radio {
116 -fx-background-color: -sb-content-detail;
117 }
118
119 /*******************************************************************************
120 * Common UI Styling - Cog Button *
121 ******************************************************************************/
122
123 .theme-presets .cog-shape {
124 -fx-shape: "M15.385,6.769h-0.738c-0.338,0-0.697-0.265-0.797-0.587L13.424,5.15c-0.158-0.298-0.094-0.74,0.145-0.978l0.523-0.523
125 c0.242-0.239,0.242-0.632,0-0.872l-0.869-0.868c-0.24-0.241-0.633-0.241-0.873,0l-0.521,0.523
126 c-0.238,0.239-0.682,0.304-0.979,0.144L9.818,2.152C9.496,2.052,9.23,1.692,9.23,1.354V0.615C9.23,0.277,8.953,0,8.615,0H7.386
127 C7.047,0,6.77,0.277,6.77,0.615v0.739c0,0.338-0.265,0.697-0.586,0.798L5.152,2.576c-0.299,0.16-0.739,0.097-0.978-0.144
128 L3.65,1.909c-0.24-0.241-0.631-0.241-0.872,0L1.91,2.777c-0.241,0.24-0.241,0.633,0,0.871l0.522,0.524
129 C2.672,4.41,2.738,4.853,2.578,5.15L2.152,6.183C2.052,6.504,1.692,6.77,1.355,6.77l-0.74-0.001C0.277,6.769,0,7.046,0,7.385v1.23
130 C0,8.951,0.277,9.23,0.615,9.23h0.74c0.337,0,0.695,0.266,0.797,0.588l0.426,1.029c0.158,0.299,0.094,0.742-0.146,0.979L1.91,12.35
131 c-0.241,0.24-0.241,0.633,0,0.873l0.868,0.869c0.241,0.24,0.632,0.24,0.872,0l0.523-0.523c0.237-0.238,0.679-0.305,0.977-0.143
132 l1.033,0.424c0.321,0.1,0.586,0.459,0.586,0.797v0.738C6.77,15.723,7.047,16,7.386,16h1.229c0.338,0,0.615-0.277,0.615-0.615
133 v-0.738c0-0.338,0.266-0.697,0.588-0.797l1.031-0.424c0.301-0.162,0.74-0.096,0.98,0.143l0.52,0.523c0.24,0.24,0.633,0.24,0.873,0
134 l0.869-0.869c0.242-0.24,0.242-0.633,0-0.873l-0.523-0.523c-0.238-0.236-0.303-0.68-0.145-0.979l0.426-1.029
135 c0.1-0.322,0.459-0.588,0.797-0.588h0.738C15.725,9.23,16,8.953,16,8.615v-1.23C16,7.046,15.725,6.769,15.385,6.769z M11.582,7.998
136 c0,1.979-1.602,3.58-3.578,3.58c-1.979,0-3.582-1.602-3.582-3.58c0-1.978,1.603-3.58,3.582-3.58
137 C9.98,4.418,11.582,6.021,11.582,7.998z";
138 -fx-background-color: -sb-header-detail;
139 -fx-min-width: 8;
140 -fx-max-width: 8;
141 -fx-min-height: 8;
142 -fx-max-height: 8;
143 }
144 .theme-presets .property-sheet .cog-shape {
145 -fx-background-color: -sb-content-detail;
146 }
147
148 /*******************************************************************************
149 * Common UI Styling - Accordion and TitledPane and search area shadows *
150 ******************************************************************************/
151
152 .theme-presets .accordion > .titled-pane > .title {
153 -fx-background-color:
154 derive(-sb-content-background, -35%), -sb-sharp-edge-lo, -sb-sharp-edge-hi, -sb-flat;
155 -fx-background-insets: 0 0 -1 0, 0, 1 0 0 0, 2 0 0 0;
156 -fx-padding: 0.385em 0.692em 0.231em 0.692em;
157 -fx-font-size: 0.875em;
158 -fx-alignment: center-right;
159 -fx-effect: dropshadow( two-pass-box, rgba(0, 0, 0, 0.2), 5, 0.0, 0, 1 );
160 }
161 .theme-presets .accordion > .titled-pane > .title > .text {
162 -fx-fill: -sb-header-text;
163 }
164 .theme-presets .accordion > .first-titled-pane > .title {
165 -fx-background-insets: 0 0 -1 0, 0, 1 0 1 0, 2 0 0 0;
166 }
167 .theme-presets .accordion > .titled-pane > .title > .arrow-button {
168 -fx-padding: -0.154em 0.583em 0.0em 0.0em;
169 }
170 .theme-presets .accordion > .titled-pane > .title > .arrow-button > .arrow {
171 -fx-background-color: -sb-header-detail;
172 -fx-padding: 0.154em 0.231em 0.231em 0.231em; /* 2 3 3 3 */
173 }
174 .theme-presets .pane-shadow {
175 -fx-background-color: derive(-sb-content-background, -35%);
176 -fx-effect: dropshadow( two-pass-box, rgba(0, 0, 0, 0.6), 5, 0.0, 0, 0 );
177 }
178
179 /*******************************************************************************
180 * Common UI Styling - Panel Backgrounds *
181 ******************************************************************************/
182
183 .theme-presets .property-sheet,
184 .theme-presets .property-sheet > .viewport,
185 .theme-presets .SBKIT-library-panel,
186 .theme-presets .SBKIT-library-panel .accordion > .titled-pane > .content,
187 .theme-presets .SBKIT-hierarchy-panel .tree-view {
188 -fx-border-color: null;
189 -fx-border-width: 0;
190 -fx-background-color: -sb-content-background;
191 -fx-background-insets: 0;
192 -fx-padding: 0;
193 }
194
195 .theme-presets .titled-pane > .content {
196 -fx-border-width: 0;
197 -fx-border-insets: 0;
198 }
199
200 /*******************************************************************************
201 * Common UI Styling - Split Panes *
202 ******************************************************************************/
203
204 .theme-presets .split-pane {
205 -fx-background-color: -sb-base-dark;
206 -fx-background-insets: 0;
207 -fx-padding: 0;
208 }
209 .theme-presets .split-pane > .split-pane-divider {
210 -fx-background-color: -sb-base-dark;
211 -fx-padding: 0 0.5 0 0;
212 }
213 .theme-presets .split-pane:horizontal .split-pane-divider .horizontal-grabber,
214 .theme-presets .split-pane:vertical .split-pane-divider .vertical-grabber {
215 -fx-padding: 3;
216 -fx-shape: "";
217 }
218
219 /*******************************************************************************
220 * Common UI Styling - ScrollBars *
221 ******************************************************************************/
222
223 .theme-presets .scroll-bar .track-background {
224 -fx-background-color: transparent;
225 }
226 .theme-presets .scroll-bar:vertical > .decrement-button,
227 .theme-presets .scroll-bar:vertical > .increment-button {
228 -fx-padding: 0.077em 0.769em 0.077em 0.615em;
229 }
230 .theme-presets .scroll-bar:horizontal > .decrement-button,
231 .theme-presets .scroll-bar:horizontal > .increment-button {
232 -fx-padding: 0.692em 0.077em 0.692em 0.077em;
233 }
234 .theme-presets .scroll-bar .increment-arrow,
235 .theme-presets .scroll-bar .decrement-arrow {
236 -fx-padding: 0;
237 }
238 .theme-presets .scroll-bar:vertical {
239 -fx-background-color: derive(-sb-sharp-edge-lo, -20%), derive(-sb-content-background, -8%);
240 -fx-background-insets: 0 0 0 0, 0 0 0 1;
241 }
242 .theme-presets .scroll-bar:horizontal {
243 -fx-background-color: derive(-sb-sharp-edge-lo, -20%), derive(-sb-content-background, -8%);
244 -fx-background-insets: 0, 1 0 0 0;
245 }
246 .theme-presets .scroll-bar .thumb {
247 -fx-background-color: -sb-text-control-outer, derive(-sb-content-background, 10%);
248 -fx-background-radius: 0;
249 }
250 .theme-presets .scroll-bar:vertical .thumb {
251 -fx-background-insets: 3 4 3 4, 4 5 4 5;
252 }
253 .theme-presets .scroll-bar:horizontal .thumb {
254 -fx-background-insets: 4 3 4 3, 5 4 5 4;
255 }
256 .theme-presets .scroll-pane .corner,
257 .theme-presets .tree-view .virtual-flow .corner {
258 -fx-background-color: -sb-sharp-edge-lo, -sb-content-background;
259 -fx-background-insets: 0 -1 -1 0, 1 -1 -1 1;
260 }
261
262 .theme-presets .text-area .scroll-pane .scroll-bar:horizontal {
263 -fx-background-insets: 0 1 1 1, 1 1 1 1;
264 }
265 .theme-presets .text-area .scroll-pane .scroll-bar:vertical {
266 -fx-background-insets: 1 1 1 0, 1 1 1 1;
267 }
268 .theme-presets .text-area .scroll-pane .corner {
269 -fx-background-insets: 0 1 1 0, 1 1 1 1;
270 }
271
272 /*******************************************************************************
273 * *
274 * UI Panels *
275 * *
276 ******************************************************************************/
277
278 /*******************************************************************************
279 * *
280 * Library panel *
281 * *
282 ******************************************************************************/
283
284 .theme-presets.SBKIT-library-panel .list-view {
285 -fx-background-color: transparent;
286 -fx-padding: 0;
287 }
288 .theme-presets.SBKIT-library-panel .list-view .list-cell {
289 -fx-background-color: transparent;
290 -fx-cell-size: 1.8em;
291 -fx-background-insets: 2 0 -2 0;
292 -fx-padding: 2 0 0 4;
293 }
294 .theme-presets.SBKIT-library-panel .list-view .list-cell:filled:hover {
295 -fx-background-color: null; /* no hover effect on list view */
296 }
297 .theme-presets.SBKIT-library-panel .list-view:focused .list-cell:filled:selected {
298 -fx-background-color: -sb-selected-bar-color;
299 }
300 .theme-presets.SBKIT-library-panel .list-view .list-cell:filled:selected {
301 /* When the ListView is not focused there is no need to highlight
302 the selected item */
303 -fx-background-color: null;
304 }
305 .theme-presets.SBKIT-library-panel .list-view .scroll-bar {
306 /* Cursor may dynamically change when working in library / hierarchy.
307 Set back the cursor to its default. */
308 -fx-cursor: default;
309 }
310
311 /* ListCell graphic is an HBox */
312 .theme-presets.SBKIT-library-panel .list-cell-graphic {
313 -fx-alignment: center-left;
314 -fx-padding: 0 2 0 2;
315 -fx-spacing: 4;
316 }
317
318 .theme-presets.SBKIT-library-panel .library-no-results-label {
319 -fx-text-fill: -sb-content-text-dimmed;
320 -fx-font-size: 0.875em;
321 -fx-padding: 6 0 0 10;
322 }
323
324 .theme-presets.SBKIT-library-panel .library-section-label {
325 -fx-text-fill: derive(-sb-content-text, 10%);
326 -fx-font-size: 0.875em;
327 -fx-background-color:
328 linear-gradient(to right, derive(-sb-sharp-edge-lo, -20%), -sb-sharp-edge-lo),
329 linear-gradient(to right, derive(-sb-content-background, -10%) 0%, -sb-content-background 70%);
330 -fx-background-insets: -4 -2 -4 -12, -3 -2 -3 -12;
331 }
332
333 .theme-presets.SBKIT-library-panel .library-classname-label {
334 -fx-text-fill: -sb-content-text;
335 }
336
337 .theme-presets.SBKIT-library-panel .library-qualifier-label {
338 -fx-text-fill: -sb-content-text-dimmed;
339 }
340
341 /*******************************************************************************
342 * Library Panel - Jar import dialog *
343 ******************************************************************************/
344
345 .theme-presets .jar-import-preview-label {
346 -fx-text-fill: -sb-content-text-dimmed;
347 -fx-font-size : 0.875em;
348 }
349
350 .theme-presets .jar-import-preview {
351 -fx-background-color: azure;
352 }
353
354 .theme-presets .jar-import-num-of-items-label {
355 -fx-font-size : 0.875em;
356 }
357
358 .theme-presets .jar-import-class-name-label {
359 -fx-text-fill: -sb-content-text-dimmed;
360 -fx-font-size : 0.875em;
361 }
362
363 /*******************************************************************************
364 * *
365 * Hierarchy Panel *
366 * *
367 ******************************************************************************/
368
369 /*******************************************************************************
370 * Hierarchy Panel - TreeView / TreeTableView *
371 ******************************************************************************/
372
373 .theme-presets.SBKIT-hierarchy-panel .tree-cell {
374 -fx-background-color: transparent;
375 -fx-padding: 2 0 2 0;
376 -fx-background-insets: 0 0 0 0;
377 }
378 .theme-presets.SBKIT-hierarchy-panel .tree-cell .label {
379 -fx-text-fill: -sb-content-text;
380 }
381 .theme-presets.SBKIT-hierarchy-panel .hierarchy-first-cell {
382 -fx-padding: 4 0 0 1;
383 -fx-background-insets: 4 0 0 0;
384 }
385
386 /* Selected rows */
387 .theme-presets.SBKIT-hierarchy-panel .tree-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-cell:filled:selected,
388 .theme-presets.SBKIT-hierarchy-panel .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell:filled:selected,
389 .theme-presets.SBKIT-hierarchy-panel .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell .tree-table-cell:selected {
390 -fx-background-color: -sb-selected-bar-color;
391 }
392 /* Selected rows when control is not focused */
393 .theme-presets.SBKIT-hierarchy-panel .tree-cell:filled:selected,
394 .theme-presets.SBKIT-hierarchy-panel .tree-table-row-cell:filled:selected,
395 .theme-presets.SBKIT-hierarchy-panel .tree-table-row-cell:filled > .tree-table-cell:selected {
396 -fx-background-color: -sb-selected-bar-unfocused-color;
397 }
398
399 /*******************************************************************************
400 * Hierarchy Panel - Graphic Icon and Disclosure Arrows *
401 ******************************************************************************/
402
403 /* TreeCell graphic is a HBox */
404 .theme-presets.SBKIT-hierarchy-panel .tree-cell-graphic {
405 -fx-alignment: center-left;
406 -fx-padding: 0 2 0 0;
407 -fx-spacing: 2;
408 }
409
410 .theme-presets.SBKIT-hierarchy-panel .tree-view .tree-cell .tree-disclosure-node {
411 -fx-padding: 7 6 6 9;
412 -fx-background-color: derive(-sb-base-dark, -10%), derive(-sb-sharp-edge-hi, 10%);
413 -fx-background-insets: 3 2 2 5, 4 3 3 6;
414 -fx-background-radius: 10;
415 -fx-cursor: hand;
416 }
417 .theme-presets.SBKIT-hierarchy-panel .tree-view .tree-cell:expanded .tree-disclosure-node {
418 -fx-background-color: derive(-sb-sharp-edge-hi, -20%), -sb-content-background;
419 }
420 .theme-presets.SBKIT-hierarchy-panel .tree-view .tree-cell .tree-disclosure-node .arrow {
421 -fx-shape: "M0,3h3V0h1v3h3v1H4v3H3l0-3H0V3z";
422 -fx-padding: 0.2em;
423 -fx-background-color: -sb-header-text;
424 }
425 .theme-presets.SBKIT-hierarchy-panel .tree-view .tree-cell:expanded .tree-disclosure-node .arrow {
426 -fx-shape: "M0,3h7v1H0V3z M0,0L0,0L0,0L0,0L0,0z M7,7L7,7L7,7L7,7L7,7z";
427 -fx-padding: 0.2em;
428 -fx-background-color: -sb-content-text;
429 -fx-rotate: 0;
430 }
431
432 /*******************************************************************************
433 * Hierarchy Panel - Place holder Labels *
434 ******************************************************************************/
435
436 .theme-presets.SBKIT-hierarchy-panel .hierarchy-place-holder-label {
437 -fx-label-padding: 0 3 0 0;
438 }
439
440 /*******************************************************************************
441 * Hierarchy Panel - Read/Write labels and Inline editing *
442 ******************************************************************************/
443
444 /* editable label on node in hierarchy (info / node id / fx:id) */
445 .theme-presets.SBKIT-hierarchy-panel .hierarchy-readwrite-label {
446 -fx-border-color: transparent;
447 -fx-border-insets: 0 1 0 0;
448 }
449 .theme-presets.SBKIT-hierarchy-panel .hierarchy-readwrite-label:hover {
450 -fx-border-color: -sb-sharp-edge-hi;
451 -fx-cursor: text;
452 }
453 .theme-presets.SBKIT-hierarchy-panel .hierarchy-readwrite-label .text {
454 -fx-fill: -sb-content-text-dimmed;
455 }
456 .theme-presets.SBKIT-hierarchy-panel .hierarchy-readwrite-label:hover .text {
457 -fx-fill: -sb-content-text;
458 }
459
460 .theme-presets.SBKIT-hierarchy-panel .inline-editor, .inline-editor:focused {
461 -fx-background-color: white;
462 -fx-background-insets: 0;
463 -fx-border-color: rgb(25, 164, 255);
464 -fx-text-fill: black;
465 -fx-padding: 0 1 0 1;
466 }
467
468 /*******************************************************************************
469 * Hierarchy Panel - Empty FXML 'drag items here' prompt *
470 ******************************************************************************/
471
472 .theme-presets.SBKIT-hierarchy-panel .hierarchy-prompt-label {
473 -fx-font-size: 1.231em; /* 16px (base pixel size of 13px) */
474 -fx-text-fill: derive(-sb-content-text-dimmed, 20%);
475 -fx-text-alignment: center;
476 -fx-alignment: center;
477 -fx-wrap-text: true;
478 -fx-label-padding: 16;
479 -fx-background-color: transparent;
480 -fx-border-color: -sb-sharp-edge-hi;
481 -fx-border-width: 1;
482 -fx-border-style: segments(1px, 2px);
483 }
484
485 /*******************************************************************************
486 * *
487 * Content Panel *
488 * *
489 ******************************************************************************/
490
491 .theme-presets.SBKIT-content-panel .selection-handles {
492 -fx-fill: white;
493 -fx-stroke: blue;
494 -fx-stroke-width: 1;
495 -fx-stroke-type: inside;
496 }
497
498 .theme-presets.SBKIT-content-panel .selection-handles-dim {
499 -fx-fill: white;
500 -fx-stroke: gray;
501 -fx-stroke-width: 1;
502 -fx-stroke-type: inside;
503 }
504
505 .theme-presets.SBKIT-content-panel .selection-rect {
506 -fx-stroke: null;
507 -fx-fill: rgba(0, 0, 0, 0.05);
508 }
509
510 .theme-presets.SBKIT-content-panel .selection-wire {
511 -fx-stroke: rgb(25, 164, 255);
512 -fx-stroke-width: 1;
513 -fx-fill: null;
514 }
515
516 .theme-presets.SBKIT-content-panel .selection-gap {
517 -fx-stroke: null;
518 -fx-fill: lightgrey;
519 -fx-opacity: 0.5;
520 }
521
522 .theme-presets.SBKIT-content-panel .parent-ring {
523 /* -fx-stroke is setup from user preferences */
524 -fx-stroke-width: 7;
525 -fx-stroke-type: outside;
526 -fx-opacity: 0.5;
527 -fx-fill: null;
528 }
529
530 .theme-presets.SBKIT-content-panel .target-ring {
531 /* -fx-stroke is setup from user preferences */
532 -fx-stroke-width: 7;
533 -fx-stroke-type: inside;
534 -fx-opacity: 0.9;
535 -fx-fill: null;
536 }
537
538 .theme-presets.SBKIT-content-panel .target-crack {
539 -fx-stroke-width: 5;
540 -fx-stroke-type: centered;
541 -fx-stroke-line-cap: butt;
542 -fx-stroke: black;
543 -fx-opacity: 0.5;
544 -fx-fill: null;
545 }
546
547 .theme-presets.SBKIT-content-panel .resize-rudder {
548 -fx-stroke-width: 1;
549 -fx-opacity: 0.3;
550 -fx-stroke-dash-array: 8 8;
551 }
552
553 /*******************************************************************************
554 * Content Panel - FXML 'drag items here' prompts *
555 ******************************************************************************/
556
557 .theme-presets.SBKIT-content-panel .stage-prompt {
558 -fx-font-size: 1.231em; /* 16px (base pixel size of 13px) */
559 -fx-text-fill: derive(-sb-content-text-dimmed, 10%);
560 -fx-text-alignment: center;
561 -fx-alignment: center;
562 -fx-wrap-text: true;
563 -fx-label-padding: 16;
564 -fx-background-color: transparent;
565 -fx-border-color: -sb-sharp-edge-hi;
566 -fx-border-width: 1;
567 -fx-border-style: segments(1px, 2px);
568 }
569
570 .theme-presets.SBKIT-content-panel .stage-prompt-default {
571 -fx-font-size: 1.231em; /* 16px (base pixel size of 13px) */
572 -fx-text-fill: -sb-content-text;
573 -fx-text-alignment: center;
574 -fx-alignment: center;
575 -fx-wrap-text: true;
576 -fx-label-padding: 16;
577 -fx-background-color: white;
578 }
579
580 /*******************************************************************************
581 * Content Panel - GridPane Chrome #0 : common properties *
582 ******************************************************************************/
583
584 .theme-presets.SBKIT-content-panel .tray {
585 -fx-border-color: rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0.5);
586 -fx-border-insets: 0, 1, 2;
587 -fx-border-radius: 5 5 0 0, 4 4 0 0, 3 3 0 0;
588 -fx-background-color: #bbddff; /* Can be overwritten by user preferences */
589 -fx-background-radius: 2 2 0 0;
590 -fx-background-insets: 3;
591 -fx-alignment: center;
592 }
593
594 .theme-presets.SBKIT-content-panel .tray.south {
595 -fx-border-radius: 0 0 5 5, 0 0 4 4, 0 0 3 3;
596 -fx-background-radius: 0 0 2 2;
597 }
598
599 .theme-presets.SBKIT-content-panel .tray.text {
600 -fx-text-fill: black;
601 -fx-text-overrun: leading-word-ellipsis;
602 -fx-font-size: 0.769em; /* 10px (base pixel size of 13px) */
603 }
604
605 .theme-presets.SBKIT-content-panel .tray.west .text {
606 -fx-rotate: +90;
607 }
608
609 .theme-presets.SBKIT-content-panel .tray.east .text {
610 -fx-rotate: -90;
611 }
612
613 /*******************************************************************************
614 * Content Panel - GridPane Chrome #1 : trays and cells of selected gridpane *
615 ******************************************************************************/
616
617 .theme-presets.SBKIT-content-panel .gap {
618 -fx-stroke: transparent;
619 -fx-fill: rgba(0,0,0,0.2);
620 }
621
622 .theme-presets.SBKIT-content-panel .gap.selected {
623 -fx-fill: rgba(0,0,0,0.4);
624 }
625
626 .theme-presets.SBKIT-content-panel .gap.hilit {
627 -fx-stroke: rgba(0,0,0,0.4);
628 -fx-stroke-line-cap: butt;
629 /* -fx-stroke-width is setup programmatically */
630 }
631
632 .theme-presets.SBKIT-content-panel .gap.empty {
633 -fx-stroke: rgba(0,0,0,0.4);
634 -fx-stroke-line-cap: butt;
635 -fx-stroke-dash-array: 3 3;
636 }
637
638 .theme-presets.SBKIT-content-panel .tray.selected {
639 -fx-border-color: rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 1), rgba(255, 255, 255, 0.5);
640 -fx-background-color: yellow;
641 }
642
643 .theme-presets.SBKIT-content-panel .tray.selected .text {
644 -fx-text-fill: rgba(0,0,0,0.8);
645 }
646
647 /*******************************************************************************
648 * Content Panel - BorderPane *
649 ******************************************************************************/
650
651 .theme-presets.SBKIT-content-panel .target-ring.BorderPane {
652 -fx-alignment: CENTER;
653 -fx-border-width: 1;
654 -fx-border-color: rgba(0,0,0,0.1);
655 -fx-background-color: rgba(0,0,0,0.1);
656 -fx-text-fill: grey;
657 }
658
659 .theme-presets.SBKIT-content-panel .target-ring.selected.BorderPane {
660 -fx-alignment: CENTER;
661 -fx-border-width: 1;
662 -fx-border-color: rgba(0,0,0,0.1);
663 -fx-background-color: rgba(0,0,0,0.4);
664 -fx-text-fill: grey;
665 }
666
667 /*******************************************************************************
668 * Content Panel - Marquee Chrome *
669 ******************************************************************************/
670
671 .theme-presets.SBKIT-content-panel .marquee {
672 /* -fx-fill: rgba(178, 178, 229, 0.2);*/
673 -fx-fill: rgba(150, 150, 150, 0.2);
674 -fx-stroke: rgba(0, 0, 0, 0.3);
675 -fx-stroke-type: inside;
676 }
677
678 /*******************************************************************************
679 * Content Panel - Resize Shadow *
680 ******************************************************************************/
681
682 .theme-presets.SBKIT-content-panel .resize-shadow {
683 -fx-background-color: rgba(255, 255, 0.0, 0.5);
684 -fx-border-width: 1;
685 -fx-border-style: dotted;
686 -fx-border-color: black;
687 }
688
689 /*******************************************************************************
690 * Content Panel - Resize Shadow *
691 ******************************************************************************/
692
693 .theme-presets.SBKIT-content-panel .css-pick-chrome {
694 -fx-background-color: rgba(0.0, 255, 0.0, 0.5);
695 -fx-border-width: 1;
696 -fx-border-style: dotted;
697 -fx-border-color: black;
698 }
699
700 /*******************************************************************************
701 * Content Panel - Outline Mode *
702 ******************************************************************************/
703
704 .theme-presets.SBKIT-content-panel .outline-ring {
705 -fx-stroke: rgba(0,0,0,0.2);
706 -fx-stroke-type: inside;
707 -fx-fill: rgba(0,0,0,0.01);
708 }
709
710
711 /*******************************************************************************
712 * *
713 * Inspector Panel *
714 * *
715 ******************************************************************************/
716
717 .theme-presets .SBKIT-inspector-panel .secondary-section-title {
718 -fx-text-fill: -sb-header-text-dimmed;
719 }
720
721 /* Specific css for the Inspector SplitPane */
722 .theme-presets.SBKIT-inspector-panel > .split-pane-divider {
723 -fx-background-color: transparent;
724 -fx-background-insets: -1 0 -3 0;
725 -fx-border-width: 0;
726 -fx-padding: 0;
727 }
728
729 /*******************************************************************************
730 * *
731 * Property Sheet Panels (Inspector, Controller) *
732 * *
733 ******************************************************************************/
734
735 /*******************************************************************************
736 * Property Sheet Panels - General Appearance *
737 ******************************************************************************/
738
739 .property-sheet {
740 -fx-font-size: 0.875em;
741 }
742
743 .theme-presets.property-sheet .label {
744 -fx-text-fill: -sb-content-text;
745 -fx-padding: 4 0 3 0;
746 }
747
748 .theme-presets.property-sheet .button,
749 .theme-presets.property-sheet .toggle-button {
750 -fx-text-fill: -sb-content-text;
751 }
752
753 .theme-presets.property-sheet .slider > .track {
754 -fx-background-color: -sb-text-control-outer, -sb-text-control-inner;
755 -fx-background-insets: -2 -5 -3 -5, -1 -4 -2 -4;
756 -fx-background-radius: 0;
757 }
758 .theme-presets.property-sheet .slider:vertical > .track {
759 -fx-background-insets: -5 -3 -5 -2, -4 -2 -4 -1;
760 }
761 .theme-presets.property-sheet .slider > .thumb {
762 -fx-background-color: -sb-content-detail, derive(-sb-content-background, 10%);
763 -fx-background-insets: 2, 3;
764 -fx-background-radius: 0;
765 -fx-effect: null;
766 }
767
768 .theme-presets.property-sheet .check-box {
769 -fx-text-fill: -sb-content-text;
770 }
771 .theme-presets.property-sheet .check-box .box {
772 -fx-background-color: -sb-text-control-outer, -sb-text-control-inner;
773 -fx-background-insets: 0, 1;
774 -fx-background-radius: 0;
775 -fx-padding: 0.231em 0.231em 0.154em 0.154em;
776 }
777 .theme-presets.property-sheet .check-box:selected .box {
778 -fx-background-radius: 0;
779 -fx-padding: 0.308em;
780 }
781 .theme-presets.property-sheet .check-box:selected > .box > .mark,
782 .theme-presets.property-sheet .check-box:indeterminate > .box > .mark {
783 -fx-background-color: -sb-content-text;
784 -fx-background-insets: 0;
785 -fx-padding: 0.308em 0.308em 0.385em 0.385em;
786 }
787
788 .theme-presets.property-sheet .hyperlink,
789 .theme-presets.property-sheet .hyperlink:visited {
790 -fx-text-fill: -sb-content-text;
791 -fx-padding: 3 4 2 0;
792 -fx-underline: false;
793 }
794 .theme-presets.property-sheet .hyperlink:hover,
795 .theme-presets.property-sheet .hyperlink:visited:hover {
796 -fx-underline: true;
797 }
798
799 .theme-presets.property-sheet .button,
800 .theme-presets.property-sheet .choice-box,
801 .theme-presets.property-sheet .menu-button,
802 .theme-presets.property-sheet .toggle-button {
803 -fx-background-color: -sb-text-control-outer, derive(-sb-content-background, 10%);
804 -fx-background-insets: 0, 1;
805 -fx-padding: 4 6 3 6;
806 -fx-background-radius: 0;
807 }
808
809 .theme-presets.property-sheet .text-field {
810 -fx-background-color: -sb-text-control-outer, -sb-text-control-inner;
811 -fx-background-insets: 0, 1;
812 -fx-text-fill: -sb-content-text;
813 -fx-padding: 4 5 3 5;
814 -fx-background-radius: 0;
815 }
816
817 .theme-presets.property-sheet .text-area {
818 -fx-background-color: -sb-text-control-outer, -sb-text-control-inner;
819 -fx-background-insets: 0, 1;
820 -fx-text-fill: -sb-content-text;
821 -fx-background-radius: 0;
822 }
823 .theme-presets.property-sheet .text-area .content {
824 -fx-background-color: -sb-text-control-inner;
825 -fx-background-radius: 0;
826 -fx-padding: 3 5 3 5;
827 }
828
829 .theme-presets.property-sheet .choice-box > .open-button,
830 .theme-presets.property-sheet .menu-button > .arrow-button {
831 -fx-padding: 2 0 2 0;
832 }
833 .theme-presets.property-sheet .choice-box > .label,
834 .theme-presets.property-sheet .menu-button > .label {
835 -fx-padding: 0 4 0 0;
836 }
837 .theme-presets.property-sheet .choice-box > .open-button > .arrow,
838 .theme-presets.property-sheet .menu-button > .arrow-button > .arrow {
839 -fx-background-color: -sb-content-detail;
840 -fx-background-insets: 0;
841 -fx-padding: 0.154em 0.308em 0.154em 0.231em; /* 2 4 2 3 */
842 }
843
844 /*.theme-presets .property-sheet .table-view .column-header .label {
845 -fx-text-fill: -sb-content-text;
846 -fx-font-size: 0.875em;
847 -fx-font-weight: normal;
848 -fx-alignment: CENTER_LEFT;
849 -fx-padding: 0 4 0 4;
850 }
851 .theme-presets .property-sheet .table-view > .virtual-flow > .clipped-container > .sheet > .table-row-cell .table-cell {
852 -fx-padding: 4 5 2 5;
853 }
854 .theme-presets .property-sheet .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell:filled:selected,
855 .theme-presets .property-sheet .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell .table-cell:selected {
856 -fx-background: -sb-selected-bar-color;
857 -fx-table-cell-border-color: -sb-selected-bar-color;
858 }*/
859
860 .theme-presets.property-sheet .small-label {
861 -fx-font-size: 0.750em; /* 9 */
862 -fx-text-fill: -sb-content-text-dimmed;
863 -fx-padding: 0;
864 }
865
866 .inspector-message .text {
867 /* Used for 'No Selection' and 'No Results' messages */
868 -fx-fill: -sb-content-text-dimmed;
869 }
870
871 .theme-presets.property-sheet .cog-menubutton {
872 -fx-background-color: -sb-content-background;
873 -fx-background-radius: 0;
874 -fx-padding: 4 0 3 1;
875 -fx-graphic-text-gap: 0;
876 -fx-min-width: 10;
877 -fx-max-width: 10;
878 -fx-min-height: 10;
879 }
880 .theme-presets.property-sheet .cog-menubutton:hover {
881 -fx-background-color: derive(-sb-content-background, -10%), -sb-content-background;
882 -fx-background-insets: 0, 1;
883 }
884 .theme-presets.property-sheet .cog-menubutton:focused {
885 -fx-background-color: -fx-focus-color, -fx-background;
886 }
887 .theme-presets.property-sheet .cog-menubutton > .arrow-button {
888 visibility: hidden;
889 -fx-padding: 0;
890 }
891 .theme-presets.property-sheet .cog-menubutton > .arrow {
892 -fx-shape: null;
893 -fx-padding: 0;
894 }
895
896 /*******************************************************************************
897 * Property Sheet Panels - General Appearance - Focused States *
898 ******************************************************************************/
899
900 .theme-presets.property-sheet .button:focused,
901 .theme-presets.property-sheet .choice-box:focused,
902 .theme-presets.property-sheet .menu-button:focused,
903 .theme-presets.property-sheet .slider:focused > .thumb,
904 .theme-presets.property-sheet .toggle-button:focused {
905 -fx-background-color: -sb-focus-color, derive(-sb-content-background, 10%);
906 }
907 .theme-presets.property-sheet .check-box:focused .box,
908 .theme-presets.property-sheet .text-field:focused,
909 .theme-presets.property-sheet .text-area:focused {
910 -fx-background-color: -sb-focus-color, -sb-text-control-inner;
911 }
912
913 /*******************************************************************************
914 * Property Sheet Panels - CSS Override property decoration *
915 ******************************************************************************/
916
917 .theme-presets.property-sheet .css-override {
918 -fx-background-color: -sb-css-winner-color;
919 -fx-border-color: derive(-sb-sharp-edge-lo, 0%);
920 -fx-border-style: dotted;
921 }
922 .theme-presets.property-sheet .css-override > .hyperlink {
923 -fx-padding: 0;
924 }
925
926 /*******************************************************************************
927 * Property Sheet Panels - Sub Section Titles *
928 ******************************************************************************/
929
930 .sub-section-background {
931 -fx-background-color:
932 linear-gradient(to left, derive(-sb-sharp-edge-lo, -20%), -sb-sharp-edge-lo),
933 linear-gradient(to left, derive(-sb-content-background, -10%) 0%, -sb-content-background 70%);
934 -fx-background-insets: 7 -1 8 -10, 8 -1 9 -10;
935 -fx-padding: 8 10 8 0;
936 }
937
938 /*******************************************************************************
939 * Property Sheet Panels - Insets Editor *
940 ******************************************************************************/
941
942 .theme-presets.property-sheet .insets-icon-top {
943 -fx-background-color: -sb-content-detail, derive(-sb-content-detail, -30%), -sb-content-background;
944 -fx-background-insets: 0, 1 0 0 0, 1;
945 }
946 .theme-presets.property-sheet .insets-icon-right {
947 -fx-background-color: -sb-content-detail, derive(-sb-content-detail, -30%), -sb-content-background;
948 -fx-background-insets: 0, 0 1 0 0, 1;
949 }
950 .theme-presets.property-sheet .insets-icon-bottom {
951 -fx-background-color: -sb-content-detail, derive(-sb-content-detail, -30%), -sb-content-background;
952 -fx-background-insets: 0, 0 0 1 0, 1;
953 }
954 .theme-presets.property-sheet .insets-icon-left {
955 -fx-background-color: -sb-content-detail, derive(-sb-content-detail, -30%), -sb-content-background;
956 -fx-background-insets: 0, 0 0 0 1, 1;
957 }
958
959 .theme-presets.property-sheet .insets-copy-button-shape {
960 -fx-shape: "M1.25,7.5c-0.13,0-0.259-0.051-0.357-0.15C0.7,7.152,0.703,6.836,0.9,
961 6.643L3.598,4L0.9,1.357 C0.703,1.164,0.7,0.847,0.893,0.65c0.194-0.196,0.51-0.2,
962 0.708-0.007L5.027,4L1.6,7.357C1.502,7.453,1.376,7.5,1.25,7.5z";
963 -fx-background-color: -sb-content-detail;
964 -fx-min-width: 4;
965 -fx-max-width: 4;
966 -fx-min-height: 8;
967 -fx-max-height: 8;
968 }
969 .theme-presets.property-sheet .insets-copy-button {
970 -fx-background-color: null;
971 -fx-background-radius: 0;
972 -fx-min-width: 10;
973 -fx-max-width: 10;
974 }
975 .theme-presets.property-sheet .insets-copy-button:hover {
976 -fx-background-color: derive(-sb-content-background, -10%), -sb-content-background;
977 -fx-background-insets: 0 1 0 1, 1 2 1 2;
978 }
979 .theme-presets.property-sheet .insets-copy-button:focused {
980 -fx-background-color: -fx-focus-color, -fx-background;
981 -fx-background-insets: 0 1 0 1, 1 2 1 2;
982 }
983
984 /*******************************************************************************
985 * Property Sheet Panels - Rotate Editor *
986 ******************************************************************************/
987
988 .theme-presets.property-sheet .rotation-dial {
989 -fx-background-radius: 100;
990 }
991 .theme-presets.property-sheet .rotation-handle {
992 -fx-background-color: -sb-content-detail, derive(-sb-content-background, 10%);
993 -fx-background-insets: 14 5 14 23, 15 6 15 24;
994 -fx-background-radius: 20, 20;
995 }
996
997 /*******************************************************************************
998 * Property Sheet Panels - Anchor Pane Constraints Editor *
999 ******************************************************************************/
1000
1001 .theme-presets.property-sheet .ap-constraints-outer-border {
1002 -fx-border-color: -sb-line-art;
1003 -fx-border-insets: -1;
1004 }
1005 .theme-presets.property-sheet .ap-constraints-inner-border {
1006 -fx-border-color: -sb-line-art;
1007 }
1008 .theme-presets.property-sheet .ap-constraints-shape {
1009 -fx-background-color: -sb-line-art;
1010 }
1011 .theme-presets.property-sheet .ap-constraints-toggle:selected .ap-constraints-shape {
1012 -fx-background-color: -sb-line-art-accent;
1013 }
1014 .theme-presets.property-sheet .ap-constraints-toggle {
1015 -fx-background-color: transparent;
1016 -fx-padding: 3;
1017 }
1018 .theme-presets.property-sheet .ap-constraints-toggle:hover {
1019 -fx-cursor: hand;
1020 -fx-background-color: #cccccc, -fx-base;
1021 -fx-background-insets: 1, 2;
1022 }
1023 .theme-presets.property-sheet .ap-constraints-toggle:focused {
1024 -fx-background-color: -fx-focus-color, -fx-inner-border, -fx-base, -fx-faint-focus-color, -fx-base;
1025 -fx-background-insets: -0.2, 1, 2, -1.4, 2.6;
1026 }
1027
1028 /*******************************************************************************
1029 * Property Sheet Panels - Multi Row Editor Buttons *
1030 ******************************************************************************/
1031
1032 .theme-presets.property-sheet .multi-row-plus-button {
1033 -fx-text-fill: -sb-content-detail;
1034 -fx-padding: 4 3 3 4;
1035 -fx-min-width: 17;
1036 }
1037
1038 .theme-presets.property-sheet .multi-row-menubutton {
1039 -fx-padding: 4 5 3 1;
1040 -fx-min-width: 17;
1041 }
1042
1043 /*******************************************************************************
1044 * Property Sheet Panels - Symbol Prefix @ @/ / # etc *
1045 ******************************************************************************/
1046
1047 .theme-presets.property-sheet .symbol-prefix {
1048 -fx-text-fill: -sb-content-text-dimmed;
1049 -fx-background-color:
1050 -sb-text-control-outer, -sb-content-background;
1051 -fx-background-insets: 0, 1 0 1 1;
1052 -fx-padding: 4 3 3 5;
1053 }
1054
1055 /*******************************************************************************
1056 * Property Sheet Panels - Suggestive ListView *
1057 ******************************************************************************/
1058
1059 .theme-presets.property-sheet .auto-suggest-popup,
1060 .theme-presets.property-sheet .auto-suggest-popup .custom-menu-item {
1061 -fx-padding: 0;
1062 }
1063 .theme-presets.property-sheet .auto-suggest-popup .custom-menu-item .list-view {
1064 -fx-background-color: -sb-sharp-edge-lo, white;
1065 -fx-background-insets: 0, 1;
1066 }
1067
1068 /*******************************************************************************
1069 * Property Sheet Panels - TableView *
1070 ******************************************************************************/
1071
1072 .theme-presets.property-sheet .table-view {
1073 /* Constants used throughout the tableview. */
1074 /*-fx-table-header-border-color: -fx-box-border;*/
1075 -fx-table-cell-border-color: derive(-sb-text-control-outer, -15%);
1076 }
1077 .theme-presets.property-sheet .table-view {
1078 -fx-background-color: -sb-text-control-outer, -sb-content-background;
1079 -fx-background-insets: 0, 1;
1080 -fx-padding: 1;
1081 }
1082 .theme-presets.property-sheet .table-view .placeholder .label {
1083 -fx-text-fill: -sb-content-text-dimmed;
1084 }
1085 .table-cell {
1086 -fx-padding: 3 4 1 4;
1087 }
1088 .theme-presets.property-sheet .table-row-cell {
1089 -fx-background: -sb-text-control-inner;
1090 -fx-background-color: -fx-table-cell-border-color, -fx-background;
1091 }
1092 .theme-presets.property-sheet .table-row-cell:odd {
1093 -fx-background: -sb-text-control-inner;
1094 }
1095 .theme-presets.property-sheet .table-row-cell .text {
1096 -fx-fill: -sb-content-text;
1097 }
1098 .theme-presets.property-sheet .table-view .column-header,
1099 .theme-presets.property-sheet .table-view .filler,
1100 .theme-presets.property-sheet .table-view > .column-header-background > .show-hide-columns-button,
1101 .theme-presets.property-sheet .table-view:constrained-resize .filler,
1102 .theme-presets.property-sheet .tree-table-view:constrained-resize .filler {
1103 -fx-background-color: -sb-text-control-outer, derive(-sb-content-background, 10%);
1104 -fx-size: 1em;
1105 -fx-padding: 2 6 2 6;
1106 }
1107 .theme-presets.property-sheet .column-header .label {
1108 -fx-text-fill: -sb-content-text;
1109 -fx-font-weight: normal;
1110 -fx-alignment: CENTER_LEFT;
1111 }
1112 .theme-presets.property-sheet .table-view .virtual-flow .scroll-bar {
1113 -fx-background-color: -sb-text-control-outer, derive(-sb-content-background, -18%);
1114 }
1115 .theme-presets.property-sheet .table-view:row-selection .virtual-flow .corner {
1116 -fx-background-color: -sb-text-control-outer, derive(-sb-content-background, -18%);
1117 -fx-background-insets: 0, 0 0 1 1;
1118 }
1119 .theme-presets.property-sheet .table-view .arrow {
1120 -fx-background-color: -sb-content-detail;
1121 }
1122 /* Selected rows when table-view IS focused */
1123 .theme-presets.property-sheet .table-view:focused .table-row-cell:filled:selected,
1124 .theme-presets.property-sheet .table-view:focused .table-row-cell .table-cell:selected {
1125 -fx-background: -sb-selected-bar-color;
1126 -fx-table-cell-border-color: -sb-selected-bar-color;
1127 }
1128 /* Selected rows when table-view is NOT focused */
1129 .theme-presets.property-sheet .table-view .table-row-cell:filled:selected,
1130 .theme-presets.property-sheet .table-view .table-row-cell .table-cell:selected {
1131 -fx-background: -sb-selected-bar-unfocused-color;
1132 -fx-table-cell-border-color: -sb-selected-bar-unfocused-color;
1133 }
1134
1135 /*******************************************************************************
1136 * *
1137 * CSS Panel *
1138 * *
1139 ******************************************************************************/
1140
1141 .theme-presets.css-panel-background {
1142 -fx-background-color: -sb-sharp-edge-lo, -sb-content-background;
1143 -fx-background-insets: 0, 1 0 0 0;
1144 }
1145
1146 /*******************************************************************************
1147 * CSS Panel - TableView *
1148 ******************************************************************************/
1149
1150 .theme-presets.SBKIT-css-panel .table-view .placeholder {
1151 -fx-background-color: -sb-content-background;
1152 }
1153 .theme-presets.SBKIT-css-panel .table-view .placeholder .label {
1154 -fx-text-fill: -sb-content-text-dimmed;
1155 }
1156 .theme-presets.SBKIT-css-panel .table-view .hyperlink {
1157 -fx-font-size: 0.875em;
1158 -fx-padding: 0 0 0 4;
1159 -fx-border-width: 0px;
1160 -fx-text-fill: -sb-content-text;
1161 }
1162 .theme-presets.SBKIT-css-panel .table-view .label {
1163 -fx-font-size: 0.875em;
1164 -fx-padding: 0 0 0 4;
1165 -fx-text-fill: -sb-content-text;
1166 }
1167 .theme-presets.SBKIT-css-panel .table-view {
1168 -fx-background-color: -sb-content-background;
1169 -fx-background-insets: 0;
1170 -fx-border-width: 0;
1171 -fx-padding: 0;
1172 }
1173 .theme-presets.SBKIT-css-panel .table-row-cell, .table-row-cell:selected {
1174 -fx-background-color: -sb-sharp-edge-lo, -sb-content-background;
1175 -fx-background-insets: 0, 0 0 1 0;
1176 }
1177 .theme-presets.SBKIT-css-panel .table-cell {
1178 -fx-background-color: -sb-sharp-edge-lo, -sb-content-background;
1179 -fx-background-insets: 0, 0 1 1 0;
1180 -fx-border-width: 0;
1181 -fx-padding: 0;
1182 }
1183 .theme-presets.SBKIT-css-panel .table-cell:last-visible {
1184 -fx-background-insets: 0, 0 0 1 0;
1185 }
1186 .theme-presets.SBKIT-css-panel .table-view .column-header {
1187 -fx-background-color: derive(-sb-sharp-edge-lo, -20%), -sb-sharp-edge-hi, -sb-flat;
1188 -fx-background-insets: -1 0 0 0, 0 1 1 0, 1 1 1 0;
1189 }
1190 .theme-presets.SBKIT-css-panel .table-view .column-header .label {
1191 -fx-text-fill: -sb-header-text;
1192 -fx-font-weight: normal;
1193 -fx-alignment: CENTER_LEFT;
1194 -fx-padding: 0 0 0 5;
1195 }
1196 .theme-presets.SBKIT-css-panel .table-view .filler {
1197 -fx-background-color: derive(-sb-sharp-edge-lo, -20%), -sb-sharp-edge-hi, -sb-flat;
1198 -fx-background-insets: -1 0 0 0, 0 1 1 0, 1 1 1 0;
1199 }
1200
1201 .theme-presets.SBKIT-css-panel .notAppliedStyleLine .line {
1202 -fx-border-width: 0;
1203 -fx-background-color:black;
1204 }
1205
1206 .theme-presets.SBKIT-css-panel .winner-background {
1207 -fx-background-color: -sb-css-winner-color;
1208 -fx-background-insets: 0 1 1 0;
1209 }
1210
1211 .theme-presets.SBKIT-css-panel .note-label .text {
1212 -fx-font-size: 0.750em;
1213 -fx-fill: -sb-content-text-dimmed;
1214 }
1215
1216 .theme-presets.SBKIT-css-panel .css-panel-message .text {
1217 /* Used for 'Multiple Selection' message */
1218 -fx-fill: -sb-content-text-dimmed;
1219 -fx-font-size: 0.875em;
1220 }
1221
1222 /*******************************************************************************
1223 * CSS Panel - Picking Mode Toggle Buttons *
1224 ******************************************************************************/
1225
1226 .theme-presets.SBKIT-css-panel .cursor-shape {
1227 -fx-shape: "M9.084,7.833c-1.709,0.25-3.242,0.734-3.242,0.734l2.783,4.892l-1.708,1L3.904,9.454C2.713,
1228 9.967,1.208,11.5,1.208,11.5L1,1 L9.084,7.833z";
1229 -fx-background-color: derive(-sb-header-detail, -15%);
1230 -fx-min-width: 8;
1231 -fx-max-width: 8;
1232 -fx-min-height: 13;
1233 -fx-max-height: 13;
1234 }
1235
1236 .theme-presets.SBKIT-css-panel .css-cursor-shape {
1237 -fx-shape: "M9.083,7.833C4.833,8.25,1,11,1,11V1L9.083,7.833z M8,14H6v-3h2v-1H5v5h3V14z M12,
1238 12h-2v-1h2v-1H9v3h2v1H9v1h3V12z M16,12 h-2v-1h2v-1h-3v3h2v1h-2v1h3V12z";
1239 -fx-background-color: derive(-sb-header-detail, -15%);
1240 -fx-min-width: 15;
1241 -fx-max-width: 15;
1242 -fx-min-height: 15;
1243 -fx-max-height: 15;
1244 }
1245
1246 .theme-presets.SBKIT-css-panel .toggle-button {
1247 -fx-background-color: -sb-sharp-edge-lo, -sb-sharp-edge-hi, -sb-flat;
1248 -fx-background-insets: 0, 0 0 1 0, 1 0 1 0;
1249 -fx-background-radius: 0;
1250 -fx-min-width: 25;
1251 -fx-min-height: 25;
1252 }
1253 .theme-presets.SBKIT-css-panel .toggle-button:selected {
1254 -fx-background-color:
1255 derive(-sb-sharp-edge-lo, -25%),
1256 derive(-sb-sharp-edge-lo, -10%),
1257 linear-gradient(to bottom, derive(-sb-flat, -20% ) 0%, derive(-sb-flat, -12% ) 20%);
1258 -fx-background-insets: -1 0 0 0, 0, 0 1 1 1;
1259 }
1260 .theme-presets.SBKIT-css-panel .toggle-button:focused {
1261 -fx-background-color:
1262 -fx-focus-color,
1263 linear-gradient(to bottom, derive(-sb-flat, -20% ) 0%, derive(-sb-flat, -12% ) 20%);
1264 -fx-background-insets: -1 0 0 0, 0 1 1 1;
1265 }
1266 .theme-presets.SBKIT-css-panel .css-toggle-left {
1267 -fx-background-insets: 0, 0 0 1 1, 1 0 1 1;
1268 }
1269
1270 /*******************************************************************************
1271 * CSS Panel - Stylelable Path *
1272 ******************************************************************************/
1273
1274 .theme-presets.SBKIT-css-panel .styleable-path {
1275 -fx-background-color: -sb-sharp-edge-lo, -sb-sharp-edge-hi, -sb-flat;
1276 -fx-background-insets: -1 0 0 0, 0 0 1 0, 1 0 1 0;
1277 }
1278 .theme-presets.SBKIT-css-panel .styleable-path > .label {
1279 -fx-font-size: 0.875em;
1280 -fx-text-fill: -sb-header-text;
1281 -fx-padding: 0 12 0 8;
1282 }
1283 .theme-presets.SBKIT-css-panel .styleable-path .hyperlink {
1284 -fx-font-size: 0.875em;
1285 -fx-text-fill: -sb-header-text;
1286 -fx-padding: 0 0 0 0;
1287 -fx-border-width: 0;
1288 }
1289 .theme-presets.SBKIT-css-panel .styleable-path .button {
1290 -fx-background-color: -sb-sharp-edge-lo, derive(-sb-sharp-edge-hi, 10%);
1291 -fx-background-insets: 0, 1;
1292 -fx-background-radius: 100;
1293 -fx-min-width: 16;
1294 -fx-max-width: 16;
1295 -fx-min-height: 16;
1296 -fx-max-height: 16;
1297 }
1298 .theme-presets.SBKIT-css-panel .styleable-path .button:hover {
1299 -fx-background-color: derive(-sb-sharp-edge-lo, -10%), derive(-sb-sharp-edge-hi, 40%);
1300 }
1301 .theme-presets.SBKIT-css-panel .styleable-path-button-shape {
1302 -fx-shape: "M 0 -3.5 v 7 l 4 -3.5 z";
1303 -fx-background-color: -sb-header-detail;
1304 -fx-min-width: 5;
1305 -fx-max-width: 5;
1306 -fx-min-height: 6;
1307 -fx-max-height: 6;
1308 }
1309 .theme-presets.SBKIT-css-panel .styleable-path-optional-label .text {
1310 -fx-fill: -sb-header-text-dimmed;
1311 }
1312
1313 /*******************************************************************************
1314 * CSS Panel - Lookup Button *
1315 ******************************************************************************/
1316
1317 .theme-presets.SBKIT-css-panel .lookup-button {
1318 -fx-background-color: transparent;
1319 -fx-background-insets: 0;
1320 }
1321 .theme-presets.SBKIT-css-panel .lookup-button .label {
1322 -fx-padding: 0;
1323 }
1324 .theme-presets.SBKIT-css-panel .lookup-button .arrow-button {
1325 -fx-padding: 0 3 2 2;
1326 }
1327 .theme-presets.SBKIT-css-panel .lookup-button .arrow-button > .arrow {
1328 -fx-padding: 0 0.231em 0.154em 0.154em;
1329 -fx-background-color: derive(-sb-header-detail, -20%);
1330 -fx-effect: null;
1331 }
1332 .theme-presets.SBKIT-css-panel .lookup-button:hover .arrow-button {
1333 -fx-background-color: black, white;
1334 -fx-background-insets: 0 0 3 0, 1 1 4 0;
1335 -fx-background-radius: 0, 0;
1336 }
1337 .theme-presets.SBKIT-css-panel .lookup-button .custom-menu-item .tree-view {
1338 -fx-background-color: derive(-sb-sharp-edge-lo, -20%);
1339 -fx-background-insets: 0;
1340 }
1341 .theme-presets.SBKIT-css-panel .lookup-button .custom-menu-item .tree-view .tree-cell {
1342 -fx-background-color: -sb-content-background;
1343 }
1344 .theme-presets.SBKIT-css-panel .lookup-button .custom-menu-item .tree-view .tree-cell .tree-disclosure-node .arrow {
1345 -fx-background-color: -sb-content-detail;
1346 }
1347
1348 /*******************************************************************************
1349 * CSS Panel - Cog Button *
1350 ******************************************************************************/
1351
1352 .theme-presets.SBKIT-css-panel .css-panel-cog-menubutton {
1353 -fx-background-color: transparent;
1354 -fx-background-radius: 0;
1355 -fx-graphic-text-gap: 0;
1356 -fx-min-width: 16;
1357 -fx-max-width: 16;
1358 -fx-min-height: 12;
1359 -fx-max-height: 12;
1360 }
1361 .theme-presets.SBKIT-css-panel .css-panel-cog-menubutton:hover {
1362 -fx-background-color: derive(-sb-sharp-edge-lo, 20%), -sb-css-winner-color;
1363 -fx-background-insets: 0, 1;
1364 }
1365 .theme-presets.SBKIT-css-panel .css-panel-cog-menubutton:focused {
1366 -fx-background-color: -fx-focus-color, -fx-background;
1367 }
1368 .theme-presets.SBKIT-css-panel .css-panel-cog-menubutton > .arrow-button {
1369 visibility: hidden;
1370 -fx-padding: 0;
1371 }
1372 .theme-presets.SBKIT-css-panel .css-panel-cog-menubutton > .arrow {
1373 -fx-shape: null;
1374 -fx-padding: 0;
1375 }