refactor css file
This commit is contained in:
Timi
@@ -0,0 +1,68 @@
|
||||
/******************************************************************************
|
||||
* *
|
||||
* Pixel Size to Font Size *
|
||||
* *
|
||||
* 1px: 0.083333em *
|
||||
* 2px: 0.166667em *
|
||||
* 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: 1.0em *
|
||||
* *
|
||||
******************************************************************************/
|
||||
|
||||
/*
|
||||
- TimiFX 的样式表 -
|
||||
|
||||
1. 主体颜色为灰色，辅助色为靛青 #177CB0
|
||||
2. style.css 仅保留导入入口
|
||||
3. 基础控件、布局、工具类、组件样式分文件维护
|
||||
|
||||
*/
|
||||
* {
|
||||
-fx-tab-size: 4;
|
||||
-fx-font-smoothing-type: gray;
|
||||
}
|
||||
.root {
|
||||
-timi-fx-color: #177CB0;
|
||||
-timi-fx-icon-color: #333;
|
||||
-timi-fx-border-color: #B5B5B5;
|
||||
-timi-fx-popup-shadow: dropshadow(three-pass-box, rgba(0, 0, 0, .3), 5, 0, 0, 1);
|
||||
-timi-fx-opacity-hover: .7;
|
||||
-timi-fx-selected-color: #7CC4FF;
|
||||
-timi-fx-opacity-disabled: .4;
|
||||
|
||||
-fx-accent: -timi-fx-color;
|
||||
-fx-focus-color: transparent;
|
||||
-fx-focused-base: transparent;
|
||||
-fx-text-box-border: -timi-fx-border-color;
|
||||
-fx-faint-focus-color: transparent;
|
||||
-fx-shadow-highlight-color: transparent;
|
||||
-fx-cell-focus-inner-border: transparent;
|
||||
-fx-control-inner-background: #FFF;
|
||||
}
|
||||
/* --------------------------- 聚焦边距 --------------------------- */
|
||||
.text-area:focused,
|
||||
.text-field:focused {
|
||||
-fx-background-insets: 1, 2;
|
||||
}
|
||||
.button:focused {
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.list-view:focused {
|
||||
-fx-background-insets: 0, 0, 2;
|
||||
}
|
||||
.table-view:focused {
|
||||
-fx-background-insets: 0, 0, 1;
|
||||
}
|
||||
/* --------------------------- 只读 --------------------------- */
|
||||
.text-area:readonly,
|
||||
.text-field:readonly {
|
||||
-fx-text-fill: #666;
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
.date-time-picker {
|
||||
-fx-pref-width: 200;
|
||||
}
|
||||
.date-time-picker-time-pane {
|
||||
-fx-border-width: 0 0 0 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: #F4F4F4;
|
||||
-fx-translate-y: -1;
|
||||
-fx-effect: dropshadow(three-pass-box, rgba(0, 0, 0, .25), 4, 0, 0, 1);
|
||||
}
|
||||
.date-time-picker-time-box {
|
||||
-fx-hgap: 0;
|
||||
}
|
||||
.date-time-picker-now {
|
||||
-fx-alignment: center-right;
|
||||
}
|
||||
.date-time-picker-clear {
|
||||
-fx-background-color: #F4F4F4;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
.x-hyperlink {
|
||||
-fx-text-fill: #177CB0;
|
||||
}
|
||||
.x-hyperlink:hover {
|
||||
-fx-underline: true;
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
.icon-button {
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: transparent;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
.label-progress-bar .bar {
|
||||
-fx-background-color: #7ACAF4;
|
||||
}
|
||||
.label-progress-bar:indeterminate .bar {
|
||||
-fx-background-color: linear-gradient(to left, transparent, #7ACAF4);
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
.navigation {
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.navigation .navigation-button {
|
||||
-fx-padding: .25em .833333em; /* 3 10 */
|
||||
-fx-border-width: 0;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.navigation .navigation-button.after-group {
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.navigation .navigation-button:hover {
|
||||
-fx-background-color: #CCC;
|
||||
}
|
||||
.navigation .navigation-button:selected {
|
||||
-fx-text-fill: #FFF;
|
||||
-fx-background-color: -timi-fx-color;
|
||||
}
|
||||
.navigation .navigation-button:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
|
||||
.group-pane {
|
||||
-fx-animated: false;
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.group-pane.bottom-line {
|
||||
-fx-border-width: 1 0 1 0;
|
||||
}
|
||||
.group-pane .content {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
.x-pagination .button,
|
||||
.x-pagination .toggle-button {
|
||||
-fx-padding: 0;
|
||||
-fx-pref-width: 28;
|
||||
-fx-pref-height: 26;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
.progress-slider .track {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.progress-slider .progress-bar .bar {
|
||||
-fx-pref-height: 6;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
@@ -0,0 +1,38 @@
|
||||
.segmented-button-group {
|
||||
-fx-skin: "com.imyeyu.fx.ui.components.SegmentedButtonGroupSkin";
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-box {
|
||||
-fx-spacing: 0;
|
||||
-fx-alignment: center-left;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button {
|
||||
-fx-background-radius: 0;
|
||||
-fx-border-radius: 0;
|
||||
-fx-border-width: 1 1 1 0;
|
||||
-fx-padding: .333333em 1em; /* 4 12 */
|
||||
-fx-background-color: #FFF;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button.first,
|
||||
.segmented-button-group .segmented-button-group-button.single {
|
||||
-fx-border-width: 1;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button.single {
|
||||
-fx-background-radius: .083333em;
|
||||
-fx-border-radius: .083333em;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button.first {
|
||||
-fx-background-radius: .083333em 0 0 .083333em;
|
||||
-fx-border-radius: .083333em 0 0 .083333em;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button.last {
|
||||
-fx-background-radius: 0 .083333em .083333em 0;
|
||||
-fx-border-radius: 0 .083333em .083333em 0;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button:hover {
|
||||
-fx-background-color: #F4F9FC;
|
||||
}
|
||||
.segmented-button-group .segmented-button-group-button:selected {
|
||||
-fx-background-color: -timi-fx-color;
|
||||
-fx-border-color: -timi-fx-color;
|
||||
-fx-text-fill: #FFF;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
.selectable-label * {
|
||||
-fx-background-color: transparent;
|
||||
}
|
||||
.selectable-label .scroll-pane {
|
||||
-fx-hbar-policy: never;
|
||||
-fx-vbar-policy: never;
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
.tab-pane {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab {
|
||||
-fx-padding: 0 0 0 .5em;
|
||||
-fx-background-insets: 0 0 1 0, 0 1 1 0, 1 2 1 1;
|
||||
-fx-background-radius: 0, 0, 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab:selected {
|
||||
-fx-background-insets: 0 1 0 0, 0 1 0 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-label {
|
||||
-fx-padding: 0 .5em 0 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button {
|
||||
-fx-padding: 0 .5em;
|
||||
-fx-background-insets: 0;
|
||||
-fx-background-radius: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button > .arrow {
|
||||
-fx-shape: "M301.5,393.5v1h1v1h1v1h1v1h1v1h1v-1h1v-1h1v-1h1v-1h1v-1Z";
|
||||
-fx-min-width: 9;
|
||||
-fx-min-height: 5;
|
||||
-fx-pref-width: 9;
|
||||
-fx-pref-height: 5;
|
||||
}
|
||||
.tab-pane:top > .tab-header-area {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
.text-area-editor .find-field {
|
||||
-fx-background-color: #FFF;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.text-area-editor .replace-field {
|
||||
-fx-padding: .25em .333333em .25em 1.25em; /* 3 4 3 15 */
|
||||
}
|
||||
@@ -0,0 +1,15 @@
|
||||
.time-picker .text-field:readonly {
|
||||
-fx-text-fill: #666;
|
||||
}
|
||||
.time-picker-popup {
|
||||
-fx-effect: dropshadow(three-pass-box, rgba(0, 0, 0, .3), 5, 0, 0, 1);
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: #F4F4F4;
|
||||
}
|
||||
.time-picker-time-box {
|
||||
-fx-spacing: 0;
|
||||
}
|
||||
.time-picker-now {
|
||||
-fx-alignment: center-right;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
.toggle-icon:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.toggle-icon:disabled .icon {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
.tray-menu {
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
+17
-425
@@ -1,81 +1,4 @@
|
||||
/******************************************************************************
|
||||
* *
|
||||
* Pixel Size to Font Size *
|
||||
* *
|
||||
* 1px: 0.083333em *
|
||||
* 2px: 0.166667em *
|
||||
* 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: 1.0em *
|
||||
* *
|
||||
******************************************************************************/
|
||||
|
||||
/*
|
||||
- TimiFX 的样式表 -
|
||||
|
||||
1. 主体颜色为灰色，辅助色为靛青 #177CB0
|
||||
2. 基本组件在前，复杂组件在后，公共类最后
|
||||
|
||||
*/
|
||||
* {
|
||||
-fx-tab-size: 4;
|
||||
-fx-font-smoothing-type: gray;
|
||||
}
|
||||
.root {
|
||||
-timi-fx-color: #177CB0;
|
||||
-timi-fx-icon-color: #333;
|
||||
-timi-fx-border-color: #B5B5B5;
|
||||
-timi-fx-popup-shadow: dropshadow(three-pass-box, rgba(0, 0, 0, .3), 5, 0, 0, 1);
|
||||
-timi-fx-opacity-hover: .7;
|
||||
-timi-fx-selected-color: #7CC4FF;
|
||||
-timi-fx-opacity-disabled: .4;
|
||||
|
||||
-fx-accent: -timi-fx-color;
|
||||
-fx-focus-color: transparent;
|
||||
-fx-focused-base: transparent;
|
||||
-fx-text-box-border: -timi-fx-border-color;
|
||||
-fx-faint-focus-color: transparent;
|
||||
-fx-shadow-highlight-color: transparent;
|
||||
-fx-cell-focus-inner-border: transparent;
|
||||
-fx-control-inner-background: #FFF;
|
||||
}
|
||||
/* --------------------------- 聚焦边距 --------------------------- */
|
||||
.text-area:focused,
|
||||
.text-field:focused {
|
||||
-fx-background-insets: 1, 2;
|
||||
}
|
||||
.button:focused {
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.list-view:focused {
|
||||
-fx-background-insets: 0, 0, 2;
|
||||
}
|
||||
.table-view:focused {
|
||||
-fx-background-insets: 0, 0, 1;
|
||||
}
|
||||
/* --------------------------- 只读 --------------------------- */
|
||||
.text-area:readonly,
|
||||
.text-field:readonly,
|
||||
.time-picker:readonly {
|
||||
-fx-text-fill: #666;
|
||||
}
|
||||
/* --------------------------- 控件 --------------------------- */
|
||||
/* 可选标签 */
|
||||
.selectable-label * {
|
||||
-fx-background-color: transparent;
|
||||
}
|
||||
.selectable-label .scroll-pane {
|
||||
-fx-hbar-policy: never;
|
||||
-fx-vbar-policy: never;
|
||||
}
|
||||
/* 按钮 */
|
||||
.button {
|
||||
-fx-padding: .25em .833333em; /* 3 10 */
|
||||
-fx-border-width: 1;
|
||||
@@ -95,19 +18,6 @@
|
||||
.toggle-button:selected {
|
||||
-fx-background-color: -timi-fx-selected-color;
|
||||
}
|
||||
/* 图标按钮 */
|
||||
.icon-button {
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: transparent;
|
||||
}
|
||||
/* 切换图标按钮 */
|
||||
.toggle-icon:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.toggle-icon:disabled .icon {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
/* 文本框 */
|
||||
.text-field {
|
||||
-fx-padding: .25em .333333em; /* 3 4 */
|
||||
-fx-border-width: 1;
|
||||
@@ -116,7 +26,6 @@
|
||||
-fx-background-insets: 0;
|
||||
-fx-background-radius: 0;
|
||||
}
|
||||
/* 文本域 */
|
||||
.text-area {
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
@@ -133,15 +42,6 @@
|
||||
.text-area .scroll-pane {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
/* 文本域编辑器 */
|
||||
.text-area-editor .find-field {
|
||||
-fx-background-color: #FFF;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.text-area-editor .replace-field {
|
||||
-fx-padding: .25em .333333em .25em 1.25em; /* 3 4 3 15 */
|
||||
}
|
||||
/* 滑动选择 */
|
||||
.slider > .track {
|
||||
-fx-padding: .25em;
|
||||
-fx-background-radius: 0;
|
||||
@@ -156,9 +56,8 @@
|
||||
-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;
|
||||
}
|
||||
/* 树形结构 */
|
||||
.tree-view {
|
||||
-fx-padding: 0;
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.tree-view .tree-disclosure-node {
|
||||
-fx-padding: .166667em .583333em 0 .333333em;
|
||||
@@ -171,7 +70,6 @@
|
||||
-fx-pref-width: 5;
|
||||
-fx-pref-height: 9;
|
||||
}
|
||||
/* 列表 */
|
||||
.list-view {
|
||||
-fx-padding: 0;
|
||||
-fx-border-width: 1;
|
||||
@@ -183,7 +81,6 @@
|
||||
-fx-background-color: -fx-control-inner-background;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
/* 表格 */
|
||||
.table-view {
|
||||
-fx-padding: 0;
|
||||
-fx-border-width: 1;
|
||||
@@ -205,9 +102,7 @@
|
||||
.table-view .text-field:focused {
|
||||
-fx-background-insets: 1;
|
||||
}
|
||||
/* 下拉选择，菜单按钮，颜色选择，日期选择 */
|
||||
.combo-box,
|
||||
.menu-button,
|
||||
.date-picker,
|
||||
.color-picker {
|
||||
-fx-border-width: 1;
|
||||
@@ -227,12 +122,11 @@
|
||||
-fx-padding: .25em;
|
||||
}
|
||||
.menu-button.icon > .label {
|
||||
-fx-padding: .166667em .083333em .25em .333333em; /* 2 1 3 4 */
|
||||
-fx-padding: .166667em .083333em .25em .333333em; /* 2 1 3 4 */
|
||||
}
|
||||
.menu-button.empty > .label {
|
||||
-fx-padding: 0;
|
||||
-fx-padding: 0;
|
||||
}
|
||||
/* 下拉箭头 */
|
||||
.combo-box-base .text-field {
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
@@ -277,7 +171,6 @@
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-background;
|
||||
}
|
||||
/* 单选，多选 */
|
||||
.check-box,
|
||||
.radio-button,
|
||||
.check-box:hover,
|
||||
@@ -302,7 +195,6 @@
|
||||
-fx-pref-width: 10;
|
||||
-fx-pref-height: 8;
|
||||
}
|
||||
/* 弹出菜单 */
|
||||
.context-menu {
|
||||
-fx-color: -fx-base;
|
||||
-fx-effect: -timi-fx-popup-shadow;
|
||||
@@ -313,33 +205,27 @@
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.context-menu .menu-item:focused {
|
||||
-fx-background-color: -timi-fx-selected-color;
|
||||
-fx-background-color: -timi-fx-selected-color;
|
||||
}
|
||||
.context-menu .menu-item:focused .label {
|
||||
-fx-text-fill: #333;
|
||||
-fx-text-fill: #333;
|
||||
}
|
||||
.context-menu .separator {
|
||||
-fx-padding: 0;
|
||||
-fx-padding: 0;
|
||||
}
|
||||
/* 托盘菜单 */
|
||||
.tray-menu {
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
/* 菜单 */
|
||||
.menu > .right-container > .arrow {
|
||||
-fx-shape: "M303.5,391.5h1v1h1v1h1v1h1v1h1v1h-1v1h-1v1h-1v1h-1v1h-1Z";
|
||||
-fx-shape: "M303.5,391.5h1v1h1v1h1v1h1v1h1v1h-1v1h-1v1h-1v1h-1v1h-1Z";
|
||||
-fx-min-width: 5;
|
||||
-fx-min-height: 9;
|
||||
-fx-pref-width: 5;
|
||||
-fx-pref-height: 9;
|
||||
}
|
||||
.radio-menu-item:checked > .left-container > .radio {
|
||||
-fx-shape: "M3,7v2h1v1h1v1h1v1h1v-1h1v-1h1V9h1V8h1V7h1V6h1V4h-2v1h-1v1H9v1H8v1H7v1H6V8H5V7H3z";
|
||||
-fx-shape: "M3,7v2h1v1h1v1h1v1h1v-1h1v-1h1V9h1V8h1V7h1V6h1V4h-2v1h-1v1H9v1H8v1H7v1H6V8H5V7H3z";
|
||||
}
|
||||
.check-menu-item:checked > .left-container > .check {
|
||||
-fx-shape: "M3,7v2h1v1h1v1h1v1h1v-1h1v-1h1V9h1V8h1V7h1V6h1V4h-2v1h-1v1H9v1H8v1H7v1H6V8H5V7H3z";
|
||||
-fx-shape: "M3,7v2h1v1h1v1h1v1h1v-1h1v-1h1V9h1V8h1V7h1V6h1V4h-2v1h-1v1H9v1H8v1H7v1H6V8H5V7H3z";
|
||||
}
|
||||
/* 日期选择 */
|
||||
.date-picker:focused {
|
||||
-fx-background-color: -fx-control-inner-background;
|
||||
}
|
||||
@@ -386,7 +272,6 @@
|
||||
.date-picker-popup > * > .spinner > .button > .right-arrow {
|
||||
-fx-shape: "M306,394h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-2v1h1v1h1v1h1v1h1v1h1v1h1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h2v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1Z";
|
||||
}
|
||||
/* 颜色选择器 */
|
||||
.color-palette {
|
||||
-fx-translate-y: -1;
|
||||
-fx-background-radius: 0;
|
||||
@@ -411,7 +296,6 @@
|
||||
-fx-background-insets: 12px 0 0 0, 13px 1px 1px 1px;
|
||||
-fx-background-radius: 0;
|
||||
}
|
||||
/* 滚动条 */
|
||||
.scroll-bar {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
@@ -442,7 +326,6 @@
|
||||
-fx-background-insets: 0;
|
||||
-fx-background-radius: 0;
|
||||
}
|
||||
/* 列表滚动条 */
|
||||
.tree-view .scroll-bar:vertical,
|
||||
.list-view .scroll-bar:vertical,
|
||||
.table-view .scroll-bar:vertical {
|
||||
@@ -450,7 +333,6 @@
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-background;
|
||||
}
|
||||
|
||||
.tree-view .scroll-bar:horizontal,
|
||||
.list-view .scroll-bar:horizontal,
|
||||
.table-view .scroll-bar:horizontal {
|
||||
@@ -458,7 +340,6 @@
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-background;
|
||||
}
|
||||
/* 进度条 */
|
||||
.progress-bar {
|
||||
-fx-padding: 1;
|
||||
-fx-border-width: 1;
|
||||
@@ -480,29 +361,6 @@
|
||||
.progress-bar:indeterminate .bar {
|
||||
-fx-background-color: linear-gradient(to left, transparent, -timi-fx-color);
|
||||
}
|
||||
/* 标签进度 */
|
||||
.label-progress-bar .bar {
|
||||
-fx-background-color: #7ACAF4;
|
||||
}
|
||||
.label-progress-bar:indeterminate .bar {
|
||||
-fx-background-color: linear-gradient(to left, transparent, #7ACAF4);
|
||||
}
|
||||
/* 滑动选择 - 进度 */
|
||||
.progress-slider .track {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.progress-slider .progress-bar .bar {
|
||||
-fx-pref-height: 6;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
/* 分页 */
|
||||
.x-pagination .button,
|
||||
.x-pagination .toggle-button {
|
||||
-fx-padding: 0;
|
||||
-fx-pref-width: 28;
|
||||
-fx-pref-height: 26;
|
||||
}
|
||||
/* 标题组件 */
|
||||
.titled-pane {
|
||||
-fx-animate: false;
|
||||
-fx-border-width: 1;
|
||||
@@ -540,7 +398,6 @@
|
||||
-fx-border-width: 0 0 1 0;
|
||||
-fx-background-insets: 0, 0;
|
||||
}
|
||||
/* 图表 */
|
||||
.chart {
|
||||
-fx-padding: 0 0 6 0;
|
||||
}
|
||||
@@ -548,287 +405,22 @@
|
||||
-fx-padding: 0 24 4 6;
|
||||
}
|
||||
.chart-legend {
|
||||
-fx-padding: 4 8;
|
||||
-fx-background-radius: 0, 0;
|
||||
-fx-padding: 4 8;
|
||||
-fx-background-radius: 0, 0;
|
||||
}
|
||||
.area-legend-symbol {
|
||||
-fx-padding: 6;
|
||||
-fx-background-radius: 0;
|
||||
-fx-background-insets: 0, 6;
|
||||
}
|
||||
/* 导航 */
|
||||
.navigation {
|
||||
-fx-border-width: 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.navigation .group-pane {
|
||||
-fx-animated: false;
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.navigation .group-pane.bottom-line {
|
||||
-fx-border-width: 1 0 1 0;
|
||||
}
|
||||
.navigation .group-pane .content {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.navigation .navigation-button {
|
||||
-fx-padding: .25em .833333em; /* 3 10 */
|
||||
-fx-border-width: 0;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.navigation .navigation-button.after-group { /* 紧挨着上一个导航组时，添加上边框 */
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.navigation .navigation-button:hover {
|
||||
-fx-background-color: #CCC;
|
||||
}
|
||||
.navigation .navigation-button:selected {
|
||||
-fx-text-fill: #FFF;
|
||||
-fx-background-color: -timi-fx-color;
|
||||
}
|
||||
.navigation .navigation-button:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
/* 可编辑表格 */
|
||||
.editable-table .table-row-cell:odd {
|
||||
-fx-background-color: -fx-table-cell-border-color, -fx-control-inner-background;
|
||||
}
|
||||
.editable-table .table-row-cell:filled:selected,
|
||||
.editable-table .table-row-cell:filled:selected:focused {
|
||||
-fx-padding: 0;
|
||||
-fx-text-fill: -fx-selection-bar-text;
|
||||
-fx-background: -timi-fx-selected-color;
|
||||
-fx-border-width: 0;
|
||||
-fx-background-color: -timi-fx-selected-color;
|
||||
-fx-background-insets: 0;
|
||||
-fx-table-cell-border-color: -timi-fx-selected-color;
|
||||
}
|
||||
.editable-table .table-cell {
|
||||
-fx-padding: 0;
|
||||
-fx-cell-size: 0;
|
||||
-fx-border-width: .083333em .083333em .083333em 0; /* 1 1 1 0 */
|
||||
}
|
||||
.editable-table .table-row-cell .text-field {
|
||||
-fx-background-color: -timi-fx-color, #FFF;
|
||||
-fx-background-insets: 0, 0;
|
||||
}
|
||||
.editable-table .table-row-cell .text-field:focused {
|
||||
-fx-background-insets: 0, 1;
|
||||
}
|
||||
/* 选项卡 */
|
||||
.tab-pane {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab {
|
||||
-fx-padding: 0 0 0 .5em;
|
||||
-fx-background-insets: 0 0 1 0, 0 1 1 0, 1 2 1 1;
|
||||
-fx-background-radius: 0, 0, 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab:selected {
|
||||
-fx-background-insets: 0 1 0 0, 0 1 0 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .headers-region > .tab > .tab-container > .tab-label {
|
||||
-fx-padding: 0 .5em 0 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button {
|
||||
-fx-padding: 0 .5em;
|
||||
-fx-background-insets: 0;
|
||||
-fx-background-radius: 0;
|
||||
}
|
||||
.tab-pane > .tab-header-area > .control-buttons-tab > .container > .tab-down-button > .arrow {
|
||||
-fx-shape: "M301.5,393.5v1h1v1h1v1h1v1h1v1h1v-1h1v-1h1v-1h1v-1h1v-1Z";
|
||||
-fx-min-width: 9;
|
||||
-fx-min-height: 5;
|
||||
-fx-pref-width: 9;
|
||||
-fx-pref-height: 5;
|
||||
}
|
||||
.tab-pane:top > .tab-header-area {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
/* 分割线 */
|
||||
.separator > .line {
|
||||
-fx-border-style: null;
|
||||
-fx-border-width: 0;
|
||||
-fx-border-style: null;
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
.separator:horizontal > .line {
|
||||
-fx-padding: 0;
|
||||
-fx-min-height: 1;
|
||||
-fx-max-height: 1;
|
||||
-fx-pref-height: 1;
|
||||
-fx-background-color: -timi-fx-border-color;
|
||||
}
|
||||
/* --------------------------- 布局 --------------------------- */
|
||||
/* 滚动 */
|
||||
.scroll-pane {
|
||||
-fx-padding: 0;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.scroll-pane .corner {
|
||||
-fx-background-color: transparent;
|
||||
}
|
||||
/* 分割 */
|
||||
.split-pane {
|
||||
-fx-padding: 0;
|
||||
-fx-background-color: transparent;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
/* --------------------------- 可选类 --------------------------- */
|
||||
/* 其他 */
|
||||
.bg-tp,
|
||||
.bg-tp .viewport {
|
||||
-fx-background-color: transparent;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.bg-white {
|
||||
-fx-background-color: #FFF;
|
||||
}
|
||||
.bg-black {
|
||||
-fx-background-color: #000;
|
||||
}
|
||||
.bg-default {
|
||||
-fx-background-color: #F4F4F4;
|
||||
}
|
||||
.bg-button-static {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-body-color;
|
||||
}
|
||||
.bg-button-static:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.bg-button {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-body-color;
|
||||
}
|
||||
.bg-button:hover {
|
||||
-fx-color: -fx-hover-base;
|
||||
}
|
||||
.bg-button:armed {
|
||||
-fx-color: -fx-pressed-base;
|
||||
}
|
||||
.bg-button:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.hover-opacity:hover {
|
||||
-fx-opacity: -timi-fx-opacity-hover;
|
||||
}
|
||||
/* 滚动面板的滚动条边框 */
|
||||
.sp-border .scroll-bar:vertical {
|
||||
-fx-border-width: 0 0 0 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.sp-border .scroll-bar:horizontal {
|
||||
-fx-border-width: 1 0 0 0;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.sp-border .corner {
|
||||
-fx-border-width: 1 0 0 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
/* 内边距 */
|
||||
.padding-n {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
/* 字体颜色 */
|
||||
.white {
|
||||
-fx-text-fill: #FFF;
|
||||
}
|
||||
.red {
|
||||
-fx-text-fill: #F30;
|
||||
}
|
||||
.brown {
|
||||
-fx-text-fill: #A67D7B;
|
||||
}
|
||||
.black {
|
||||
-fx-text-fill: #000;
|
||||
}
|
||||
.orange {
|
||||
-fx-text-fill: #F60;
|
||||
}
|
||||
.yellow {
|
||||
-fx-text-fill: #FF0;
|
||||
}
|
||||
.green {
|
||||
-fx-text-fill: #393;
|
||||
}
|
||||
.dark-green {
|
||||
-fx-text-fill: #373;
|
||||
}
|
||||
.gray {
|
||||
-fx-text-fill: #666;
|
||||
}
|
||||
.blue {
|
||||
-fx-text-fill: #008DCB;
|
||||
}
|
||||
.light-blue {
|
||||
-fx-text-fill: #DDEAF0;
|
||||
}
|
||||
.gray-white {
|
||||
-fx-text-fill: #F4F4F4;
|
||||
}
|
||||
.light-gray {
|
||||
-fx-text-fill: #B5B5B5;
|
||||
}
|
||||
.dark-gray {
|
||||
-fx-text-fill: #333;
|
||||
}
|
||||
.pink {
|
||||
-fx-text-fill: #FF7A9B;
|
||||
}
|
||||
.transparent {
|
||||
-fx-text-fill: #FFFFFF00;
|
||||
}
|
||||
/* 边框控制 */
|
||||
.border-all {
|
||||
-fx-border-width: 1;
|
||||
}
|
||||
.border-n {
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
.border-t {
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.border-r {
|
||||
-fx-border-width: 0 1 0 0;
|
||||
}
|
||||
.border-b {
|
||||
-fx-border-width: 0 0 1 0;
|
||||
}
|
||||
.border-l {
|
||||
-fx-border-width: 0 0 0 1;
|
||||
}
|
||||
.border-tr {
|
||||
-fx-border-width: 1 1 0 0;
|
||||
}
|
||||
.border-rb {
|
||||
-fx-border-width: 0 1 1 0;
|
||||
}
|
||||
.border-bl {
|
||||
-fx-border-width: 0 0 1 1;
|
||||
}
|
||||
.border-lt {
|
||||
-fx-border-width: 1 0 0 1;
|
||||
}
|
||||
.border-trb {
|
||||
-fx-border-width: 1 1 1 0;
|
||||
}
|
||||
.border-rbl {
|
||||
-fx-border-width: 0 1 1 1;
|
||||
}
|
||||
.border-blt {
|
||||
-fx-border-width: 1 0 1 1;
|
||||
}
|
||||
.border-ltr {
|
||||
-fx-border-width: 1 1 0 1;
|
||||
}
|
||||
.border-tb {
|
||||
-fx-border-width: 1 0 1 0;
|
||||
}
|
||||
.border-lr {
|
||||
-fx-border-width: 0 1 0 1;
|
||||
-fx-min-height: 1;
|
||||
-fx-max-height: 1;
|
||||
-fx-pref-height: 1;
|
||||
-fx-background-color: -timi-fx-border-color;
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
@font-face {
|
||||
src: url('./MinecraftAE.ttf');
|
||||
src: url('../MinecraftAE.ttf');
|
||||
}
|
||||
|
||||
/* Minecraft AE 字体在 16 32 64 128 像素时表现为最清晰 */
|
||||
@@ -19,4 +19,4 @@
|
||||
.minecraft-ae {
|
||||
-fx-font-size: 16;
|
||||
-fx-font-family: 'Minecraft AE';
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,13 @@
|
||||
/* --------------------------- 布局 --------------------------- */
|
||||
.scroll-pane {
|
||||
-fx-padding: 0;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.scroll-pane .corner {
|
||||
-fx-background-color: transparent;
|
||||
}
|
||||
.split-pane {
|
||||
-fx-padding: 0;
|
||||
-fx-background-color: transparent;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
@import "base.css";
|
||||
@import "controls.css";
|
||||
@import "layout.css";
|
||||
@import "utility.css";
|
||||
@@ -0,0 +1,174 @@
|
||||
/* --------------------------- 可选类 --------------------------- */
|
||||
.bg-tp,
|
||||
.bg-tp .viewport {
|
||||
-fx-background-color: transparent;
|
||||
-fx-background-insets: 0;
|
||||
}
|
||||
.bg-white {
|
||||
-fx-background-color: #FFF;
|
||||
}
|
||||
.bg-black {
|
||||
-fx-background-color: #000;
|
||||
}
|
||||
.bg-default {
|
||||
-fx-background-color: #F4F4F4;
|
||||
}
|
||||
.bg-button-static {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-body-color;
|
||||
}
|
||||
.bg-button-static:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.bg-button {
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
-fx-background-color: -fx-body-color;
|
||||
}
|
||||
.bg-button:hover {
|
||||
-fx-color: -fx-hover-base;
|
||||
}
|
||||
.bg-button:armed {
|
||||
-fx-color: -fx-pressed-base;
|
||||
}
|
||||
.bg-button:disabled {
|
||||
-fx-opacity: -timi-fx-opacity-disabled;
|
||||
}
|
||||
.hover-opacity:hover {
|
||||
-fx-opacity: -timi-fx-opacity-hover;
|
||||
}
|
||||
.sp-border .scroll-bar:vertical {
|
||||
-fx-border-width: 0 0 0 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.sp-border .scroll-bar:horizontal {
|
||||
-fx-border-width: 1 0 0 0;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.sp-border .corner {
|
||||
-fx-border-width: 1 0 0 1;
|
||||
-fx-border-color: -timi-fx-border-color;
|
||||
}
|
||||
.editable-table .table-row-cell:odd {
|
||||
-fx-background-color: -fx-table-cell-border-color, -fx-control-inner-background;
|
||||
}
|
||||
.editable-table .table-row-cell:filled:selected,
|
||||
.editable-table .table-row-cell:filled:selected:focused {
|
||||
-fx-padding: 0;
|
||||
-fx-text-fill: -fx-selection-bar-text;
|
||||
-fx-background: -timi-fx-selected-color;
|
||||
-fx-border-width: 0;
|
||||
-fx-background-color: -timi-fx-selected-color;
|
||||
-fx-background-insets: 0;
|
||||
-fx-table-cell-border-color: -timi-fx-selected-color;
|
||||
}
|
||||
.editable-table .table-cell {
|
||||
-fx-padding: 0;
|
||||
-fx-cell-size: 0;
|
||||
-fx-border-width: .083333em .083333em .083333em 0; /* 1 1 1 0 */
|
||||
}
|
||||
.editable-table .table-row-cell .text-field {
|
||||
-fx-background-color: -timi-fx-color, #FFF;
|
||||
-fx-background-insets: 0, 0;
|
||||
}
|
||||
.editable-table .table-row-cell .text-field:focused {
|
||||
-fx-background-insets: 0, 1;
|
||||
}
|
||||
.padding-n {
|
||||
-fx-padding: 0;
|
||||
}
|
||||
.white {
|
||||
-fx-text-fill: #FFF;
|
||||
}
|
||||
.red {
|
||||
-fx-text-fill: #F30;
|
||||
}
|
||||
.brown {
|
||||
-fx-text-fill: #A67D7B;
|
||||
}
|
||||
.black {
|
||||
-fx-text-fill: #000;
|
||||
}
|
||||
.orange {
|
||||
-fx-text-fill: #F60;
|
||||
}
|
||||
.yellow {
|
||||
-fx-text-fill: #FF0;
|
||||
}
|
||||
.green {
|
||||
-fx-text-fill: #393;
|
||||
}
|
||||
.dark-green {
|
||||
-fx-text-fill: #373;
|
||||
}
|
||||
.gray {
|
||||
-fx-text-fill: #666;
|
||||
}
|
||||
.blue {
|
||||
-fx-text-fill: #008DCB;
|
||||
}
|
||||
.light-blue {
|
||||
-fx-text-fill: #DDEAF0;
|
||||
}
|
||||
.gray-white {
|
||||
-fx-text-fill: #F4F4F4;
|
||||
}
|
||||
.light-gray {
|
||||
-fx-text-fill: #B5B5B5;
|
||||
}
|
||||
.dark-gray {
|
||||
-fx-text-fill: #333;
|
||||
}
|
||||
.pink {
|
||||
-fx-text-fill: #FF7A9B;
|
||||
}
|
||||
.transparent {
|
||||
-fx-text-fill: #FFFFFF00;
|
||||
}
|
||||
.border-all {
|
||||
-fx-border-width: 1;
|
||||
}
|
||||
.border-n {
|
||||
-fx-border-width: 0;
|
||||
}
|
||||
.border-t {
|
||||
-fx-border-width: 1 0 0 0;
|
||||
}
|
||||
.border-r {
|
||||
-fx-border-width: 0 1 0 0;
|
||||
}
|
||||
.border-b {
|
||||
-fx-border-width: 0 0 1 0;
|
||||
}
|
||||
.border-l {
|
||||
-fx-border-width: 0 0 0 1;
|
||||
}
|
||||
.border-tr {
|
||||
-fx-border-width: 1 1 0 0;
|
||||
}
|
||||
.border-rb {
|
||||
-fx-border-width: 0 1 1 0;
|
||||
}
|
||||
.border-bl {
|
||||
-fx-border-width: 0 0 1 1;
|
||||
}
|
||||
.border-lt {
|
||||
-fx-border-width: 1 0 0 1;
|
||||
}
|
||||
.border-trb {
|
||||
-fx-border-width: 1 1 1 0;
|
||||
}
|
||||
.border-rbl {
|
||||
-fx-border-width: 0 1 1 1;
|
||||
}
|
||||
.border-blt {
|
||||
-fx-border-width: 1 0 1 1;
|
||||
}
|
||||
.border-ltr {
|
||||
-fx-border-width: 1 1 0 1;
|
||||
}
|
||||
.border-tb {
|
||||
-fx-border-width: 1 0 1 0;
|
||||
}
|
||||
.border-lr {
|
||||
-fx-border-width: 0 1 0 1;
|
||||
}
|
||||
Reference in New Issue
Block a user