轉載自? JavaFX8 modena樣式(css)源碼?

/*?Modena?This is the second generation theme for JavaFX after Caspian.? */ ?/*?* Copyright (c) 2009, 2013, Oracle and/or its affiliates. All rights reserved. ?* DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER. ?* ??* This code is free software; you can redistribute it and/or modify it ?* under the terms of the GNU General Public License version 2 only, as ?* published by the Free Software Foundation. ?Oracle designates this ?* particular file as subject to the "Classpath" exception as provided ?* by Oracle in the LICENSE file that accompanied this code. ?* ??* This code is distributed in the hope that it will be useful, but WITHOUT ?* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or ?* FITNESS FOR A PARTICULAR PURPOSE. ?See the GNU General Public License ?* version 2 for more details (a copy is included in the LICENSE file that ?* accompanied this code). ?* ??* You should have received a copy of the GNU General Public License version ?* 2 along with this work; if not, write to the Free Software Foundation, ?* Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA. ?* ??* Please contact Oracle, 500 Oracle Parkway, Redwood Shores, CA 94065 USA ?* or visit www.oracle.com if you need additional information or have any ?* questions.?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??*/ ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* THEMING INSTRUCTIONS ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?*******************************************************************************?TODO: Explain here how theming works:?* -fx-text-base-color for text on top of -fx-base, -fx-color, and -fx-body-color?* -fx-text-background-color for text on top of -fx-background?* -fx-text-inner-color for text on top of -fx-control-inner-color?* -fx-selection-bar-text for text on top of -fx-selection-bar?RESIZING FOR DIFFERENT SCREEN DPI? -------------------------------?When the screen DPI changes Windows will use a different font size by default. ? The default is 12px and can change to 15px or 18px depending on user ? preference or screen DPI. On Mac the default is 13px and embedded will depend ? on hardware. To make UI controls scale and be the right proportions for each of ? these font sizes we base the padding (which controls size of control) on the ? font size. This is done using the CSS measurement unit of a "em" where? (1em = font size). The default sizes are based on Windows default of 12px, as? a quick reference here are common px sizes in em units on windows.?Windows 12px -> em units ? ?-> Mac 13px ? ? ?| ? ----------------------------------------?1px ? ? -> 0.083333em ?-> 1.08px ~ 2px?2px ? ? -> 0.166667em ?-> 2.16px ~ 3px?3px ?= 0.25em?4px ?= 0.333333em?5px ?= 0.416667em?6px ?= 0.5em?7px ?= 0.583333em?8px ?= 0.666667em?9px ?= 0.75em?10px ?= 0.833333em?11px ?= 0.916667em?12px ?= 1em?IMPORTANT: Not all sizes are scaled with em units only padding. All borders and ? background insets are still in pixels. Also any padding where it has to match up? is being used to size a border should also be in pixels.?******************************************************************************/ ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* CSS Styles for core infrastructure bits. ?The .root section provides the ? ?*?* overall default colors used by the rest of the sections. ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.root { ?/***************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* The main color palette from which the rest of the colors are derived. ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?**************************************************************************/ ?/* A light grey that is the base color for objects. ?Instead of using?* -fx-base directly, the sections in this file will typically use -fx-color.?*/ ?-fx-base: #ececec; ?/* A very light grey used for the background of windows. ?See also?* -fx-text-background-color, which should be used as the -fx-text-fill?* value for text painted on top of backgrounds colored with -fx-background.?*/ ?-fx-background: derive(-fx-base,26.4%); ?/* Used for the inside of text boxes, password boxes, lists, trees, and?* tables. ?See also -fx-text-inner-color, which should be used as the?* -fx-text-fill value for text painted on top of backgrounds colored?* with -fx-control-inner-background.?*/ ?-fx-control-inner-background: derive(-fx-base,80%); ?/* Version of -fx-control-inner-background for alternative rows */ ?-fx-control-inner-background-alt: derive(-fx-control-inner-background,-2%); ?/* One of these colors will be chosen based upon a ladder calculation?* that uses the brightness of a background color. ?Instead of using these?* colors directly as -fx-text-fill values, the sections in this file should?* use a derived color to match the background in use. ?See also:?*?* -fx-text-base-color for text on top of -fx-base, -fx-color, and -fx-body-color?* -fx-text-background-color for text on top of -fx-background?* -fx-text-inner-color for text on top of -fx-control-inner-color?* -fx-selection-bar-text for text on top of -fx-selection-bar?*/ ?-fx-dark-text-color: black; ?-fx-mid-text-color: #333; ?-fx-light-text-color: white; ?/* A bright blue for highlighting/accenting objects. ?For example: selected?* text; selected items in menus, lists, trees, and tables; progress bars */ ?-fx-accent: #0096C9; ?/* Default buttons color, this is similar to accent but more subtle */ ?-fx-default-button: #ABD8ED; ?/* A bright blue for the focus indicator of objects. Typically used as the?* first color in -fx-background-color for the "focused" pseudo-class. Also?* typically used with insets of -1.4 to provide a glowing effect.?*/ ?-fx-focus-color: #039ED3; ?-fx-faint-focus-color: #039ED322; ?/* The color that is used in styling controls. The default value is based?* on -fx-base, but is changed by pseudoclasses to change the base color.?* For example, the "hover" pseudoclass will typically set -fx-color to?* -fx-hover-base (see below) and the "armed" pseudoclass will typically?* set -fx-color to -fx-pressed-base.?*/ ?-fx-color: -fx-base; ?/* Chart Color Palette */ ?CHART_COLOR_1: #f3622d; ?CHART_COLOR_2: #fba71b; ?CHART_COLOR_3: #57b757; ?CHART_COLOR_4: #41a9c9; ?CHART_COLOR_5: #4258c9; ?CHART_COLOR_6: #9a42c8; ?CHART_COLOR_7: #c84164; ?CHART_COLOR_8: #888888; ?/* Chart Color Palette Semi-Transparent?* These are used by charts that need semi transparent versions of the above colors, such as BubbleChart. They?* are exactly the same colors as above just with alpha?*?* 20% opacity?*/ ?CHART_COLOR_1_TRANS_20: #f3622d33; ?CHART_COLOR_2_TRANS_20: #fba71b33; ?CHART_COLOR_3_TRANS_20: #57b75733; ?CHART_COLOR_4_TRANS_20: #41a9c933; ?CHART_COLOR_5_TRANS_20: #4258c933; ?CHART_COLOR_6_TRANS_20: #9a42c833; ?CHART_COLOR_7_TRANS_20: #c8416433; ?CHART_COLOR_8_TRANS_20: #88888833; ?/* 70% opacity */ ?CHART_COLOR_1_TRANS_70: #f3622db3; ?CHART_COLOR_2_TRANS_70: #fba71bb3; ?CHART_COLOR_3_TRANS_70: #57b757b3; ?CHART_COLOR_4_TRANS_70: #41a9c9b3; ?CHART_COLOR_5_TRANS_70: #4258c9b3; ?CHART_COLOR_6_TRANS_70: #9a42c8b3; ?CHART_COLOR_7_TRANS_70: #c84164b3; ?CHART_COLOR_8_TRANS_70: #888888b3; ?/***************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Colors that are derived from the main color palette. ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?**************************************************************************/ ?/* A little lighter than -fx-base and used as the -fx-color for the?* "hovered" pseudoclass state.?*/ ?-fx-hover-base: ladder( ?-fx-base, ?derive(-fx-base,20%) 20%, ?derive(-fx-base,30%) 35%, ?derive(-fx-base,40%) 50% ?); ?/* A little darker than -fx-base and used as the -fx-color for the?* "armed" pseudoclass state.?*?* TODO: should this be renamed to -fx-armed-base??*/ ?-fx-pressed-base: derive(-fx-base,-6%); ?/* The color to use for -fx-text-fill when text is to be painted on top of?* a background filled with the -fx-background color.?*/ ?-fx-text-background-color: ladder( ?-fx-background, ?-fx-light-text-color 45%, ?-fx-dark-text-color ?46%, ?-fx-dark-text-color ?59%, ?-fx-mid-text-color ? 60% ?); ?/* A little darker than -fx-color and used to draw boxes around objects such?* as progress bars, scroll bars, scroll panes, trees, tables, and lists.?*/ ?-fx-box-border: ladder( ?-fx-color, ?black 20%, ?derive(-fx-color,-15%) 30% ?); ?/* Darker than -fx-background and used to draw boxes around text boxes and?* password boxes.?*/ ?-fx-text-box-border: ladder( ?-fx-background, ?black 10%, ?derive(-fx-background, -15%) 30% ?); ?/* Lighter than -fx-background and used to provide a small highlight when?* needed on top of -fx-background. This is never a shadow in Modena but?* keep -fx-shadow-highlight-color name to be compatible with Caspian.?*/ ?-fx-shadow-highlight-color: ladder( ?-fx-background, ?rgba(255,255,255,0.07) 0%, ?rgba(255,255,255,0.07) 20%, ?rgba(255,255,255,0.07) 70%, ?rgba(255,255,255,0.7) 90%, ?rgba(255,255,255,0.75) 100% ?); ?/* A gradient that goes from a little darker than -fx-color on the top to?* even more darker than -fx-color on the bottom. ?Typically is the second?* color in the -fx-background-color list as the small thin border around?* a control. It is typically the same size as the control (i.e., insets?* are 0).?*/ ?-fx-outer-border: derive(-fx-color,-23%); ?/* A gradient that goes from a bit lighter than -fx-color on the top to?* a little darker at the bottom. ?Typically is the third color in the?* -fx-background-color list as a thin highlight inside the outer border.?* Insets are typically 1.?*/ ?-fx-inner-border: linear-gradient(to bottom, ?ladder( ?-fx-color, ?derive(-fx-color,30%) 0%, ?derive(-fx-color,20%) 40%, ?derive(-fx-color,25%) 60%, ?derive(-fx-color,55%) 80%, ?derive(-fx-color,55%) 90%, ?derive(-fx-color,75%) 100% ?), ?ladder( ?-fx-color, ?derive(-fx-color,20%) 0%, ?derive(-fx-color,10%) 20%, ?derive(-fx-color,5%) 40%, ?derive(-fx-color,-2%) 60%, ?derive(-fx-color,-5%) 100% ?)); ?-fx-inner-border-horizontal: linear-gradient(to right, derive(-fx-color,55%), derive(-fx-color,-5%)); ?-fx-inner-border-bottomup: linear-gradient(to top, derive(-fx-color,55%), derive(-fx-color,-5%)); ?/* A gradient that goes from a little lighter than -fx-color at the top to?* a little darker than -fx-color at the bottom and is used to fill the?* body of many controls such as buttons.?*/ ?-fx-body-color: linear-gradient(to bottom, ?ladder( ?-fx-color, ?derive(-fx-color,8%) 75%, ?derive(-fx-color,10%) 80% ?), ?derive(-fx-color,-8%)); ?-fx-body-color-bottomup: linear-gradient(to top, derive(-fx-color,10%) ,derive(-fx-color,-6%)); ?-fx-body-color-to-right: linear-gradient(to right, derive(-fx-color,10%) ,derive(-fx-color,-6%)); ?/* The color to use as -fx-text-fill when painting text on top of?* backgrounds filled with -fx-base, -fx-color, and -fx-body-color.?*/ ?-fx-text-base-color: ladder( ?-fx-color, ?-fx-light-text-color 45%, ?-fx-dark-text-color ?46%, ?-fx-dark-text-color ?59%, ?-fx-mid-text-color ? 60% ?); ?/* The color to use as -fx-text-fill when painting text on top of?* backgrounds filled with -fx-control-inner-background.?*/ ?-fx-text-inner-color: ladder( ?-fx-control-inner-background, ?-fx-light-text-color 45%, ?-fx-dark-text-color ?46%, ?-fx-dark-text-color ?59%, ?-fx-mid-text-color ? 60% ?); ?/* The color to use for small mark-like objects such as checks on check?* boxes, filled in circles in radio buttons, arrows on scroll bars, etc.?*/ ?-fx-mark-color: ladder( ?-fx-color, ?white 30%, ?derive(-fx-color,-63%) 31% ?); ?/* The small thin light "shadow" for mark-like objects. Typically used in?* conjunction with -fx-mark-color with an insets of 1 0 -1 0. */ ?-fx-mark-highlight-color: ladder( ?-fx-color, ?derive(-fx-color,80%) 60%, ?white 70% ?); ?/* Background for items in list like things such as menus, lists, trees,?* and tables. */ ?-fx-selection-bar: -fx-accent; ?/* Background color to use for selection of list cells etc. This is when?* the control doesn't have focus or the row of a previously selected item. */ ?-fx-selection-bar-non-focused: lightgrey; ?/* The color to use as -fx-text-fill when painting text on top of?* backgrounds filled with -fx-selection-bar.?*?* TODO: this can be removed?*/ ?-fx-selection-bar-text: -fx-text-background-color; ?/* These are needed for Popup */ ?-fx-background-color: inherit; ?-fx-background-radius: inherit; ?-fx-background-insets: inherit; ?-fx-padding: inherit; ?/* The color to use in ListView/TreeView/TableView to indicate hover. */ ?-fx-cell-hover-color: #cce3f4; ?/** Focus line for keyboard focus traversal on cell based controls */ ?-fx-cell-focus-inner-border: derive(-fx-selection-bar,30%); ?/* The colors to use in Pagination */ ?-fx-page-bullet-border: #acacac; ?-fx-page-indicator-hover-border: #accee5; ?/***************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Set the default background color for the scene ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?**************************************************************************/ ?-fx-background-color: -fx-background; ? } ?/* Make popups transparent */ ? .root.popup { ?-fx-background-color: transparent; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Common Styles ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* These are styles that give a standard look to a whole range of controls ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?/* ==== ? TEXT NODES IN CONTROLS ? ========================================== */ ?.text { ?/* This adjusts text alignment within the bounds of text nodes so that?the text is always vertically centered within the bounds. Based on?the cap height of the text. */ ?-fx-bounds-type: logical_vertical_center; ?/* Enable LCD text rendering */ ?-fx-font-smoothing-type: lcd; ? } ?/* ==== ? BUTTON LIKE THINGS ? ============================================== */ ?.button, ? .toggle-button, ? .radio-button > .radio, ? .check-box > .box, ? .menu-button, ? .choice-box, ? .color-picker.split-button > .color-picker-label, ? .combo-box-base, ? .combo-box-base:editable > .arrow-button { ?-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0 0 -1 0, 0, 1, 2; ?-fx-background-radius: 3px, 3px, 2px, 1px; ?-fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */ ?-fx-text-fill: -fx-text-base-color; ?-fx-alignment: CENTER; ?-fx-content-display: LEFT; ? } ? .menu-button > .label { ?-fx-alignment: CENTER_LEFT; ? } ? .button:hover, ? .toggle-button:hover, ? .radio-button:hover > .radio, ? .check-box:hover > .box, ? .menu-button:hover, ? .split-menu-button > .label:hover, ? .split-menu-button > .arrow-button:hover, ? .slider .thumb:hover, ? .scroll-bar > .thumb:hover, ? .scroll-bar > .increment-button:hover, ?? .scroll-bar > .decrement-button:hover, ? .choice-box:hover, ? .color-picker.split-button > .arrow-button:hover, ? .color-picker.split-button > .color-picker-label:hover, ? .combo-box-base:hover, ? .combo-box-base:editable > .arrow-button:hover, ? .tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button:hover { ?-fx-color: -fx-hover-base; ? } ? .button:armed, ? .toggle-button:armed, ? .radio-button:armed > .radio, ? .check-box:armed .box, ? .menu-button:armed, ? .split-menu-button:armed > .label, ? .split-menu-button > .arrow-button:pressed, ? .split-menu-button:showing > .arrow-button, ? .slider .thumb:pressed, ? .scroll-bar > .thumb:pressed, ? .scroll-bar > .increment-button:pressed, ?? .scroll-bar > .decrement-button:pressed, ? .choice-box:showing, ? .combo-box-base:showing, ? .combo-box-base:editable:showing > .arrow-button, ? .tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button:pressed { ?-fx-color: -fx-pressed-base; ? } ? .button:focused, ? .toggle-button:focused, ? .radio-button:focused > .radio, ? .check-box:focused > .box, ? .menu-button:focused, ? .choice-box:focused, ? .color-picker.split-button:focused > .color-picker-label, ? .combo-box-base:focused, ? .slider:focused .thumb { ?-fx-background-color: -fx-focus-color, -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ?-fx-background-insets: -0.2, 1, 2, -1.4, 2.6; ?-fx-background-radius: 3, 2, 1, 4, 1; ? } ?/* ==== ? DISABLED THINGS ? ================================================= */ ?.label:disabled, ? .button:disabled, ? .toggle-button:disabled, ? .radio-button:disabled, ? .check-box:disabled, ? .hyperlink:disabled, ? .menu-button:disabled, ? .split-menu-button:disabled, ? .slider:disabled, ? .scroll-bar:disabled, ? .scroll-pane:disabled, ? .progress-bar:disabled, ? .progress-indicator:disabled, ? .text-input:disabled, ? .choice-box:disabled, ? .combo-box-base:disabled, ? .date-cell:disabled > *, /* This is set on children so border is not affected. */ ? .list-view:disabled, ? .tree-view:disabled, ? .table-view:disabled, ? .tree-table-view:disabled, ? .tab-pane:disabled, ? .titled-pane:disabled > .title, ? .accordion:disabled > .titled-pane > .title, ? .tab-pane > .tab-header-area > .headers-region > .tab:disabled, ? .menu:disabled, ? .menu-item:disabled > .label, ? .menu-item:disabled, ? .list-cell:filled:selected:focused:disabled, ? .list-cell:filled:selected:disabled, ? .tree-cell:filled:selected:focused:disabled, ? .tree-cell:filled:selected:disabled, ? .tree-cell > .tree-disclosure-node:disabled, ? .tree-table-row-cell > .tree-disclosure-node:disabled, ? .table-row-cell:selected:disabled, ? .tree-table-row-cell:selected:disabled, ? .table-cell:selected:disabled, ? .tree-table-cell:selected:disabled { ?-fx-opacity: 0.4; ? } ?/* ==== ? MNEMONIC THINGS ? ================================================= */ ?.mnemonic-underline { ?-fx-stroke: transparent; ? } ?.titled-pane:show-mnemonics > .mnemonic-underline, ? .label:show-mnemonics > .mnemonic-underline, ? .context-menu:show-mnemonics > .mnemonic-underline, ? .menu:show-mnemonics > .mnemonic-underline, ? .menu-bar:show-mnemonics > .mnemonic-underline, ? .menu-item:show-mnemonics > .mnemonic-underline, ? .button:show-mnemonics > .mnemonic-underline, ? .toggle-button:show-mnemonics > .mnemonic-underline, ? .radio-button:show-mnemonics > .mnemonic-underline, ? .check-box:show-mnemonics > .mnemonic-underline, ? .hyperlink:show-mnemonics > .mnemonic-underline, ? .split-menu-button:show-mnemonics > .mnemonic-underline, ? .menu-button:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-base-color; ? } ??/* ==== ? MARKS ? =========================================================== */ ?.radio-button:selected > .radio > .dot, ? .check-box:selected > .box > .mark, ? .check-box:indeterminate ?> .box > .mark { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ? } ?/* ==== ? ARROWS ? ========================================================== */ ?.menu-button > .arrow-button > .arrow, ? .split-menu-button > .arrow-button > .arrow { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 0 0 -1 0, 0; ?-fx-padding: 0.25em; ?-fx-shape: "M 0 -3.5 v 7 l 4 -3.5 z"; ? } ? .choice-box > .open-button > .arrow, ? .menu-button:openvertically > .arrow-button > .arrow, ? .split-menu-button:openvertically > .arrow-button > .arrow, ? .combo-box-base > .arrow-button > .arrow, ? .web-view .form-select-button .arrow, ? .tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button > .arrow ?{ ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 0 0 -1 0, 0; ?-fx-padding: 0.166667em 0.333333em 0.166667em 0.333333em; /* 2 4 2 4 */ ?-fx-shape: "M 0 0 h 7 l -3.5 4 z"; ? } ?/* ==== ? CHOICE BOX LIKE THINGS ? ========================================== */ ?.choice-box, ? .menu-button, ? .combo-box-base { ?-fx-padding: 0; ? } ? .choice-box > .label, ? .menu-button > .label, ? .color-picker > .label { ?-fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */ ?-fx-text-fill: -fx-text-base-color; ? } ? .choice-box > .open-button, ? .menu-button > .arrow-button { ?-fx-padding: 0.5em 0.667em 0.5em 0.0em; /* 6 8 6 0 */ ? } ?/* ==== ? BOX LIKE THINGS ? ================================================= */ ?.scroll-pane, ? .split-pane, ? .list-view, ? .tree-view, ? .table-view, ?? .tree-table-view, ? .html-editor { ?-fx-background-color: -fx-box-border, -fx-control-inner-background; ?-fx-background-insets: 0, 1; ?-fx-padding: 1; ? } ? .scroll-pane:focused, ? .split-pane:focused, ? .list-view:focused, ? .tree-view:focused, ? .table-view:focused, ? .tree-table-view:focused, ? .html-editor:focused { ?-fx-background-color: -fx-faint-focus-color, -fx-focus-color, -fx-control-inner-background; ??-fx-background-insets: -1.4, -0.3, 1; ?-fx-background-radius: 2, 0, 0; ? } ? /* ones with grey -fx-background not lighter -fx-control-inner-background */ ? .scroll-pane, ? .split-pane { ?-fx-background-color: -fx-box-border, -fx-background; ? } ? .scroll-pane:focused, ? .split-pane:focused { ?-fx-background-color: -fx-faint-focus-color, -fx-focus-color, -fx-background; ?? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Label ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.label { ?-fx-text-fill: -fx-text-background-color; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Button & ToggleButton ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?/* ==== ? DEFAULT ? ========================================================= */ ?.button:default { ?-fx-base: -fx-default-button; ? } ?/* ==== ? WEB BUTTONS ? ===================================================== */ ?.web-view .form-select-button { ?-fx-background-radius: 2, 2, 1, 0; ?-fx-background-insets: 2 2 1 2, 2, 3, 4; ? } ?/* ==== ? PILL BUTTONS ? ==================================================== */ ?.button.left-pill, ? .toggle-button.left-pill { ?-fx-background-radius: 3 0 0 3, 3 0 0 3, 2 0 0 2, 1 0 0 1; ?-fx-background-insets: 0 0 -1 0, 0, 1, 2; ?-fx-padding: 0.333333em 0.666667em 0.333333em 0.75em; /* 4 8 4 9 */ ? } ? .button.center-pill, ? .toggle-button.center-pill { ?-fx-background-radius: 0; ?-fx-background-insets: 0 0 -1 0, 0 0 0 0, 1 1 1 0, 2 2 2 1 ; ? } ? .button.right-pill, ? .toggle-button.right-pill { ?-fx-background-radius: 0 3 3 0, 0 3 3 0, 0 2 2 0, 0 1 1 0; ?-fx-background-insets: 0 0 -1 0, 0, 1 1 1 0, 2 2 2 1 ; ? } ? .button.left-pill:focused, ? .toggle-button.left-pill:focused { ?-fx-background-insets: -0.2 0 -0.2 -0.2, 1, 2, -1.4 0 -1.4 -1.4, 2.6; ?-fx-background-radius: 3 0 0 3, 2 0 0 2, 1 0 0 1, 4 0 0 4, 1 0 0 1; ? } ? .button.center-pill:focused, ? .toggle-button.center-pill:focused { ?-fx-background-insets: -0.2 0 -0.2 -1, 1 1 1 0, 2 2 2 1, -1.4 0 -1.4 -1, 2.6 2.6 2.6 1.6; ?-fx-background-radius: 0, 0, 0, 0, 0; ? } ? .button.right-pill:focused, ? .toggle-button.right-pill:focused { ?-fx-background-insets: -0.2 -0.2 -0.2 -1, 1 1 1 0, 2 2 2 1, -1.4 -1.4 -1.4 -1, 2.6 2.6 2.6 1.6; ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0, 0 4 4 0, 0 1 1 0; ? } ? .toggle-button:selected.left-pill:focused { ?-fx-background-insets: -0.2 0 -0.2 -0.2, 1, -1.4 0 -1.4 -1.4, 2.6; ?-fx-background-radius: 3 0 0 3, 2 0 0 2, 4 0 0 4, 0; ? } ? .toggle-button:selected.center-pill:focused { ?-fx-background-insets: -0.2 0 -0.2 -1, 1 1 1 0, -1.4 0 -1.4 -1, 2.6 2.6 2.6 1.6; ?-fx-background-radius: 0, 0, 0, 0; ? } ? .toggle-button:selected.right-pill:focused { ?-fx-background-insets: -0.2 -0.2 -0.2 -1, 1 1 1 0, -1.4 -1.4 -1.4 -1, 2.6 2.6 2.6 1.6; ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 4 4 0, 0; ? } ?/* ==== ? SELECTED TOGGLE ? ================================================= */ ?.toggle-button:selected { ?-fx-background-color: ?-fx-shadow-highlight-color, ?linear-gradient(to bottom, derive(-fx-outer-border, -20%), -fx-outer-border), ?linear-gradient(to bottom, ??derive(-fx-color, -22%) 0%, ?derive(-fx-color, -13%) 20%, ?derive(-fx-color, -11%) 50%); ?-fx-background-insets: 0 0 -1 0, 0, 1; ? } ? .toggle-button:selected:focused { ?-fx-background-color: ?-fx-focus-color, ?linear-gradient(to bottom, ?derive(-fx-color, -22%) 0%, ?derive(-fx-color, -13%) 20%, ?derive(-fx-color, -11%) 50%), ?-fx-faint-focus-color, ?linear-gradient(to bottom, ?derive(-fx-color, -22%) 0%, ?derive(-fx-color, -13%) 20%, ?derive(-fx-color, -11%) 50%); ?-fx-background-insets: -0.2, 1, -1.4, 2.6; ?-fx-background-radius: 3, 2, 4, 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* RadioButton ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.radio-button { ?-fx-label-padding: 0.0em 0.0em 0.0em 0.416667em; /* 0 0 0 5 */ ?-fx-text-fill: -fx-text-background-color; ? } ? .radio-button > .radio, ? .radio-button:focused > .radio ?{ ?-fx-background-radius: 1.0em; /* large value to make sure this remains circular */ ?-fx-padding: 0.333333em; /* 4 -- padding from outside edge to the inner black dot */ ? } ? .radio-button > .radio > .dot { ?-fx-background-color: transparent; ?-fx-background-radius: 1.0em; /* large value to make sure this remains circular */ ?-fx-padding: 0.333333em; /* 4 -- radius of the inner black dot when selected */ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* CheckBox ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.check-box { ?-fx-label-padding: 0.0em 0.0em 0.0em 0.416667em; /* 0 0 0 5 */ ?-fx-text-fill: -fx-text-background-color; ? } ? .check-box > .box { ?-fx-background-radius: 3, 2, 1; ?-fx-padding: 0.166667em 0.166667em 0.25em 0.25em; /* 2 2 3 3 */ ? } ? .check-box > .box > .mark { ?-fx-background-color: null; ?-fx-padding: 0.416667em 0.416667em 0.5em 0.5em; /* 5 5 6 6 */ ?-fx-shape: "M-0.25,6.083c0.843-0.758,4.583,4.833,5.75,4.833S14.5-1.5,15.917-0.917c1.292,0.532-8.75,17.083-10.5,17.083C3,16.167-1.083,6.833-0.25,6.083z"; ? } ? .check-box:indeterminate > .box { ?-fx-padding: 0; ?? } ? .check-box:indeterminate ?> .box > .mark { ?-fx-shape: "M0,0H10V2H0Z"; ?-fx-scale-shape: false; ?-fx-padding: 0.666667em; /* 16x16 = 8+8 */ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Hyperlink ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.hyperlink { ?-fx-padding: 0.166667em 0.25em 0.166667em 0.25em; /* 2 3 2 3 */ ?-fx-cursor: hand; ?-fx-content-display: LEFT; ?-fx-text-fill: -fx-text-background-color; ?-fx-border-color: transparent; ?-fx-border-width: 1px; ? } ? .hyperlink, ? .hyperlink:hover, ? .hyperlink:hover:visited { ?-fx-text-fill: -fx-accent; ? } ? .hyperlink:armed, ? .hyperlink:visited, ? .hyperlink:hover:armed { ?-fx-text-fill: -fx-text-background-color; ? } ? .hyperlink:hover, ? .hyperlink:visited, ? .hyperlink:hover:visited { ?-fx-underline: true; ? } ? .hyperlink:visited:armed { ?-fx-underline: false; ? } ? .hyperlink:focused { ?-fx-border-color: -fx-focus-color; ?-fx-border-style: segments(0.166667em, 0.166667em); ?-fx-border-width: 1px; ? } ? .hyperlink:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-fill; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* SplitMenuButton ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.split-menu-button { ?-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border; ??-fx-background-insets: 0 0 -1 0, 0; ?-fx-background-radius: 3, 3; ?-fx-padding: 0; ? } ? .split-menu-button > .label { ?-fx-text-fill: -fx-text-base-color; ?-fx-background-color: -fx-inner-border, -fx-body-color; ??-fx-background-insets: 1 0 1 1, 2 1 2 2; ?-fx-background-radius: 2 0 0 2, 1 0 0 1; ?-fx-padding: 0.333333em 0.667em 0.333333em 0.667em; /* 4 8 4 8 */ ? } ? .split-menu-button > .arrow-button { ?-fx-background-color: -fx-inner-border, -fx-body-color; ??-fx-background-insets: 1, 2; ?-fx-background-radius: 0 2 2 0, 0 1 1 0; ?-fx-padding: 0.5em 0.667em 0.5em 0.667em; /* 6 8 6 8 */ ? } ? .split-menu-button:focused { ?-fx-background-color: -fx-focus-color; ?-fx-background-insets: -0.2; ?-fx-background-radius: 3; ? } ? .split-menu-button:focused > .label { ?-fx-background-color: -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ??-fx-background-insets: 1 0 1 1, 2 1 2 2, -1.4 0 -1.4 -1.4, 2.6 1.6 2.6 2.6; ?-fx-background-radius: 2 0 0 2, 1 0 0 1, 4 0 0 4, 0; ? } ? .split-menu-button:focused > .arrow-button { ?-fx-background-color: -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ??-fx-background-insets: 1, 2, -1.4, 2.6; ?-fx-background-radius: 0 2 2 0, 0 1 1 0, 0 4 4 0, 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ToolBar ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tool-bar:vertical { /* left */ ?-fx-background-color: ?-fx-outer-border, ?linear-gradient(to right, derive(-fx-base,0%) 0%, derive(-fx-base,10%) 50%, derive(-fx-base,0%) 100%); ?-fx-background-insets: 0, 0 0 0 1; ?-fx-padding: 0.5em 0.416667em 0.5em 0.416667em; /* 6 5 6 5 */ ?-fx-spacing: 0.333em; /* 4 */ ?-fx-alignment: TOP_LEFT; ? } ? .tool-bar { /* top */ ?TOP-COLOR: ladder( ?-fx-base, ?derive(-fx-base,0%) 0%, ?derive(-fx-base,46%) 100% ?); ?-fx-background-color: ?linear-gradient(to bottom, derive(TOP-COLOR,25%) 0%, -fx-outer-border 90%), ?linear-gradient(to bottom, TOP-COLOR 2%, derive(-fx-base,-2.1%) 95%); ?-fx-background-insets: 0 0 0 0, 1 0 1 0; ?-fx-padding: 0.416667em 0.5em 0.416667em 0.5em; /* 5 6 ?5 6 */ ?-fx-spacing: 0.333em; /* 4 */ ?-fx-alignment: CENTER_LEFT; ? } ? .tool-bar:vertical.right { ?-fx-background-insets: 0, 0 1 0 0; ? } ? .tool-bar.bottom { ?-fx-background-color: ?-fx-outer-border, ?derive(TOP-COLOR,25%), ?linear-gradient(to bottom, TOP-COLOR 2%, derive(-fx-base,-2.1%) 95%); ?-fx-background-insets: 0, 1 0 0 0, 2 0 0 0; ? } ? .tool-bar > .container > .separator { ?-fx-orientation: vertical; ? } ? .tool-bar:vertical > .container > .separator { ?-fx-orientation: horizontal; ? ? ? } ? .tool-bar-overflow-button { ?-fx-padding: 0 0.75em 0 0 ; ? } ? .tool-bar:vertical > .tool-bar-overflow-button { ?-fx-padding: 0 0 0.75em 0 ; ? } ? .tool-bar-overflow-button > .arrow { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.666667em 0.916667em 0em 0em; /* 8 11 0 0 */ ?-fx-shape: "M337.273,297.622l-0.016,1.069l2.724,2.639l-2.723,2.628l0.015,1.048h0.881l3.81-3.685l-3.788-3.699H337.273z M343.783,297.622h-0.902l-0.015,1.069l2.724,2.639l-2.724,2.628l0.015,1.048h0.882l3.809-3.685L343.783,297.622z" ; ? } ?.tool-bar-overflow-button:focused > .arrow { ?-fx-background-color: -fx-mark-highlight-color, derive(-fx-accent, -15%); ?-fx-background-insets: 1 0 -1 0, 0; ? } ?.tool-bar-overflow-button:hover > .arrow { ?-fx-background-color: -fx-mark-highlight-color, derive(-fx-hover-base, -35%); ?-fx-background-insets: 1 0 -1 0, 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Slider ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.slider .thumb { ?-fx-background-color: ??linear-gradient(to bottom, derive(-fx-text-box-border, -20%), derive(-fx-text-box-border, -30%)), ?-fx-inner-border, ?-fx-body-color; ?-fx-background-insets: 0, 1, 2; ?-fx-background-radius: 1.0em; /* makes sure this remains circular */ ?-fx-padding: 0.583333em; ?/* 7 */ ?-fx-effect: dropshadow(two-pass-box , rgba(0, 0, 0, 0.1), 5, 0.0 , 0, 2); ? } ? .slider:focused .thumb { ?-fx-background-radius: 1.0em; /* makes sure this remains circular */ ? } ? .slider .track { ?-fx-background-color: ??-fx-shadow-highlight-color, ?linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border), ?linear-gradient(to bottom, ??derive(-fx-control-inner-background, -9%), ?derive(-fx-control-inner-background, 0%), ?derive(-fx-control-inner-background, -5%), ?derive(-fx-control-inner-background, -12%) ?); ?-fx-background-insets: 0 0 -1 0, 0, 1; ?-fx-background-radius: 0.25em, 0.25em, 0.166667em; /* 3 3 2 */ ?-fx-padding: 0.25em; /* 3 */ ? } ? .slider:vertical .track { ?-fx-background-color: ??-fx-shadow-highlight-color, ?-fx-text-box-border, ?linear-gradient(to right, ??derive(-fx-control-inner-background, -9%), ?-fx-control-inner-background, ?derive(-fx-control-inner-background, -9%) ?); ? } ? .slider .axis { ?-fx-tick-label-fill: derive(-fx-text-background-color, 30%); ?-fx-tick-length: 5px; ?-fx-minor-tick-length: 3px; ?-fx-border-color: null; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ScrollBar ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.scroll-bar:horizontal { ?-fx-background-color: derive(-fx-box-border,30%), linear-gradient(to bottom, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)); ?-fx-background-insets: 0, 1 0 1 0; ? } ? .scroll-bar:vertical { ?-fx-background-color: derive(-fx-box-border,30%), linear-gradient(to right, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)); ?-fx-background-insets: 0, 0 1 0 1; ? } ? .scroll-bar:focused { ?-fx-background-color: ??-fx-focus-color, ?linear-gradient(to bottom, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)), ?-fx-faint-focus-color, ?linear-gradient(to bottom, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)); ?-fx-background-insets: -0.2, 1, -1.4, 2.6; ? } ? .scroll-bar:vertical:focused { ?-fx-background-color: ??-fx-focus-color, ?linear-gradient(to right, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)), ?-fx-faint-focus-color, ?linear-gradient(to right, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)); ? } ? .scroll-bar > .thumb { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ??/*-fx-background-insets: 1, 2, 3;*/ ?-fx-background-insets: 2, 3, 4; ?/*-fx-background-radius: 0.416667em, 0.333333em, 0.25em; *//* 5, 4,3 */ ?-fx-background-radius: 3, 2, 1; ? } ? .scroll-bar:vertical > .thumb { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color-to-right; ?? } ? .scroll-bar > .increment-button, ?? .scroll-bar > .decrement-button { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ? ? ??-fx-color: transparent; ?-fx-padding: 0.25em; /* 3px */ ? } ? .scroll-bar:horizontal > .increment-button, ? .scroll-bar:horizontal > .decrement-button { ?-fx-background-insets: 2 1 2 1, 3 2 3 2, 4 3 4 3; ? } ? .scroll-bar:vertical > .increment-button, ? .scroll-bar:vertical > .decrement-button { ?-fx-background-insets: 1 2 1 2, 2 3 2 3, 3 4 3 4; ? } ? .scroll-bar > .increment-button > .increment-arrow, ? .scroll-bar > .decrement-button > .decrement-arrow { ?-fx-background-color: -fx-mark-highlight-color,derive(-fx-base,-45%); ? } ? .scroll-bar > .increment-button:hover > .increment-arrow, ? .scroll-bar > .decrement-button:hover > .decrement-arrow { ?-fx-background-color: -fx-mark-highlight-color,derive(-fx-base,-50%); ? } ? .scroll-bar > .increment-button:pressed > .increment-arrow, ? .scroll-bar > .decrement-button:pressed > .decrement-arrow { ?-fx-background-color: -fx-mark-highlight-color,derive(-fx-base,-55%); ? } ? .scroll-bar:horizontal > .decrement-button > .decrement-arrow { ?-fx-padding: 0.333em 0.167em 0.333em 0.167em; /* 4 2 4 2 */ ?-fx-shape: "M5.997,5.072L5.995,6.501l-2.998-4l2.998-4l0.002,1.43l-1.976,2.57L5.997,5.072z"; ?-fx-effect: dropshadow(two-pass-box , -fx-shadow-highlight-color, 1, 0.0 , 0, 1.4); ?/*-fx-background-insets: 2 0 -2 0, 0;*/ ? } ? .scroll-bar:horizontal > .increment-button > .increment-arrow { ?-fx-padding: 0.333em 0.167em 0.333em 0.167em; /* 4 2 4 2 */ ?-fx-shape: "M2.998-0.07L3-1.499l2.998,4L3,6.501l-0.002-1.43l1.976-2.57L2.998-0.07z"; ?-fx-effect: dropshadow(two-pass-box , -fx-shadow-highlight-color, 1, 0.0 , 0, 1.4); ?/*-fx-background-insets: 2 0 -2 0, 0;*/ ? } ? .scroll-bar:vertical > .decrement-button > .decrement-arrow { ?-fx-padding: 0.167em 0.333em 0.167em 0.333em; /* 2 4 2 4 */ ?-fx-shape: "M1.929,4L0.5,3.998L4.5,1l4,2.998L7.07,4L4.5,2.024L1.929,4z"; ?-fx-effect: dropshadow(two-pass-box , -fx-shadow-highlight-color, 1, 0.0 , 0, 1.4); ?/*-fx-background-insets: 2 0 -2 0, 0;*/ ? } ? .scroll-bar:vertical > .increment-button > .increment-arrow { ?-fx-padding: 0.167em 0.333em 0.167em 0.333em; /* 2 4 2 4 */ ?-fx-shape: "M7.071,1L8.5,1.002L4.5,4l-4-2.998L1.93,1L4.5,2.976L7.071,1z"; ?-fx-effect: dropshadow(two-pass-box , -fx-shadow-highlight-color, 1, 0.0 , 0, 1.4); ?/*-fx-background-insets: 2 0 -2 0, 0;*/ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ScrollPane ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ? .scroll-pane > .viewport { ?-fx-background-color: -fx-background; ? } ? .scroll-pane > .scroll-bar:horizontal { ?-fx-background-insets: 0 1 1 1, 1; ?-fx-padding: 0 1 0 1; ? } ? .scroll-pane > .scroll-bar:horizontal > .increment-button, ? .scroll-pane > .scroll-bar:horizontal > .decrement-button { ?-fx-padding: 0.166667em 0.25em 0.25em ?0.25em; /* 2 3 3 3 */ ? } ? .scroll-pane > .scroll-bar:vertical > .increment-button, ? .scroll-pane > .scroll-bar:vertical > .decrement-button { ?-fx-padding: 0.25em 0.25em 0.25em 0.166667em; /* 3 3 3 2 */ ? } ? .scroll-pane > .scroll-bar:vertical { ?-fx-background-insets: 1 1 1 0, 1; ?-fx-padding: 1 0 1 0; ? } ? .scroll-pane > .corner { ?-fx-background-color: derive(-fx-base,-1%); ?-fx-background-insets: 0 1 1 0; ? } ? /* new styleclass for edge to edge scrollpanes that don't want to draw a border */ ? .scroll-pane.edge-to-edge, ? .tab-pane > * > .scroll-pane { ?-fx-background-color: -fx-background; ?-fx-background-insets: 0; ?-fx-padding: 0; ? } ? .scroll-pane.edge-to-edge > .scroll-bar, ? .tab-pane > * > .scroll-pane > .scroll-bar, ? .titled-pane > * > * > .scroll-pane > .scroll-bar { ?-fx-background-insets: 0; ?-fx-padding: 0; ? } ? .scroll-pane.edge-to-edge > .scroll-bar > .increment-button, ?? .scroll-pane.edge-to-edge > .scroll-bar > .decrement-button, ? .tab-pane > * > .scroll-pane > .scroll-bar > .increment-button, ?? .tab-pane > * > .scroll-pane > .scroll-bar > .decrement-button, ? .titled-pane > * > * > .scroll-pane > .scroll-bar > .increment-button, ? .titled-pane > * > * > .scroll-pane > .scroll-bar > .decrement-button { ?-fx-padding: 0.25em; /* 3px */ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Separator ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.separator:horizontal .line { ?-fx-border-color: -fx-text-box-border transparent transparent transparent, ?-fx-shadow-highlight-color transparent transparent transparent; ?-fx-border-insets: 0, 1 0 0 0; ? } ? .separator:vertical .line { ?-fx-border-color: transparent transparent transparent -fx-shadow-highlight-color, ?transparent transparent transparent -fx-text-box-border; ?-fx-border-width: 3, 1; ?-fx-border-insets: 0, 0 0 0 1; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ProgressBar ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.progress-bar { ?-fx-indeterminate-bar-length: 60; ?-fx-indeterminate-bar-escape: true; ?-fx-indeterminate-bar-flip: true; ?-fx-indeterminate-bar-animation-time: 2; ? } ? .progress-bar > .bar { ?-fx-background-color: linear-gradient(to bottom, derive(-fx-accent, -7%), derive(-fx-accent, 0%), derive(-fx-accent, -3%), derive(-fx-accent, -9%) ); ?-fx-background-insets: 3 3 4 3; ?/*-fx-background-radius: 0.583em; *//* 7 */ ?-fx-background-radius: 2; ?-fx-padding: 0.75em; ? } ? .progress-bar:indeterminate > .bar { ?-fx-background-color: linear-gradient(to left, transparent, -fx-accent); ? } ? .progress-bar > .track { ?-fx-background-color: ??-fx-shadow-highlight-color, ?linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border), ?linear-gradient(to bottom, ??derive(-fx-control-inner-background, -7%), ?derive(-fx-control-inner-background, 0%), ?derive(-fx-control-inner-background, -3%), ?derive(-fx-control-inner-background, -9%) ?); ?-fx-background-insets: 0, 0 0 1 0, 1 1 2 1; ?-fx-background-radius: 4, 3, 2; /* 10, 9, 8 */ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ProgressIndicator ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.progress-indicator { ?-fx-indeterminate-segment-count: 12; ?-fx-spin-enabled: true; ? } ? .progress-indicator > .determinate-indicator > .indicator { ?-fx-background-color: -fx-box-border, ?radial-gradient(center 50% 50%, radius 50%, -fx-control-inner-background 70%, derive(-fx-control-inner-background, -9%) 100%), ??-fx-control-inner-background; ?-fx-background-insets: 0, 1, 5 2 1 2; ?-fx-padding: 0.166667em; /* 2px */ ? } ? .progress-indicator > .determinate-indicator > .progress { ?-fx-background-color: -fx-accent; ?-fx-padding: 0.083333em; /* 1px */ ? } ? .progress-indicator > .determinate-indicator > .tick { ?-fx-background-color: white; ?-fx-background-insets: 0; ?-fx-padding: 0.666667em; /* 8 */ ?-fx-shape: "M-0.25,6.083c0.843-0.758,4.583,4.833,5.75,4.833S14.5-1.5,15.917-0.917c1.292,0.532-8.75,17.083-10.5,17.083C3,16.167-1.083,6.833-0.25,6.083z"; ? } ? .progress-indicator > .percentage { ?-fx-font-size: 0.916667em; /* 11pt - 1 less than the default font */ ?-fx-fill: -fx-text-background-color; ? } ? .progress-indicator:indeterminate .segment { ?-fx-background-color: -fx-accent; ? } ? .progress-indicator:indeterminate .segment0 { ?-fx-shape:"M41.98 14.74 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment1 { ?-fx-shape:"M33.75 6.51 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment2 { ?-fx-shape:"M22.49 3.5 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment3 { ?-fx-shape:"M11.24 6.51 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment4 { ?-fx-shape:"M3.01 14.74 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment5 { ?-fx-shape:"M0.0 26.0 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment6 { ?-fx-shape:"M3.01 37.25 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment7 { ?-fx-shape:"M11.25 45.48 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment8 { ?-fx-shape:"M22.5 48.5 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment9 { ?-fx-shape:"M33.75 45.48 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment10 { ?-fx-shape:"M41.98 37.25 a3.5,3.5 0 1,1 0,1 Z"; ? } ? .progress-indicator:indeterminate .segment11 { ?-fx-shape:"M45.0 26.0 a3.5,3.5 0 1,1 0,1 Z"; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Text COMMON ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.text-input { ?-fx-text-fill: -fx-text-inner-color; ?-fx-highlight-fill: derive(-fx-control-inner-background,-20%); ?-fx-highlight-text-fill: -fx-text-inner-color; ?-fx-prompt-text-fill: derive(-fx-control-inner-background,-30%); ?-fx-background-color: linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border), ?linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background); ?-fx-background-insets: 0, 1; ?-fx-background-radius: 3, 2; ?-fx-cursor: text; ?-fx-padding: 0.333333em 0.583em 0.333333em 0.583em; /* 4 7 4 7 */ ? } ? .text-input:focused { ?-fx-highlight-fill: -fx-accent; ?-fx-highlight-text-fill: white; ?-fx-background-color: ??-fx-focus-color, ?-fx-control-inner-background, ?-fx-faint-focus-color, ?linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background); ?-fx-background-insets: -0.2, 1, -1.4, 3; ?-fx-background-radius: 3, 2, 4, 0; ?-fx-prompt-text-fill: transparent; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TextArea ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.text-area { ?-fx-padding: 0; ?-fx-cursor: default; ?-fx-background-color: linear-gradient(to bottom, derive(-fx-text-box-border, -10%), -fx-text-box-border), ?derive(-fx-base,-1%); ? } ? .text-area > .scroll-pane { ?-fx-background-color: null; ? } ? .text-area > .scroll-pane > .scroll-bar:horizontal { ?-fx-background-radius: 0 0 2 2; ? } ? .text-area > .scroll-pane > .scroll-bar:vertical { ?-fx-background-radius: 0 2 2 0; ? } ? .text-area > .scroll-pane > .corner { ?-fx-background-radius: 0 0 2 0; ? } ? .text-area .content { ?/*the is 1px less top and bottom than TextInput because of scrollpane border */ ?-fx-padding: 0.25em 0.583em 0.25em 0.583em; /* 3 7 3 7 */ ?-fx-cursor: text; ?-fx-background-color: ?linear-gradient(from 0px 0px to 0px 4px, derive(-fx-control-inner-background, -8%), -fx-control-inner-background); ?-fx-background-radius: 2; ? } ? .text-area:focused .content { ?-fx-background-color: ??-fx-control-inner-background, ?-fx-faint-focus-color, ?linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background); ?-fx-background-insets: 0, 0, 2; ?-fx-background-radius: 2, 1, 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* HTML Editor ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.html-editor-foreground { ?-fx-color-label-visible: false; ?-fx-color-rect-x: 1; ?-fx-color-rect-y: 1; ?-fx-color-rect-width: 4; ?-fx-color-rect-height: 3; ?-fx-graphic: url("HTMLEditor-Text-Color.png"); ? } ? .html-editor-background { ?-fx-color-label-visible: false; ?-fx-color-rect-x: 1; ?-fx-color-rect-y: 1; ?-fx-color-rect-width: 4; ?-fx-color-rect-height: 3; ?-fx-graphic: url("HTMLEditor-Background-Color.png"); ? } ? .color-picker.html-editor-foreground > .color-picker-label > .picker-color > .picker-color-rect, ? .color-picker.html-editor-background > .color-picker-label > .picker-color > .picker-color-rect { ?-fx-stroke: null; ? } ? .html-editor .button , ? .html-editor .toggle-button { ?-fx-padding: 0.333333em 0.416667em 0.333333em 0.416667em; /* 4 5 4 5 */ ? } ? .html-editor-cut { ?-fx-graphic: url("HTMLEditor-Cut.png"); ? } ? .html-editor-copy { ?-fx-graphic: url("HTMLEditor-Copy.png"); ? } ? .html-editor-paste { ?-fx-graphic: url("HTMLEditor-Paste.png"); ? } ? .html-editor-align-left { ?-fx-graphic: url("HTMLEditor-Left.png"); ? } ? .html-editor-align-center { ?-fx-graphic: url("HTMLEditor-Center.png"); ? } ? .html-editor-align-right { ?-fx-graphic: url("HTMLEditor-Right.png"); ? } ? .html-editor-align-justify { ?-fx-graphic: url("HTMLEditor-Justify.png"); ? } ? .html-editor-outdent { ?-fx-graphic: url("HTMLEditor-Outdent.png"); ? } ? .html-editor-indent { ?-fx-graphic: url("HTMLEditor-Indent.png"); ? } ? .html-editor-bullets { ?-fx-graphic: url("HTMLEditor-Bullets.png"); ? } ? .html-editor-numbers { ?-fx-graphic: url("HTMLEditor-Numbered.png"); ? } ? .html-editor-bold { ?-fx-graphic: url("HTMLEditor-Bold.png"); ? } ? .html-editor-italic { ?-fx-graphic: url("HTMLEditor-Italic.png"); ? } ? .html-editor-underline { ?-fx-graphic: url("HTMLEditor-Underline.png"); ? } ? .html-editor-strike { ?-fx-graphic: url("HTMLEditor-Strikethrough.png"); ? } ? .html-editor-hr { ?-fx-graphic: url("HTMLEditor-Break.png"); ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* PopupMenu ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.context-menu { ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-17%), ?derive(-fx-color,-30%) ?), ?-fx-control-inner-background; ?-fx-background-insets: 0, 1; ?-fx-padding: 0.333333em 0.083333em 0.333333em 0.083333em; /* 4 1 8 1 */ ?-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.2) , 12, 0.0 , 0 , 8 ); ? } ? .context-menu .separator:horizontal .line { ?-fx-border-color: -fx-box-border transparent transparent transparent; ?-fx-border-insets: 1 0 0 0; ? } ? .context-menu > .scroll-arrow { ?-fx-padding: 0.416667em 0.416667em 0.416667em 0.416667em; /* 5 */ ?-fx-background-color: transparent; ? } ? .context-menu > .scroll-arrow:hover { ?-fx-background: -fx-selection-bar; ?-fx-background-color: -fx-background; ?-fx-text-fill: -fx-text-background-color; ? } ? .context-menu:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-fill; ? } ??/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Menu ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.menu { ?-fx-background-color: transparent; ?-fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */ ? } ? .menu:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-fill; ? } ? .menu > .right-container > .arrow { ?-fx-padding: 0.458em 0.167em 0.458em 0.167em; /* 4.5 2 4.5 2 */ ?-fx-background-color: -fx-mark-color; ?-fx-shape: "M0,-4L4,0L0,4Z"; ?-fx-scale-shape: false; ? } ? .menu:focused > .right-container > .arrow { ?-fx-background-color: white; ? } ? .menu-up-arrow { ?-fx-padding: 0.666667em 0.416667em 0.0em 0.416667em; ?/* 8 5 0 5 */ ?-fx-background-color: derive(-fx-color,-2%); ?-fx-shape: "M0 1 L1 1 L.5 0 Z"; ?-fx-effect: innershadow( two-pass-box , rgba(0,0,0,0.6) , 4, 0.0 , 0 , 1 ); ? } ? .menu-down-arrow { ?-fx-background-color: derive(-fx-color,-2%); ?-fx-padding: 0.666667em 0.416667em 0.0em 0.416667em; ?/* 8 5 0 5 */ ?-fx-shape: "M0 0 L1 0 L.5 1 Z"; ?-fx-effect: innershadow( two-pass-box , rgba(0,0,0,0.6) , 4, 0.0 , 0 , 1 ); ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* MenuBar ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.menu-bar { ?-fx-padding: 0.0em 0.666667em 0.0em 0.666667em; /* 0 8 0 8 */ ?-fx-spacing: 0.166667em; /* 2 */ ?-fx-background-color: ?linear-gradient(to bottom, derive(-fx-base,75%) 0%, -fx-outer-border 90%), ?linear-gradient(to bottom, derive(-fx-base,46.9%) 2%, derive(-fx-base,-2.1%) 95%); ?-fx-background-insets: 0 0 0 0, 1 0 1 0; ?-fx-background-radius: 0, 0 ; ? } ? /* Show nothing for background of normal menu button in a menu bar */ ? .menu-bar > .container > .menu-button { ?-fx-background-radius: 0; ?-fx-background-color: transparent; ?-fx-background-insets: 0; ? } ? /* Change padding of menu buttons when in menu bar */ ? .menu-bar > .container > .menu-button > .label { ?-fx-padding: 0; ? } ? /* Hide the down arrow for a menu placed in a menubar */ ? .menu-bar > .container > .menu-button > .arrow-button > .arrow { ?-fx-padding: 0.167em 0 0.250em 0; /* 2 0 3 0 */ ?-fx-background-color: transparent; ?-fx-shape: null; ? } ? .menu-bar > .container > .menu > .arrow-button { ?-fx-padding: 0.500em 0 0.500em 0; /* 6 0 6 0 */ ? } ? .menu-bar > .container > .menu-button:hover, ? .menu-bar > .container > .menu-button:focused, ? .menu-bar > .container > .menu-button:showing { ?-fx-background: -fx-selection-bar; ?-fx-background-color: -fx-background; ? } ? .menu-bar > .container > .menu-button:hover > .label, ? .menu-bar > .container > .menu-button:focused > .label, ? .menu-bar > .container > .menu-button:showing ?> .label { ?-fx-text-fill: -fx-text-background-color; ? } ? .menu-bar:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-fill; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* MenuItem ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.menu-item { ?-fx-background-color: transparent; ?-fx-padding: 0.333333em 0.41777em 0.333333em 0.41777em; ?/* 4 5 4 5 */ ? } ? .menu-item > .left-container { ?-fx-padding: 0.458em 0.791em 0.458em 0.458em; ? } ? .menu-item > .graphic-container { ?-fx-padding: 0em 0.333em 0em 0em; ? } ? .menu-item >.label { ?-fx-padding: 0em 0.5em 0em 0em; ?-fx-text-fill: -fx-text-base-color; ? } ? .menu-item:focused { ?-fx-background: -fx-selection-bar; ?-fx-background-color: -fx-background; ?-fx-text-fill: ?-fx-text-background-color; ? } ? .menu-item:focused > .label { ?-fx-text-fill: white; ? } ? .menu-item > .right-container { ?-fx-padding: 0em 0em 0em 0.5em; ? } ? .menu-item:show-mnemonics > .mnemonic-underline { ?-fx-stroke: -fx-text-fill; ? } ?? .radio-menu-item:checked > .left-container > .radio { ?-fx-background-color: -fx-mark-color; ?-fx-shape: "M0,5H2L4,8L8,0H10L5,10H3Z"; ?-fx-scale-shape: false; ? } ? .radio-menu-item:focused:checked > .left-container > .radio { ?-fx-background-color: white; ? } ? .check-menu-item:checked > .left-container > .check { ?-fx-background-color: -fx-mark-color; ?-fx-shape: "M0,5H2L4,8L8,0H10L5,10H3Z"; ?-fx-scale-shape: false; ? } ? .check-menu-item:focused:checked > .left-container > .check { ?-fx-background-color: white; ? } ? /*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ChoiceBox ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?/*.choice-box > .open-button > .arrow {?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color;?-fx-background-insets: 1 0 -1 0, 0;?-fx-padding: 0.166667em 0.333333em 0.166667em 0.333333em; ?2 3.5 2 3.5 ?-fx-shape: "M 0 0 h 7 l -3.5 4 z";? }*/ ? .choice-box > .context-menu { ?-fx-background-radius: 6, 5, 4; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TabPane ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tab-pane { ?-fx-tab-min-height: 1.8333em; /* 22 */ ?-fx-tab-max-height: 1.8333em; /* 22 */ ? } ? .tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-label { ?-fx-alignment: CENTER; ?-fx-text-fill: -fx-text-base-color; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab { ?-fx-background-insets: 0 1 1 0, 1 2 1 1, 2 3 1 2; ?-fx-background-radius: 3 3 0 0, 2 2 0 0, 1 1 0 0; ?-fx-padding: 0.083333em 0.5em 0.0769em 0.5em; /* 1 6 0.99 6 */ ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:top { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:right { ?-fx-background-color: -fx-outer-border, -fx-inner-border-bottomup, -fx-body-color-bottomup; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:bottom { ?-fx-background-color: -fx-outer-border, -fx-inner-border-bottomup, -fx-body-color-bottomup; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:left { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:hover { ?-fx-color: -fx-hover-base; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:selected { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-background; ?-fx-background-insets: 0 1 1 0, 1 2 0 1, 2 3 0 2; ? } ? .tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator { ?-fx-border-width: 1, 1; ?-fx-border-color: -fx-focus-color, -fx-faint-focus-color; ?-fx-border-insets: -4 -4 -6 -5, -2 -2 -5 -3; ?-fx-border-radius: 2, 1; /* looks sharper if outer border has a tighter radius (2 instead of 3) */ ? } ? .tab-pane:focused > .tab-header-area > .headers-region > .tab:bottom:selected .focus-indicator { ?-fx-border-insets: -6 -5 -4 -4, -5 -3 -2 -2; ? } ? .tab-pane > .tab-header-area > .headers-region > .tab:disabled:hover { ?-fx-color: -fx-base; ? } ? .tab-pane > .tab-header-area > .tab-header-background { ?/* TODO should not be using text-box-border I think? */ ?-fx-background-color: ? ?-fx-outer-border, ?-fx-text-box-border, ??linear-gradient(from 0px 0px to 0px 5px, -fx-text-box-border, derive(-fx-text-box-border, 30%)); ? } ? .tab-pane:top > .tab-header-area > .tab-header-background { ?-fx-background-insets: 0, 0 0 1 0, 1; ? } ? .tab-pane:bottom > .tab-header-area > .tab-header-background { ?-fx-background-insets: 0, 1 0 0 0, 1; ? } ? .tab-pane:left > .tab-header-area > .tab-header-background { ?-fx-background-insets: 0, 0 1 0 0, 1; ? } ? .tab-pane:right > .tab-header-area > .tab-header-background { ?-fx-background-insets: 0, 0 0 0 1, 1; ? } ? .tab-pane:top > .tab-header-area { ?/*-fx-padding: 0.416667em 0.166667em 0.0em 0.416667em; *//* 5 2 0 5 */ ?-fx-padding: 0.416667em 5 0.0em 0.416667em; /* 5 2 0 5 */ ? } ? .tab-pane:bottom > .tab-header-area { ?-fx-padding: 0 0.166667em 0.416667em 0.416667em; /* 0 2 5 5 */ ? } ? .tab-pane:left > .tab-header-area { ?-fx-padding: 0.416667em 0.0em 0.166667em 0.416667em; /* 5 0 2 5 */ ? } ? .tab-pane:right > .tab-header-area { ?-fx-padding: 0.416667em 0.416667em 0.166667em 0.0em; /* 5 5 2 0 */ ? } ? /* TODO: scaling the shape seems to make it way too large */ ? .tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-close-button { ?-fx-background-color: -fx-mark-color; ?-fx-shape: "M 0,0 H1 L 4,3 7,0 H8 V1 L 5,4 8,7 V8 H7 L 4,5 1,8 H0 V7 L 3,4 0,1 Z"; ?-fx-scale-shape: false; ?-fx-effect: dropshadow(two-pass-box , rgba(255, 255, 255, 0.4), 1, 0.0 , 0, 1); ? } ? .tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-close-button:hover { ?-fx-background-color: derive(-fx-mark-color, -30%); ? } ? /* CONTROL BUTTONS */ ? .tab-pane > .tab-header-area > .control-buttons-tab > .container { ?-fx-padding: 3 0 0 0; ?? } ? .tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: -1 0 5 0, 0 1 6 1, 1 2 7 2; ?-fx-padding: 4 4 9 4; ?-fx-background-radius: 10; ? } ? .tab-pane:bottom > .tab-header-area > .control-buttons-tab > .container > .tab-down-button { ?-fx-padding: -5 4 4 4; /* TODO convert to ems */ ? } ? /* FLOATING TABS CUSTOMISATION */ ? .tab-pane.floating > .tab-header-area > .tab-header-background { ?-fx-background-color: null; ? } ? .tab-pane.floating > .tab-header-area { ?-fx-background-color: null; ? } ? .tab-pane.floating > .tab-content-area { ?-fx-background-color: -fx-outer-border, -fx-background; ?-fx-background-insets: 0, 1; ?-fx-background-radius: 2, 0; ?-fx-padding: 2; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ComboBox ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?/* Customise the ListCell that appears in the ComboBox button itself */ ? .combo-box > .list-cell { ?-fx-background: transparent; ?-fx-background-color: transparent; ?-fx-text-fill: -fx-text-base-color; ?-fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */ ? } ? .combo-box-base > .arrow-button { ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0; ?-fx-padding: 0.5em 0.667em 0.5em 0.833333em; /* 6 8 6 10 */ ?-fx-background-color: transparent; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Editable ComboBox ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* The editable ComboBox TextBox inherits its properties from the TextBox ? ? ?*?* Control. Only the properties with values that are different from the ? ? ? ?*?* TextBox are specified here. ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.combo-box-base:editable > .arrow-button, ? .date-picker > .arrow-button { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 1 1 1 0, 1, 2; ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0; ? } ? .combo-box-base:editable > .text-field, ? .date-picker > .text-field { ?-fx-background-color: -fx-control-inner-background; ?-fx-background-insets: 1 0 1 1; ?-fx-background-radius: 2 0 0 2; ? } ? .combo-box-base:editable:contains-focus, ? .date-picker:contains-focus { ?-fx-background-color: -fx-focus-color; ?-fx-background-insets: -0.2; ?-fx-background-radius: 3; ? } ? .combo-box-base:editable:focused > .text-field, ? .combo-box-base:editable > .text-field:focused, ? .date-picker:focused > .text-field, ? .date-picker > .text-field:focused { ?-fx-background-color: ??-fx-control-inner-background, ?-fx-faint-focus-color, ?linear-gradient(from 0px 0px to 0px 5px, derive(-fx-control-inner-background, -9%), -fx-control-inner-background); ?-fx-background-insets: 1 0 1 1, 1 0 1 1, 3 2 3 3; ?-fx-background-radius: 2 0 0 2, 1 0 0 1, 0; ? } ? .combo-box-base:editable:contains-focus > .arrow-button, ? .date-picker:contains-focus > .arrow-button { ?-fx-background-color: -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ?-fx-background-insets: 1, 2, 1, 2.6; ?-fx-background-radius: 0 2 2 0, 0 1 1 0, 0 1 1 0, 0 1 1 0; ? } ?/* -------------- STYLES FOR THE DEFAULT LISTVIEW-BASED COMBOBOX ------------- */ ?.combo-box-popup > .list-view { ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-17%), ?derive(-fx-color,-30%) ?), ?-fx-control-inner-background; ?-fx-background-insets: 0, 1; ?-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.2) , 12, 0.0 , 0 , 8 ); ? } ? .combo-box-popup > .list-view > .virtual-flow > .clipped-container > .sheet > .list-cell { ?-fx-padding: 4 0 4 5; ?/* No alternate highlighting */ ?-fx-background: -fx-control-inner-background; ? } ? .combo-box-popup > .list-view > .virtual-flow > .clipped-container > .sheet > .list-cell:filled:selected { ?-fx-background: ?-fx-selection-bar-non-focused; ?-fx-background-color: ?-fx-background; ? } ? .combo-box-popup ?> .list-view > .virtual-flow > .clipped-container > .sheet > .list-cell:filled:hover, ? .combo-box-popup ?> .list-view > .virtual-flow > .clipped-container > .sheet > .list-cell:filled:selected:hover { ?-fx-background: -fx-accent; ?-fx-background-color: -fx-selection-bar; ? } ? .combo-box-popup > .list-view > .placeholder > .label { ?-fx-text-fill: derive(-fx-control-inner-background,-30%); ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TitledPane ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.titled-pane { ?-fx-text-fill: -fx-text-base-color; ? } ? .titled-pane > .title { ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-15%) 95%, ?derive(-fx-color,-25%) 100% ?), ?-fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 1, 2; ?-fx-background-radius: 3 3 0 0, 2 2 0 0, 1 1 0 0; ?-fx-padding: 0.3333em 0.75em 0.3333em 0.75em; /* 4 9 4 9 */ ? } ? /* alternative focus using the ring around the entire title area */ ? /*.titled-pane:focused > .title {?-fx-background-color: -fx-faint-focus-color, -fx-focus-color, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 0.7, 2, 3; ? ?? }*/ ? /* focus purely on the arrow */ ? .titled-pane:focused > .title > .arrow-button > .arrow { ?-fx-background-color: -fx-focus-color, -fx-mark-color; ?-fx-background-insets: -1, 0; ?-fx-effect: dropshadow(two-pass-box , -fx-focus-color, 5, 0.2 , 0, 0); ? } ? .titled-pane > .title > .arrow-button { ?-fx-background-color: null; ?-fx-background-insets: 0; ?-fx-background-radius: 0; ?-fx-padding: 0.0em 0.583em 0.0em 0.0em; /* 0 7 0 0 */ ? } ? .titled-pane > .title > .arrow-button > .arrow { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.25em 0.3125em 0.25em 0.3125em; /* 3 3.75 3 3.75 */ ?-fx-shape: "M 0 0 h 7 l -3.5 4 z"; ? } ? .titled-pane > .title:hover { ?-fx-color: -fx-hover-base; ? } ? /* alternative content using a border and a grad to transparent background - why should TitledPane content have a colour? */ ? .titled-pane > *.content { ?-fx-border-color: -fx-box-border; ?-fx-border-insets: -1 0 0 0; ?-fx-background-color: linear-gradient(from 0px 0px to 0px 5px, derive(-fx-background, -6%), -fx-background); ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Accordion ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.accordion > .titled-pane > .title { ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-15%) 95%, ?derive(-fx-color,-25%) 100% ?), ?-fx-inner-border, ?-fx-body-color; ?-fx-background-insets: -1 0 0 0, 0 1 1 1, 1 2 2 2; ?-fx-background-radius: 0, 0, 0; ? } ? .accordion > .first-titled-pane > .title { ?-fx-background-insets: 0, 1, 2; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* SplitPane ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.split-pane > .split-pane-divider { ?-fx-padding: 0 0.25em 0 0.25em; /* 0 3 0 3 */ ? } ? /* horizontal the two nodes are placed to the left/right of each other. */ ? .split-pane:horizontal > .split-pane-divider { ?-fx-background-color: -fx-box-border, -fx-inner-border-horizontal; ?-fx-background-insets: 0, 0 1 0 1; ? } ? /* vertical the two nodes are placed on top of each other. */ ? .split-pane:vertical > .split-pane-divider { ?-fx-background-color: -fx-box-border, -fx-inner-border; ?-fx-background-insets: 0, 1 0 1 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ColorPicker ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.color-picker > .arrow-button { ?-fx-background-color: null; ?-fx-padding: 0.5em 0.667em 0.5em 0; /* ?6 8 6 0 */ ? } ? .color-picker.split-button > .arrow-button ?{ ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 1 1 1 0, 1, 2; ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0; ? } ? .color-picker.split-button:focused > .arrow-button { ?/*-fx-background-color: -fx-focus-color, -fx-inner-border, -fx-body-color !important;*/ ?/*-fx-background-insets: 0, 1, 2;*/ ?-fx-background-color: -fx-focus-color, -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ?-fx-background-insets: 1 1 1 0, 1, 2, 1, 2.6; ?-fx-background-radius: 0 3 3 0, 0 2 2 0, 0 1 1 0, 0 1 1 0, 0 1 1 0; ? } ? .color-picker.split-button > .color-picker-label, ? .color-picker.split-button:focused > .color-picker-label{ ?-fx-background-color: null; ? } ? .color-picker.split-button > .arrow-button { ?/*-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color !important;*/ ?-fx-padding: 0.5em 0.667em 0.5em 0.667em; /* 6 8 6 8 */ ? } ? .color-picker > .color-picker-label > .picker-color > .picker-color-rect { ?-fx-stroke: -fx-box-border; ? } ?.color-palette { ?-fx-spacing: 0.833333em; /* 10px */ ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-17%), ?derive(-fx-color,-30%) ?), ?linear-gradient(to bottom, ??derive(-fx-background,10%) 0%, ??derive(-fx-background,-5%) 12%, ??derive(-fx-background,15%) 88%, ??derive(-fx-background,-10%) 100%); ?-fx-background-insets: 0, 1; ?-fx-background-radius: 6, 5; ?-fx-padding: 1em; /* 12 */ ?-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.2) , 12, 0.0 , 0 , 8 ); ? } ? .color-palette > .color-picker-grid { ?-fx-padding: 0.5px; ?-fx-snap-to-pixel: false; ? } ? .color-palette > .color-picker-grid > .color-square { ?-fx-background-color: transparent; ?-fx-padding: 0.5px; ? } ? /* the color over which the user is hovering */ ? .color-palette > .color-picker-grid > .color-square:focused, ?? .color-palette > .color-picker-grid > .color-square:selected:focused { ?-fx-background-color: -fx-faint-focus-color, -fx-focus-color; ?-fx-background-insets: -2,0; ?-fx-background-radius: 5,0; ?-fx-scale-x: 1.5; ?-fx-scale-y: 1.5; ? } ? /* the currently selected color */ ? .color-palette > .color-picker-grid > .color-square:selected { ?-fx-background-color: black; ? } ?? /* ------- CUSTOM COLOR DIALOG ------- */ ? .custom-color-dialog > .color-rect-pane { ?-fx-spacing: 0.75em; ?-fx-pref-height: 16.666667em; ?-fx-alignment: top-left; ?-fx-fill-height: true; ? } ?.custom-color-dialog .color-rect-pane .color-rect { ?-fx-min-width: 16.666667em; ?-fx-min-height: 16.666667em; ? } ?.custom-color-dialog .color-rect-pane .color-rect-border { ?-fx-border-color: derive(-fx-base, -20%); ? } ?.custom-color-dialog > .color-rect-pane #color-rect-indicator { ?-fx-background-color: null; ?-fx-border-color: white; ?-fx-border-radius: 0.4166667em; ?-fx-translate-x: -0.4166667em; ?-fx-translate-y: -0.4166667em; ?-fx-pref-width: 0.833333em; ?-fx-pref-height: 0.833333em; ?-fx-effect: dropshadow(three-pass-box, black, 2, 0.0, 0, 1); ? } ?.custom-color-dialog > .color-rect-pane > .color-bar { ?-fx-min-width: 1.666667em; ?-fx-min-height: 16.666667em; ?-fx-max-width: 1.666667em; ?-fx-border-color: derive(-fx-base, -20%); ? } ?.custom-color-dialog > .color-rect-pane > .color-bar > #color-bar-indicator { ?-fx-border-radius: 0.333333em; ?-fx-border-color: white; ?-fx-effect: dropshadow(three-pass-box, black, 2, 0.0, 0, 1); ?-fx-pref-width: 2em; ?-fx-pref-height: 0.833333em; ?-fx-translate-x: -0.1666667em; ?-fx-translate-y: -0.4166667em; ? } ?.custom-color-dialog ?{ ?-fx-background-color: -fx-background; ?-fx-padding: 1.25em; ?-fx-spacing: 1.25em; ? } ? .custom-color-dialog .controls-pane .current-new-color-grid #current-new-color-border { ?-fx-border-color: derive(-fx-base, -20%); ?-fx-border-width: 2px; ? } ?.custom-color-dialog .controls-pane .current-new-color-grid .color-rect { ?-fx-min-width: 10.666667em; ?-fx-min-height: 1.75em; ?-fx-pref-width: 10.666667em; ?-fx-pref-height: 1.75em; ? } ?.custom-color-dialog .transparent-pattern { ?-fx-background-image: url("pattern-transparent.png"); ??-fx-background-repeat: repeat; ?-fx-background-size: auto; ? } ?.custom-color-dialog .controls-pane #spacer1 { ?-fx-min-height: 0.1666667em; ?-fx-max-height: 0.1666667em; ?-fx-pref-height: 0.1666667em; ? } ?.custom-color-dialog .controls-pane #spacer2 { ?-fx-min-height: 1em; ?-fx-max-height: 1em; ?-fx-pref-height: 1em; ? } ?.custom-color-dialog .controls-pane #settings-pane { ?-fx-hgap: 0.4166667em; ?-fx-vgap: 0.3333333em; ? } ?.custom-color-dialog .controls-pane #settings-pane .settings-label { ?-fx-min-width: 5.75em; ? } ?.custom-color-dialog .controls-pane #settings-pane .settings-unit { ?-fx-max-width: 1em; ? } ?.custom-color-dialog .controls-pane #settings-pane .slider { ?-fx-pref-width: 8.25em; ? } ?.custom-color-dialog .controls-pane .color-input-field { ?-fx-pref-column-count: 3; ?-fx-max-width: 3.25em; ?-fx-min-width: 3.25em; ?-fx-pref-width: 3.25em; ? } ?.custom-color-dialog .controls-pane .web-field { ?-fx-pref-column-count: 6; ?-fx-pref-width: 8.25em; ? } ?.custom-color-dialog .controls-pane #spacer-side { ?-fx-min-width: 0.5em; ?-fx-pref-width: 0.5em; ? } ?.custom-color-dialog .controls-pane #spacer-bottom { ?-fx-pref-height: 0.833333em; ?-fx-min-height: 0.833333em; ? } ?.custom-color-dialog .controls-pane .customcolor-controls-background { ?-fx-background-color: -fx-text-box-border, -fx-control-inner-background; ?-fx-background-insets: ??0.8333333em 0 0.4166667em 0, ?1em 0.166667em 0.5833333em 0.166667em; ?-fx-background-radius: 0.3333333em, 0.166667em; ? } ?.custom-color-dialog .controls-pane .current-new-color-grid .label { ?-fx-padding: 0 0 0 0.4166667em; ? } ?.custom-color-dialog .controls-pane #buttons-hbox { ?-fx-spacing: 0.333333em; ?-fx-padding: 1em 0 0 0; ?-fx-alignment: bottom-right; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Pagination ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.pagination { ?-fx-padding: 0; ? ? ? ? ?-fx-arrows-visible: true; ?-fx-tooltip-visible: true; ?-fx-page-information-visible: true; ?-fx-page-information-alignment: bottom; ?-fx-arrow-button-gap: 0; ? } ? .pagination > .page { ?-fx-background-color: transparent; ? } ? .pagination > .pagination-control { ?-fx-background-color: transparent; ?-fx-font-size: 0.82em; ? } ? .pagination > .pagination-control > .control-box { ?-fx-padding: 5px 0 0 0; ?-fx-spacing: 2; ?-fx-alignment: center; ? } ? .pagination > .pagination-control > .control-box > .left-arrow-button { ?-fx-background-radius: 3 0 0 3, 3 0 0 3, 2 0 0 2, 1 0 0 1; ?-fx-background-insets: 0 0 -1 5, 0 0 0 5, 1 1 1 6, 2 2 2 7; ?-fx-padding: 0em 0.417em 0em 0.833em; /* 0 5 0 10 */ ? } ? .pagination > .pagination-control > .control-box > .right-arrow-button { ?-fx-background-radius: 0 3 3 0, 0 3 3 0, 0 2 2 0, 0 1 1 0; ?-fx-background-insets: 0 5 -1 0, 0 5 0 0, 1 6 1 1, 2 7 2 2; ?-fx-padding: 0em 0.75em 0em 0.417em; /* 0 9 0 5 */ ? } ? .pagination > .pagination-control .left-arrow { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.375em 0.291em 0.375em 0.291em; ?-fx-shape: "M 0 0 L -13 7 L 0 13 z"; ?-fx-scale-shape: true; ? } ? .pagination > .pagination-control .right-arrow { ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.375em 0.291em 0.375em 0.291em; ?-fx-shape: "M 0 0 L 13 7 L 0 13 z"; ?-fx-scale-shape: true; ? } ? .pagination > .pagination-control > .control-box > .bullet-button { ? ??-fx-background-radius: 0, 4em, 4em, 4em, 4em; ?-fx-padding: 0.333em; ?-fx-background-color: transparent, -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 5, ?6, ?7; ? } ? .pagination > .pagination-control > .control-box > .bullet-button:selected { ? ??-fx-base: -fx-accent; ? } ? .pagination.bullet > .pagination-control > .control-box { ?-fx-spacing: 0; ?-fx-alignment: center; ? } ? .pagination.bullet > .pagination-control > .control-box > .left-arrow-button { ?-fx-background-radius: 4em; ?-fx-background-insets: 0, 1, 2; ?-fx-padding: 0em 0.25em 0em 0.083em; /* 0 3 0 1 */ ? } ?? .pagination.bullet > .pagination-control > .control-box > .right-arrow-button { ?-fx-background-radius: 4em; ?-fx-background-insets: 0, 1, 2; ?-fx-padding: 0em 0.083em 0em 0.25em; /* 0 1 0 3 */ ? } ? .pagination > .pagination-control > .control-box > .number-button { ?-fx-background-radius: 0; ?-fx-padding: 0.166667em 0.25em 0.25em 0.333em; ?-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color; ? } ? .pagination > .pagination-control > .control-box > .number-button:selected { ? ??-fx-base: -fx-accent; ? } ? .pagination > .pagination-control > .page-information { ? ??-fx-padding: 0.416em 0 0 0; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Customised CSS for controls placed directly within cells ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.cell > .choice-box { ?-fx-background-color: transparent; ?-fx-background-insets: 0; ?-fx-background-radius: 0; ?-fx-padding: 0.0em 0.5em 0.0em 0.0em; /* 0 6 0 0 */ ?-fx-alignment: CENTER_LEFT; ?-fx-content-display: LEFT; ? } ? .cell > .choice-box > .label { ?-fx-padding: 0em 0.333333em 0.0em 0.333333; /* 2 4 3 6 */ ? } ? .cell:focused:selected > .choice-box > .label { ?-fx-text-fill: white; ? } ? .cell:focused:selected > .choice-box > .open-button > .arrow { ?-fx-background-color: -fx-mark-highlight-color, white; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* List, Tree, Table COMMON ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?/* remove double borders from scrollbars */ ? .list-view > .virtual-flow > .scroll-bar:vertical, ? .tree-view > .virtual-flow > .scroll-bar:vertical, ? .table-view > .virtual-flow > .scroll-bar:vertical, ? .tree-table-view > .virtual-flow > .scroll-bar:vertical { ?-fx-background-insets: 0, 0 0 0 1; ?-fx-padding: -1 -1 -1 0; ? } ? .list-view > .virtual-flow > .scroll-bar:horizontal, ? .tree-view > .virtual-flow > .scroll-bar:horizontal, ? .table-view > .virtual-flow > .scroll-bar:horizontal, ? .tree-table-view > .virtual-flow > .scroll-bar:horizontal { ?-fx-background-insets: 0, 1 0 0 0; ?-fx-padding: 0 -1 -1 -1; ? } ? .list-view > .virtual-flow > .corner, ? .tree-view > .virtual-flow > .corner, ? .table-view > .virtual-flow > .corner, ? .tree-table-view > .virtual-flow > .corner { ?-fx-background-color: derive(-fx-base,-1%); ? } ? /* standard cell */ ? .list-cell, ? .tree-cell { ?-fx-background: -fx-control-inner-background; ?-fx-background-color: -fx-background; ?-fx-text-fill: -fx-text-background-color; ? } ? /* Selected rows */ ? .list-view:focused > .virtual-flow > .clipped-container > .sheet > .list-cell:filled:selected, ? .tree-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-cell:filled:selected, ? .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell:filled:selected, ? .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell:filled:selected, ? .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell .table-cell:selected, ? .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell .tree-table-cell:selected { ?-fx-background: -fx-selection-bar; ?-fx-table-cell-border-color: derive(-fx-selection-bar, 20%); ? } ? /* Selected when control is not focused */ ? .list-cell:filled:selected, ? .tree-cell:filled:selected, ? .table-row-cell:filled:selected, ? .tree-table-row-cell:filled:selected, ? .table-row-cell:filled > .table-cell:selected, ? .tree-table-row-cell:filled > .tree-table-cell:selected { ?-fx-background: -fx-selection-bar-non-focused; ?-fx-table-cell-border-color: derive(-fx-selection-bar-non-focused, 20%); ? } ? /* focused cell (keyboard navigation) */ ? .list-view:focused > .virtual-flow > .clipped-container > .sheet > .list-cell:focused, ? .tree-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-cell:focused, ? .table-view:focused:row-selection > .virtual-flow > .clipped-container > .sheet > .table-row-cell:focused, ? .tree-table-view:focused:row-selection > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell:focused, ? .table-view:focused:cell-selection > .virtual-flow > .clipped-container > .sheet > .table-row-cell > .table-cell:focused, ? .tree-table-view:focused:cell-selection > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell > .tree-table-cell:focused { ?-fx-background-color: -fx-background, -fx-cell-focus-inner-border, -fx-background; ?-fx-background-insets: 0, 1, 2; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ListView and ListCell ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.list-cell { ?-fx-padding: 0.25em 0.583em 0.25em 0.583em; /* 3 7 3 7 */ ? } ? .list-cell:odd { ?-fx-background: -fx-control-inner-background-alt; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TreeView and TreeCell ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tree-cell { ?-fx-padding: 0.25em; /* 3 */ ?-fx-indent: 1em; ? } ? .tree-cell .label { ?-fx-padding: 0.0em 0.0em 0.0em 0.25em; /* 0 0 0 3 */ ? } ? .tree-cell > .tree-disclosure-node, ? .tree-table-row-cell > .tree-disclosure-node { ?-fx-padding: 4 6 4 8; ?-fx-background-color: transparent; ? } ? .tree-cell > .tree-disclosure-node > .arrow, ? .tree-table-row-cell > .tree-disclosure-node > .arrow { ?-fx-background-color: -fx-text-background-color; ?-fx-padding: 0.333333em 0.229em 0.333333em 0.229em; /* 4 */ ?-fx-shape: "M 0 -3.5 L 4 0 L 0 3.5 z"; ? } ? .tree-cell:expanded > .tree-disclosure-node > .arrow, ? .tree-table-row-cell:expanded > .tree-disclosure-node > .arrow { ?-fx-rotate: 90; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TableView ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.table-view, ? .tree-table-view { ?/* Constants used throughout the tableview. */ ?-fx-table-header-border-color: -fx-box-border; ?-fx-table-cell-border-color: derive(-fx-color,5%); ? } ? /***** ROW CELLS **************************************************************/ ? /* Each row in the table is a table-row-cell. Inside a table-row-cell is any?number of table-cell. */ ? .table-row-cell { ?-fx-background: -fx-control-inner-background; ?-fx-background-color: -fx-table-cell-border-color, -fx-background; ?-fx-background-insets: 0, 0 0 1 0; ?-fx-padding: 0; ?-fx-text-fill: -fx-text-background-color; ? } ? .table-row-cell:odd { ?-fx-background: -fx-control-inner-background-alt; ? } ? /***** INDIVIDUAL CELLS ********************************************************/ ? .table-cell { ?-fx-padding: 0.166667em; /* 2px, plus border adds 1px */ ?-fx-background-color: null; ?-fx-border-color: transparent -fx-table-cell-border-color transparent transparent; ?-fx-cell-size: 2.0em; /* 24 */ ?-fx-text-fill: -fx-text-background-color; ? } ? .table-view > .virtual-flow > .clipped-container > .sheet > .table-row-cell .table-cell:selected, ? .tree-table-view > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell .tree-table-cell:selected { ?-fx-background-color: -fx-table-cell-border-color, -fx-background; ?-fx-background-insets: 0, 0 0 1 0; ? } ? /* When in constrained resize mode, the right-most visible cell should not have?a right-border, as it is not possible to get this cleanly out of view without?introducing horizontal scrollbars (see RT-14886). */ ? .table-view:constrained-resize > .virtual-flow > .clipped-container > .sheet > .table-row-cell > .table-cell:last-visible, ? .tree-table-view:constrained-resize > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell > .tree-table-cell:last-visible { ?-fx-border-color: transparent; ? } ? /***** HEADER **********************************************************************/ ? /* The column-resize-line is shown when the user is attempting to resize a column. */ ? .table-view .column-resize-line, ? .tree-table-view .column-resize-line { ?-fx-background: -fx-accent; ?-fx-background-color: -fx-background; ?-fx-padding: 0.0em 0.0416667em 0.0em 0.0416667em; /* 0 0.571429 0 0.571429 */ ? } ? /* This is the area behind the column headers. An ideal place to specify background?and border colors for the whole area (not individual column-header's). */ ? .table-view .column-header-background, ? .tree-table-view > .column-header-background { ?-fx-background-color: -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 1; ? } ? /* The column header row is made up of a number of column-header, one for each?TableColumn, and a 'filler' area that extends from the right-most column?to the edge of the tableview, or up to the 'column control' button. */ ? .table-view .column-header, ? .tree-table-view .column-header, ? .table-view .filler, ? .tree-table-view .filler, ? .table-view > .column-header-background > .show-hide-columns-button, ? .tree-table-view > .column-header-background > .show-hide-columns-button, ? .table-view:constrained-resize .filler, ? .tree-table-view:constrained-resize .filler { ?-fx-background-color: -fx-box-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 0 1 1 0, 1 2 2 1; ?-fx-font-weight: bold; ?-fx-size: 2em; ?-fx-text-fill: -fx-selection-bar-text; ?-fx-padding: 0.166667em; ? } ? .table-view .filler, ? .tree-table-view .filler, ? .table-view:constrained-resize .filler, ? .tree-table-view:constrained-resize .filler { ?-fx-background-insets: 0, 0 0 1 0, 1 1 2 1; ? } ? .table-view > .column-header-background > .show-hide-columns-button, ? .tree-table-view > .column-header-background > .show-hide-columns-button { ?-fx-background-insets: 0, 0 0 1 1, 1 1 2 2; ? } ? .table-view .column-header .sort-order-dots-container, ? .tree-table-view .column-header .sort-order-dots-container{ ?-fx-padding: 2 0 2 0; ? } ? .table-view .column-header .sort-order, ? .tree-table-view .column-header .sort-order{ ?-fx-font-size: 0.916667em; /* 11pt - 1 less than the default font */ ? } ? .table-view .column-header .sort-order-dot, ? .tree-table-view .column-header .sort-order-dot { ?-fx-background-color: -fx-mark-color; ?-fx-padding: 0.115em; ?-fx-background-radius: 0.115em; ? } ? .table-view .column-header .label, ? .tree-table-view .column-header .label { ?-fx-alignment: center; ? } ?/* Plus Symbol */ ? .table-view .show-hide-column-image, ? .tree-table-view .show-hide-column-image { ?-fx-background-color: -fx-mark-color; ?-fx-padding: 0.25em; /* 3px */ ?-fx-shape: "M398.902,298.045c0.667,0,1.333,0,2,0c0,0.667,0,1.333,0,2c0.667,0,1.333,0,2,0c0,0.667,0,1.333,0,2c-0.667,0-1.333,0-2,0c0,0.666,0,1.332,0,1.999c-0.667,0-1.333,0-2,0c0-0.667,0-1.333,0-1.999c-0.666,0-1.333,0-1.999,0c0-0.667,0-1.334,0-2c0.666,0,1.333,0,1.999,0C398.902,299.378,398.902,298.711,398.902,298.045z"; ?? } ? /* When a column is being 'dragged' to be placed in a different position, there?is a region that follows along the column header area to indicate where the?column will be dropped. This region can be styled using the .column-drag-header?name. */ ? .table-view .column-drag-header, ? .tree-table-view .column-drag-header { ?-fx-background: -fx-accent; ?-fx-background-color: -fx-selection-bar; ?-fx-border-color: transparent; ?-fx-opacity: 0.6; ? } ? /* Semi-transparent overlay to indicate the column that is currently being moved */ ? .table-view .column-overlay, ? .tree-table-view .column-overlay { ?-fx-background-color: darkgray; ?-fx-opacity: 0.3; ? } ? /* Header Sort Arrows */ ? .table-view /*> column-header-background > nested-column-header >*/ .arrow, ? .tree-table-view /*> column-header-background > nested-column-header >*/ .arrow { ?-fx-background-color: -fx-mark-color; ?-fx-padding: 0.25em 0.3125em 0.25em 0.3125em; /* 3 3.75 3 3.75 */ ?-fx-shape: "M 0 0 h 7 l -3.5 4 z"; ? } ? /* This is shown when the table has no rows and/or no columns. */ ? .table-view .empty-table, ? .tree-table-view .empty-table { ?-fx-background-color: white; ?-fx-font-size: 1.166667em; /* 14pt - 2 more than the default font */ ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Table Cells ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.check-box-table-cell { ?-fx-alignment: center; ?-fx-padding: 0; ? } ? .check-box-table-cell > .check-box { ?-fx-font-size: 0.8em; ?-fx-opacity: 1; ?-fx-padding: 0 0 1 0; ? } ? .check-box-table-cell > .check-box > .box { ?-fx-background-color: -fx-outer-border, -fx-background; ?-fx-background-insets: 0,1; ? } ? .check-box-table-cell > .check-box:selected > .box > .mark { ?-fx-background-color: -fx-text-background-color; ?-fx-background-insets: 0; ? } ? .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell:filled > .check-box-table-cell:selected > .check-box > .box, ? .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell:filled > .check-box-table-cell:selected > .check-box > .box, ? .table-view:focused > .virtual-flow > .clipped-container > .sheet > .table-row-cell:filled:selected > .check-box-table-cell > .check-box > .box, ? .tree-table-view:focused > .virtual-flow > .clipped-container > .sheet > .tree-table-row-cell:filled:selected > .check-box-table-cell > .check-box > .box { ?-fx-background-color: derive(-fx-accent,40%), -fx-background; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* TreeTableView ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Note: A lot of the CSS for TreeTableView is included with the TreeView and ?*?* TableView CSS styles elsewhere in modena.css (as they are the same, just ? *?* targeting different CSS style classes). ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tree-table-row-cell { ?-fx-background: -fx-control-inner-background; ?-fx-background-color: -fx-background; ?-fx-padding: 0; ?-fx-text-fill: -fx-text-background-color; ?-fx-indent: 1em; ? } ? .tree-table-cell { ?/* tree-table-cell needs slightly different padding to make the text sit at?the right height for the arrow */ ?-fx-padding: 0.25em 0.166667em 0.083em 0.166667em; /* 3 2 1 2 , plus border adds 1px */ ?-fx-background-color: null; ?-fx-border-color: transparent -fx-table-cell-border-color transparent transparent; ?-fx-cell-size: 2.0em; /* 24 */ ?-fx-text-fill: -fx-text-background-color; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Tooltip ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tooltip { ?-fx-background: rgba(30,30,30); ?-fx-text-fill: white; ?-fx-background-color: rgba(30,30,30,0.8); ?-fx-background-radius: 6px; ?-fx-background-insets: 0; ?-fx-padding: 0.667em 0.75em 0.667em 0.75em; /* 10px */ ?-fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.5) , 10, 0.0 , 0 , 3 ); ?-fx-font-size: 0.85em; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Charts ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart { ?-fx-padding: 5px; ? } ? .chart-content { ?-fx-padding: 10px; ? } ? .chart-title { ?-fx-font-size: 1.4em; ? } ? .chart-legend { ?-fx-background-color: -fx-shadow-highlight-color, ?linear-gradient(to bottom, derive(-fx-background, -10%), derive(-fx-background, -5%)), ?linear-gradient(from 0px 0px to 0px 4px, derive(-fx-background, -4%), derive(-fx-background, 10%)); ?-fx-background-insets: 0 0 -1 0, 0,1; ?-fx-background-radius: 4,4,3; ?-fx-padding: 6px; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Axis ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.axis { ?AXIS_COLOR: derive(-fx-background,-20%); ?-fx-tick-label-font-size: 0.833333em; /* 10px */ ?-fx-tick-label-fill: derive(-fx-text-background-color, 30%); ? } ? .axis:top { ?-fx-border-color: transparent transparent AXIS_COLOR transparent; ? } ? .axis:right { ?-fx-border-color: transparent transparent transparent AXIS_COLOR; ? } ? .axis:bottom { ?-fx-border-color: AXIS_COLOR transparent transparent transparent; ? } ? .axis:left { ?-fx-border-color: transparent AXIS_COLOR transparent transparent; ? } ? .axis:top > .axis-label, ? .axis:left > .axis-label { ??-fx-padding: 0 0 4px 0; ?? } ? .axis:bottom > .axis-label, ? .axis:right > .axis-label { ??-fx-padding: 4px 0 0 0; ?? } ? .axis-tick-mark, ? .axis-minor-tick-mark { ?-fx-fill: null; ?-fx-stroke: AXIS_COLOR; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ChartPlot ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-vertical-grid-lines { ?-fx-stroke: derive(-fx-background,-10%); ?-fx-stroke-dash-array: 0.25em, 0.25em; ? } ? .chart-horizontal-grid-lines { ?-fx-stroke: derive(-fx-background,-10%); ?-fx-stroke-dash-array: 0.25em, 0.25em; ? } ? .chart-alternative-column-fill { ?-fx-fill: null; ?-fx-stroke: null; ? } ? .chart-alternative-row-fill { ?-fx-fill: null; ?-fx-stroke: null; ? } ? .chart-vertical-zero-line, ? .chart-horizontal-zero-line { ?-fx-stroke: derive(-fx-text-background-color, 40%); ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ScatterChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-symbol { /* solid circle */ ?-fx-background-color: CHART_COLOR_1; ?-fx-background-radius: 5px; ?-fx-padding: 5px; ? } ? .default-color1.chart-symbol { /* solid square */ ?-fx-background-color: CHART_COLOR_2; ?-fx-background-radius: 0; ? } ? .default-color2.chart-symbol { /* solid diamond */ ?-fx-background-color: CHART_COLOR_3; ?-fx-background-radius: 0; ?-fx-padding: 7px 5px 7px 5px; ?-fx-shape: "M5,0 L10,9 L5,18 L0,9 Z"; ? } ? .default-color3.chart-symbol { /* cross */ ?-fx-background-color: CHART_COLOR_4; ?-fx-background-radius: 0; ?-fx-background-insets: 0; ?-fx-shape: "M2,0 L5,4 L8,0 L10,0 L10,2 L6,5 L10,8 L10,10 L8,10 L5,6 L2,10 L0,10 L0,8 L4,5 L0,2 L0,0 Z"; ? } ? .default-color4.chart-symbol { /* solid triangle */ ?-fx-background-color: CHART_COLOR_5; ?-fx-background-radius: 0; ?-fx-background-insets: 0; ?-fx-shape: "M5,0 L10,8 L0,8 Z"; ? } ? .default-color5.chart-symbol { /* hollow circle */ ?-fx-background-color: CHART_COLOR_6, white; ?-fx-background-insets: 0, 2; ?-fx-background-radius: 5px; ?-fx-padding: 5px; ? } ? .default-color6.chart-symbol { /* hollow square */ ?-fx-background-color: CHART_COLOR_7, white; ?-fx-background-insets: 0, 2; ?-fx-background-radius: 0; ? } ? .default-color7.chart-symbol { /* hollow diamond */ ?-fx-background-color: CHART_COLOR_8, white; ?-fx-background-radius: 0; ?-fx-background-insets: 0, 2.5; ?-fx-padding: 7px 5px 7px 5px; ?-fx-shape: "M5,0 L10,9 L5,18 L0,9 Z"; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* LineChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-line-symbol { ?-fx-background-color: CHART_COLOR_1, white; ?-fx-background-insets: 0, 2; ?-fx-background-radius: 5px; ?-fx-padding: 5px; ? } ? .chart-series-line { ?-fx-stroke: CHART_COLOR_1; ?-fx-stroke-width: 3px; ? } ? .default-color0.chart-line-symbol { -fx-background-color: CHART_COLOR_1, white; } ? .default-color1.chart-line-symbol { -fx-background-color: CHART_COLOR_2, white; } ? .default-color2.chart-line-symbol { -fx-background-color: CHART_COLOR_3, white; } ? .default-color3.chart-line-symbol { -fx-background-color: CHART_COLOR_4, white; } ? .default-color4.chart-line-symbol { -fx-background-color: CHART_COLOR_5, white; } ? .default-color5.chart-line-symbol { -fx-background-color: CHART_COLOR_6, white; } ? .default-color6.chart-line-symbol { -fx-background-color: CHART_COLOR_7, white; } ? .default-color7.chart-line-symbol { -fx-background-color: CHART_COLOR_8, white; } ? .default-color0.chart-series-line { -fx-stroke: CHART_COLOR_1; } ? .default-color1.chart-series-line { -fx-stroke: CHART_COLOR_2; } ? .default-color2.chart-series-line { -fx-stroke: CHART_COLOR_3; } ? .default-color3.chart-series-line { -fx-stroke: CHART_COLOR_4; } ? .default-color4.chart-series-line { -fx-stroke: CHART_COLOR_5; } ? .default-color5.chart-series-line { -fx-stroke: CHART_COLOR_6; } ? .default-color6.chart-series-line { -fx-stroke: CHART_COLOR_7; } ? .default-color7.chart-series-line { -fx-stroke: CHART_COLOR_8; } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* AreaChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-area-symbol { ?-fx-background-color: CHART_COLOR_1, white; ?-fx-background-insets: 0, 1; ?-fx-background-radius: 4px; /* makes sure this remains circular */ ?-fx-padding: 3px; ? } ? .default-color0.chart-area-symbol { -fx-background-color: CHART_COLOR_1, white; } ? .default-color1.chart-area-symbol { -fx-background-color: CHART_COLOR_2, white; } ? .default-color2.chart-area-symbol { -fx-background-color: CHART_COLOR_3, white; } ? .default-color3.chart-area-symbol { -fx-background-color: CHART_COLOR_4, white; } ? .default-color4.chart-area-symbol { -fx-background-color: CHART_COLOR_5, white; } ? .default-color5.chart-area-symbol { -fx-background-color: CHART_COLOR_6, white; } ? .default-color6.chart-area-symbol { -fx-background-color: CHART_COLOR_7, white; } ? .default-color7.chart-area-symbol { -fx-background-color: CHART_COLOR_8, white; } ? .chart-series-area-line { ?-fx-stroke: CHART_COLOR_1; ?-fx-stroke-width: 1px; ? } ? .default-color0.chart-series-area-line { -fx-stroke: CHART_COLOR_1; } ? .default-color1.chart-series-area-line { -fx-stroke: CHART_COLOR_2; } ? .default-color2.chart-series-area-line { -fx-stroke: CHART_COLOR_3; } ? .default-color3.chart-series-area-line { -fx-stroke: CHART_COLOR_4; } ? .default-color4.chart-series-area-line { -fx-stroke: CHART_COLOR_5; } ? .default-color5.chart-series-area-line { -fx-stroke: CHART_COLOR_6; } ? .default-color6.chart-series-area-line { -fx-stroke: CHART_COLOR_7; } ? .default-color7.chart-series-area-line { -fx-stroke: CHART_COLOR_8; } ? .chart-series-area-fill { ?-fx-stroke: null; ?-fx-fill: CHART_COLOR_1_TRANS_20; ? } ? .default-color0.chart-series-area-fill { -fx-fill: CHART_COLOR_1_TRANS_20; } ? .default-color1.chart-series-area-fill { -fx-fill: CHART_COLOR_2_TRANS_20; } ? .default-color2.chart-series-area-fill { -fx-fill: CHART_COLOR_3_TRANS_20; } ? .default-color3.chart-series-area-fill { -fx-fill: CHART_COLOR_4_TRANS_20; } ? .default-color4.chart-series-area-fill { -fx-fill: CHART_COLOR_5_TRANS_20; } ? .default-color5.chart-series-area-fill { -fx-fill: CHART_COLOR_6_TRANS_20; } ? .default-color6.chart-series-area-fill { -fx-fill: CHART_COLOR_7_TRANS_20; } ? .default-color7.chart-series-area-fill { -fx-fill: CHART_COLOR_8_TRANS_20; } ? .area-legend-symbol { ?-fx-padding: 6px; ?-fx-background-radius: 6px; /* makes sure this remains circular */ ?-fx-background-insets: 0, 3; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* BubbleChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.bubble-legend-symbol { ?-fx-background-radius: 8px; ?-fx-padding: 8px; ? } ? .chart-bubble { ?-fx-bubble-fill: CHART_COLOR_1_TRANS_70; ?-fx-background-color: radial-gradient(center 50% 50%, radius 80%, derive(-fx-bubble-fill,20%), derive(-fx-bubble-fill,-30%)); ? } ? .default-color0.chart-bubble { -fx-bubble-fill: CHART_COLOR_1_TRANS_70; } ? .default-color1.chart-bubble { -fx-bubble-fill: CHART_COLOR_2_TRANS_70; } ? .default-color2.chart-bubble { -fx-bubble-fill: CHART_COLOR_3_TRANS_70; } ? .default-color3.chart-bubble { -fx-bubble-fill: CHART_COLOR_4_TRANS_70; } ? .default-color4.chart-bubble { -fx-bubble-fill: CHART_COLOR_5_TRANS_70; } ? .default-color5.chart-bubble { -fx-bubble-fill: CHART_COLOR_6_TRANS_70; } ? .default-color6.chart-bubble { -fx-bubble-fill: CHART_COLOR_7_TRANS_70; } ? .default-color7.chart-bubble { -fx-bubble-fill: CHART_COLOR_8_TRANS_70; } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* BarChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-bar { ?-fx-bar-fill: CHART_COLOR_1; ?-fx-background-color: ? linear-gradient(to right, ??derive(-fx-bar-fill, -4%), ?derive(-fx-bar-fill, -1%), ?derive(-fx-bar-fill, 0%), ?derive(-fx-bar-fill, -1%), ?derive(-fx-bar-fill, -6%) ?); ?-fx-background-insets: 0; ? } ? .chart-bar.negative { ?-fx-background-insets: 1 0 0 0; ? } ? .bar-chart:horizontal .chart-bar { ?-fx-background-insets: 0 0 0 1; ? } ? .bar-chart:horizontal .chart-bar, ?? .stacked-bar-chart:horizontal .chart-bar { ?-fx-background-color: ? linear-gradient(to bottom, ??derive(-fx-bar-fill, -4%), ?derive(-fx-bar-fill, -1%), ?derive(-fx-bar-fill, 0%), ?derive(-fx-bar-fill, -1%), ?derive(-fx-bar-fill, -6%) ?); ? } ? .default-color0.chart-bar { -fx-bar-fill: CHART_COLOR_1; } ? .default-color1.chart-bar { -fx-bar-fill: CHART_COLOR_2; } ? .default-color2.chart-bar { -fx-bar-fill: CHART_COLOR_3; } ? .default-color3.chart-bar { -fx-bar-fill: CHART_COLOR_4; } ? .default-color4.chart-bar { -fx-bar-fill: CHART_COLOR_5; } ? .default-color5.chart-bar { -fx-bar-fill: CHART_COLOR_6; } ? .default-color6.chart-bar { -fx-bar-fill: CHART_COLOR_7; } ? .default-color7.chart-bar { -fx-bar-fill: CHART_COLOR_8; } ? .bar-legend-symbol { ?-fx-padding: 8px; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* PieChart ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.chart-pie { ?-fx-pie-color: CHART_COLOR_1; ?-fx-background-color: radial-gradient(radius 100%, derive(-fx-pie-color,20%), derive(-fx-pie-color,-10%)); ?-fx-background-insets: 1; ?-fx-border-color: -fx-background; ? } ? .chart-pie-label { ?-fx-padding: 3px; ? } ? .chart-pie-label-line { ?-fx-stroke: derive(-fx-background,-20%); ? } ? .default-color0.chart-pie { -fx-pie-color: CHART_COLOR_1; } ? .default-color1.chart-pie { -fx-pie-color: CHART_COLOR_2; } ? .default-color2.chart-pie { -fx-pie-color: CHART_COLOR_3; } ? .default-color3.chart-pie { -fx-pie-color: CHART_COLOR_4; } ? .default-color4.chart-pie { -fx-pie-color: CHART_COLOR_5; } ? .default-color5.chart-pie { -fx-pie-color: CHART_COLOR_6; } ? .default-color6.chart-pie { -fx-pie-color: CHART_COLOR_7; } ? .default-color7.chart-pie { -fx-pie-color: CHART_COLOR_8; } ? .negative.chart-pie { ?-fx-pie-color: transparent; ?-fx-background-color: white; ? } ? .pie-legend-symbol.chart-pie { ?-fx-background-radius: 8px; ?-fx-padding: 8px; ?-fx-border-color: null; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* Combinations ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* This section is for special handling of when one control is nested inside ? *?* another control. There are many cases where we would end up with ugly ? ? ? *?* double borders that are fixed here. ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.tab-pane > * > .table-view, ? .tab-pane > * > .tree-table-view, ? .tab-pane > * > .list-view, ? .tab-pane > * > .tree-view, ? .tab-pane > * > .scroll-pane, ? .tab-pane > * > .split-pane, ? .tab-pane > * > .text-area, ? .tab-pane > * > .html-editor, ? .split-pane > * > .tab-pane, ? .split-pane > * > .table-view, ? .split-pane > * > .tree-table-view, ? .split-pane > * > .list-view, ? .split-pane > * > .tree-view, ? .split-pane > * > .scroll-pane, ? .split-pane > * > .split-pane, ? .split-pane > * > .text-area, ? .split-pane > * > .html-editor { ?-fx-background-insets: 0, 0; ?-fx-padding: 0; ?} ? .tab-pane.floating > * > .table-view, ? .tab-pane.floating > * > .tree-table-view, ? .tab-pane.floating > * > .list-view, ? .tab-pane.floating > * > .tree-view, ? .tab-pane.floating > * > .scroll-pane, ? .tab-pane.floating > * > .split-pane, ? .tab-pane.floating > * > .text-area, ? .tab-pane.floating > * > .html-editor { ?-fx-background-insets: 0, 0; ?-fx-padding: -1; ? } ? .split-pane > * > .accordion > .titled-pane > *.content { ?-fx-border-color: null; ?-fx-border-insets: 0; ? } ? .split-pane > * > .accordion > .titled-pane > .title ?{ ?-fx-background-insets: 0,1 0 1 0, 2 1 2 1; ? } ? .split-pane > * > .accordion > .first-titled-pane > .title ?{ ?-fx-background-insets: 0,0 0 1 0, 1 1 2 1; ? } ? .split-pane > * > .accordion > .titled-pane:collapsed > .title ?{ ?-fx-background-insets: 0,1 0 0 0, 2 1 1 1; ? } ? .split-pane > * > .accordion > .first-titled-pane:collapsed > .title ?{ ?-fx-background-insets: 0,0 0 0 0, 1 1 1 1; ? } ? .titled-pane > * > * > .split-pane, ? .titled-pane > * > * > .text-area, ? .titled-pane > * > * > .html-editor, ? .titled-pane > * > * > .list-view, ? .titled-pane > * > * > .tree-view, ? .titled-pane > * > * > .table-view, ? .titled-pane > * > * > .tree-table-view, ? .titled-pane > * > * > .scroll-pane { ?-fx-background-color: null; ?-fx-background-insets: 0, 0; ?-fx-padding: 0; ? } ? .titled-pane > * > * > AnchorPane, ? .titled-pane > * > * > BorderPane, ? .titled-pane > * > * > FlowPane, ? .titled-pane > * > * > GridPane, ? .titled-pane > * > * > HBox, ? .titled-pane > * > * > Pane, ? .titled-pane > * > * > StackPane, ? .titled-pane > * > * > TilePane, ? .titled-pane > * > * > VBox { ?-fx-padding: 0.8em; ? } ?/*******************************************************************************?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?* DatePicker ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?*?* ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? *?******************************************************************************/ ?.date-picker > .arrow-button > .arrow { ?-fx-shape: "M0,0v9h9V0H0z M2,8H1V7h1V8z M2,6H1V5h1V6z M2,4H1V3h1V4z M4,8H3V7h1V8z M4,6H3V5h1V6z M4,4H3V3h1V4z M6,8H5V7h1V8z M6,6H5 V5h1V6z M6,4H5V3h1V4z M8,8H7V7h1V8z M8,6H7V5h1V6z M8,4H7V3h1V4z"; ?-fx-background-color: -fx-mark-highlight-color, -fx-mark-color; ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.416667em 0.416667em 0.333333em 0.333333em; /* 5 5 4 4 */ ?-fx-scale-shape: true; ? } ?.date-picker-popup { ?-fx-background-color: ?linear-gradient(to bottom, ?derive(-fx-color,-17%), ?derive(-fx-color,-30%) ?), ?-fx-control-inner-background; ?-fx-background-insets: 0, 1; ?-fx-background-radius: 0; ?-fx-alignment: CENTER; /* VBox */ ?-fx-spacing: 0; /* VBox */ ?-fx-padding: 0.083333em; /* 1 1 1 1 */ ?-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.2) , 12, 0.0 , 0 , 8 ); ? } ? .date-picker-popup > .month-year-pane { ?-fx-padding: 0.588883em 0.5em 0.666667em 0.5em; /* 7 6 8 6 */ ?-fx-background-color: derive(-fx-box-border,30%), linear-gradient(to bottom, derive(-fx-base,-3%), derive(-fx-base,5%) 50%, derive(-fx-base,-3%)); ?-fx-background-insets: 0 0 0 0, 0 0 1 0; ? } ? .date-picker-popup > * > .spinner { ?-fx-spacing: 0.25em; /* 3 */ ?-fx-alignment: CENTER; ?-fx-fill-height: false; ? } ? .date-picker-popup > * > .spinner > .button { ?-fx-background-color: -fx-outer-border, -fx-inner-border, -fx-body-color; ?-fx-background-insets: 0, 1, 2; ?-fx-color: transparent; ?-fx-background-radius: 0; ? } ? .date-picker-popup > * > .spinner > .button:focused { ?-fx-background-color: -fx-focus-color, -fx-inner-border, -fx-body-color, -fx-faint-focus-color, -fx-body-color; ?-fx-color: -fx-hover-base; ?-fx-background-insets: -0.2, 1, 2, -1.4, 2.6; ? } ? .date-picker-popup > * > .spinner > .button:hover { ?-fx-color: -fx-hover-base; ? } ? .date-picker-popup > * > .spinner > .button:armed { ?-fx-color: -fx-pressed-base; ? } ? .date-picker-popup > * > .spinner > .left-button { ?-fx-padding: 0 0.333333em 0 0.25em; /* 0 4 0 3 */ ? } ? .date-picker-popup > * > .spinner > .right-button { ?-fx-padding: 0 0.25em 0 0.333333em; /* 0 3 0 4 */ ? } ? .date-picker-popup > * > .spinner > .button > .left-arrow, ? .date-picker-popup > * > .spinner > .button > .right-arrow { ?-fx-background-color: -fx-mark-highlight-color, derive(-fx-base,-45%); ?-fx-background-insets: 1 0 -1 0, 0; ?-fx-padding: 0.333333em 0.166667em 0.333333em 0.166667em; /* 4 2 4 2 */ ?-fx-effect: dropshadow(two-pass-box , -fx-shadow-highlight-color, 1, 0.0 , 0, 1.4); ? } ? .date-picker-popup > * > .spinner > .button:hover > .left-arrow, ? .date-picker-popup > * > .spinner > .button:hover > .right-arrow { ?-fx-background-color: -fx-mark-highlight-color, derive(-fx-base,-50%); ? } ? .date-picker-popup > * > .spinner > .button:pressed > .left-arrow, ? .date-picker-popup > * > .spinner > .button:pressed > .right-arrow { ?-fx-background-color: -fx-mark-highlight-color, derive(-fx-base,-55%); ? } ? .date-picker-popup > * > .spinner > .button > .left-arrow { ?-fx-padding: 0.333333em 0.25em 0.333333em 0.166667em; /* 4 3 4 2 */ ?-fx-shape: "M5.997,5.072L5.995,6.501l-2.998-4l2.998-4l0.002,1.43l-1.976,2.57L5.997,5.072z"; ?-fx-scale-shape: true; ? } ? .date-picker-popup > * > .spinner > .button > .right-arrow { ?-fx-padding: 0.333333em 0.25em 0.333333em 0.166667em; /* 4 3 4 2 */ ?-fx-shape: "M2.998-0.07L3-1.499l2.998,4L3,6.501l-0.002-1.43l1.976-2.57L2.998-0.07z"; ?-fx-scale-shape: true; ? } ? .date-picker-popup > * > .spinner > .label { ?-fx-alignment: CENTER; ? } ? .date-picker-popup > .month-year-pane > .secondary-label { ?-fx-alignment: BASELINE_CENTER; ?-fx-padding: 0.5em 0 0 0; /* 6 0 0 0 */ ?-fx-text-fill: #f3622d; ? } ?.date-picker-popup > .calendar-grid { ?-fx-background-color: derive(-fx-selection-bar-non-focused, 60%); ?/*-fx-background-insets: 1 0 0 0;*/ ?-fx-padding: 0; ? } ? .date-picker-popup > * > .date-cell { ??-fx-background-color: transparent; ?-fx-background-insets: 1, 2; ?-fx-padding: 0; ?-fx-alignment: BASELINE_CENTER; ?-fx-opacity: 1.0; ? } ? .date-picker-popup > * > .day-name-cell, ? .date-picker-popup > * > .week-number-cell { ?-fx-font-size: 0.916667em; ?? } ? .date-picker-popup > * > .week-number-cell { ?-fx-padding: 0.333333em 0.583333em 0.333333em 0.583333em; /* 4 7 4 7 */ ?-fx-border-color: -fx-control-inner-background; ?-fx-border-width: 1px; ?-fx-background: -fx-control-inner-background; ?-fx-background-color: -fx-background; ?-fx-text-fill: -fx-accent; ? } ? .date-picker-popup > * > .day-cell { ?-fx-padding: 0.333333em 0.583333em 0.333333em 0.583333em; /* 4 7 4 7 */ ?-fx-border-color: derive(-fx-selection-bar-non-focused, 60%); ?-fx-border-width: 1px; ?-fx-font-size: 1em; ?-fx-background: -fx-control-inner-background; ?-fx-background-color: -fx-background; ?-fx-text-fill: -fx-text-background-color; ? } ? .date-picker-popup > * > .hijrah-day-cell { ?-fx-alignment: TOP_LEFT; ?-fx-padding: 0.083333em 0.333333em 0.083333em 0.333333em; /* 1 4 1 4 */ ?-fx-cell-size: 2.75em; ? } ? .date-picker-popup > * > .day-cell > .secondary-text { ?-fx-fill: #f3622d; ? } ? .date-picker-popup > * > .today { ?-fx-background-color: -fx-control-inner-background, derive(-fx-selection-bar-non-focused, -20%), -fx-control-inner-background; ?-fx-background-insets: 1, 2, 3; ? } ? .date-picker-popup > * > .day-cell:hover, ? .date-picker-popup > * > .selected, ? .date-picker-popup > * > .previous-month.selected, ? .date-picker-popup > * > .next-month.selected { ?-fx-background: -fx-selection-bar; ? } ? .date-picker-popup > * > .previous-month:hover, ? .date-picker-popup > * > .next-month:hover { ?-fx-background: -fx-selection-bar-non-focused; ? } ? .date-picker-popup > * > .today:hover, ? .date-picker-popup > * > .today.selected { ?-fx-background-color: -fx-selection-bar, derive(-fx-selection-bar-non-focused, -20%),-fx-selection-bar; ? } ? .date-picker-popup > * > .day-cell:focused, ? .date-picker-popup > * > .today:focused { ?-fx-background-color: -fx-control-inner-background, -fx-cell-focus-inner-border, -fx-control-inner-background; ?-fx-background-insets: 1, 2, 3; ? } ? .date-picker-popup > * > .day-cell:focused:hover, ? .date-picker-popup > * > .today:focused:hover, ? .date-picker-popup > * > .selected:focused, ? .date-picker-popup > * > .today.selected:focused { ?-fx-background-color: -fx-selection-bar, -fx-cell-focus-inner-border, -fx-selection-bar; ? } ? .date-picker-popup > * > .previous-month, ? .date-picker-popup > * > .next-month { ?-fx-background: derive(-fx-control-inner-background, -4%); ? } ? .date-picker-popup > * > .day-cell:hover > .secondary-text, ? .date-picker-popup > * > .previous-month > .secondary-text, ? .date-picker-popup > * > .next-month > .secondary-text, ? .date-picker-popup > * > .selected > .secondary-text { ?-fx-fill: -fx-text-background-color; ? } ? .date-picker-popup > * > .previous-month.today, ? .date-picker-popup > * > .next-month.today { ?-fx-background-color: derive(-fx-control-inner-background, -4%), derive(-fx-selection-bar-non-focused, -20%), derive(-fx-control-inner-background, -4%); ? } ?.date-picker-popup > * > .previous-month.today:hover, ? .date-picker-popup > * > .next-month.today:hover { ?-fx-background-color: -fx-selection-bar-non-focused, derive(-fx-selection-bar-non-focused, -20%), -fx-selection-bar-non-focused; ? } ?

?

總結

以上是生活随笔為你收集整理的JavaFX8 modena样式(css)源码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。