Added main.css file
This commit is contained in:
parent
ae27d15af6
commit
338f7b16f9
342
src/main/resources/static/css/main.css
Normal file
342
src/main/resources/static/css/main.css
Normal file
@ -0,0 +1,342 @@
|
|||||||
|
.root {
|
||||||
|
-fx-font-family: Roboto;
|
||||||
|
src: "/resources/roboto/Roboto-Regular.ttf";
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Burgers Demo */
|
||||||
|
|
||||||
|
.jfx-hamburger {
|
||||||
|
-fx-spacing: 5;
|
||||||
|
-fx-cursor: hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-hamburger StackPane {
|
||||||
|
-fx-pref-width: 40px;
|
||||||
|
-fx-pref-height: 7px;
|
||||||
|
-fx-background-color: #D63333;
|
||||||
|
-fx-background-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Input Demo */
|
||||||
|
|
||||||
|
.text-field {
|
||||||
|
-fx-max-width: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-text-field, .jfx-password-field {
|
||||||
|
-fx-background-color: WHITE;
|
||||||
|
-fx-font-weight: BOLD;
|
||||||
|
-fx-prompt-text-fill: #808080;
|
||||||
|
-fx-alignment: top-left;
|
||||||
|
-jfx-focus-color: #4059A9;
|
||||||
|
-jfx-unfocus-color: #4d4d4d;
|
||||||
|
-fx-max-width: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-decorator {
|
||||||
|
-fx-decorator-color: RED;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-decorator .jfx-decorator-buttons-container {
|
||||||
|
-fx-background-color: -fx-decorator-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-decorator .resize-border {
|
||||||
|
-fx-border-color: -fx-decorator-color;
|
||||||
|
-fx-border-width: 0 4 4 4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-text-area, .text-area {
|
||||||
|
-fx-font-weight: BOLD;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-text-field:error, .jfx-password-field:error, .jfx-text-area:error {
|
||||||
|
-jfx-focus-color: #D34336;
|
||||||
|
-jfx-unfocus-color: #D34336;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-text-field .error-label, .jfx-password-field .error-label, .jfx-text-area .error-label {
|
||||||
|
-fx-text-fill: #D34336;
|
||||||
|
-fx-font-size: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-text-field .error-icon, .jfx-password-field .error-icon, .jfx-text-area .error-icon {
|
||||||
|
-fx-text-fill: #D34336;
|
||||||
|
-fx-font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Progress Bar Demo */
|
||||||
|
|
||||||
|
.progress-bar > .bar {
|
||||||
|
-fx-min-width: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-progress-bar > .bar {
|
||||||
|
-fx-min-width: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-progress-bar {
|
||||||
|
-fx-progress-color: #0F9D58;
|
||||||
|
-fx-stroke-width: 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Icons Demo */
|
||||||
|
.icon {
|
||||||
|
-fx-text-fill: #FE774D;
|
||||||
|
-fx-padding: 10;
|
||||||
|
-fx-cursor: hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icons-rippler {
|
||||||
|
-jfx-rippler-fill: BLUE;
|
||||||
|
-jfx-mask-type: CIRCLE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icons-rippler:hover {
|
||||||
|
-fx-cursor: hand;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-check-box {
|
||||||
|
-fx-font-weight: BOLD;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-jfx-check-box {
|
||||||
|
-jfx-checked-color: RED;
|
||||||
|
-jfx-unchecked-color: BLACK;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Button */
|
||||||
|
.button {
|
||||||
|
-fx-padding: 0.7em 0.57em;
|
||||||
|
-fx-font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-raised {
|
||||||
|
-fx-padding: 0.7em 0.57em;
|
||||||
|
-fx-font-size: 14px;
|
||||||
|
-jfx-button-type: RAISED;
|
||||||
|
-fx-background-color: rgb(77, 102, 204);
|
||||||
|
-fx-pref-width: 200;
|
||||||
|
-fx-text-fill: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The main scrollbar **track** CSS class */
|
||||||
|
.mylistview .scroll-bar:horizontal .track,
|
||||||
|
.mylistview .scroll-bar:vertical .track {
|
||||||
|
-fx-background-color: transparent;
|
||||||
|
-fx-border-color: transparent;
|
||||||
|
-fx-background-radius: 0em;
|
||||||
|
-fx-border-radius: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The increment and decrement button CSS class of scrollbar */
|
||||||
|
.mylistview .scroll-bar:horizontal .increment-button,
|
||||||
|
.mylistview .scroll-bar:horizontal .decrement-button {
|
||||||
|
-fx-background-color: transparent;
|
||||||
|
-fx-background-radius: 0em;
|
||||||
|
-fx-padding: 0 0 10 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The increment and decrement button CSS class of scrollbar */
|
||||||
|
|
||||||
|
.mylistview .scroll-bar:vertical .increment-button,
|
||||||
|
.mylistview .scroll-bar:vertical .decrement-button {
|
||||||
|
-fx-background-color: transparent;
|
||||||
|
-fx-background-radius: 0em;
|
||||||
|
-fx-padding: 0 10 0 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.mylistview .scroll-bar .increment-arrow,
|
||||||
|
.mylistview .scroll-bar .decrement-arrow {
|
||||||
|
-fx-shape: " ";
|
||||||
|
-fx-padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* The main scrollbar **thumb** CSS class which we drag every time (movable) */
|
||||||
|
.mylistview .scroll-bar:horizontal .thumb,
|
||||||
|
.mylistview .scroll-bar:vertical .thumb {
|
||||||
|
-fx-background-color: derive(black, 90%);
|
||||||
|
-fx-background-insets: 2, 0, 0;
|
||||||
|
-fx-background-radius: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell-container {
|
||||||
|
-fx-alignment: center-left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell-container > .label {
|
||||||
|
-fx-text-fill: BLACK;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell:odd:selected > .jfx-rippler > StackPane, .jfx-list-cell:even:selected > .jfx-rippler > StackPane {
|
||||||
|
-fx-background-color: rgba(0, 0, 255, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell {
|
||||||
|
-fx-background-insets: 0.0;
|
||||||
|
-fx-text-fill: BLACK;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell:odd, .jfx-list-cell:even {
|
||||||
|
-fx-background-color: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell:filled:hover {
|
||||||
|
-fx-text-fill: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell .jfx-rippler {
|
||||||
|
-jfx-rippler-fill: BLUE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-view {
|
||||||
|
-fx-background-insets: 0;
|
||||||
|
-jfx-cell-horizontal-margin: 0.0;
|
||||||
|
-jfx-cell-vertical-margin: 5.0;
|
||||||
|
-jfx-vertical-gap: 10;
|
||||||
|
-jfx-expanded: false;
|
||||||
|
-fx-pref-width: 200;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-toggle-button {
|
||||||
|
-jfx-toggle-color: RED;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-tool-bar {
|
||||||
|
-fx-font-size: 20;
|
||||||
|
-fx-font-weight: BOLD;
|
||||||
|
-fx-background-color: #5264AE;
|
||||||
|
-fx-pref-width: 100%;
|
||||||
|
-fx-pref-height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-tool-bar HBox {
|
||||||
|
-fx-alignment: center;
|
||||||
|
-fx-spacing: 25;
|
||||||
|
-fx-padding: 0 10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-tool-bar Label {
|
||||||
|
-fx-text-fill: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-popup-container {
|
||||||
|
-fx-background-color: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-snackbar-content {
|
||||||
|
-fx-background-color: #323232;
|
||||||
|
-fx-padding: 5;
|
||||||
|
-fx-spacing: 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-snackbar-toast {
|
||||||
|
-fx-text-fill: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-snackbar-action {
|
||||||
|
-fx-text-fill: #ff4081;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell-content-container {
|
||||||
|
-fx-alignment: center-left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jfx-list-cell-container .label {
|
||||||
|
-fx-text-fill: BLACK;
|
||||||
|
}
|
||||||
|
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell:odd:selected .jfx-list-cell-container,
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell:even:selected .jfx-list-cell-container {
|
||||||
|
-fx-background-color: rgba(0.0, 0.0, 255.0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell {
|
||||||
|
-fx-background-insets: 0.0;
|
||||||
|
-fx-text-fill: BLACK;
|
||||||
|
}
|
||||||
|
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell:odd,
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell:even {
|
||||||
|
-fx-background-color: WHITE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.combo-box-popup .list-view .jfx-list-cell:filled:hover {
|
||||||
|
-fx-text-fill: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*.combo-box .combo-box-button-container{
|
||||||
|
-fx-border-color:BLACK;-fx-border-width: 0 0 1 0;
|
||||||
|
}
|
||||||
|
.combo-box .combo-box-selected-value-container{
|
||||||
|
-fx-border-color:BLACK;
|
||||||
|
} */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* TREE TABLE CSS
|
||||||
|
*/
|
||||||
|
|
||||||
|
.tree-table-view {
|
||||||
|
-fx-tree-table-color: rgba(255, 0, 0, 0.2);
|
||||||
|
-fx-tree-table-rippler-color: rgba(255, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree-table-view .jfx-text-field{
|
||||||
|
-fx-background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated-option-button {
|
||||||
|
-fx-background-color: #F1F1F1;
|
||||||
|
-fx-background-radius: 50px;
|
||||||
|
-fx-pref-height: 50px;
|
||||||
|
-fx-pref-width: 50px;
|
||||||
|
-fx-min-width: -fx-pref-width;
|
||||||
|
-fx-max-width: -fx-pref-width;
|
||||||
|
-fx-min-height: -fx-pref-height;
|
||||||
|
-fx-max-height: -fx-pref-height;
|
||||||
|
-jfx-button-type: RAISED;
|
||||||
|
}
|
||||||
|
.animated-option-button .jfx-rippler{
|
||||||
|
-jfx-rippler-fill: rgb(113, 118, 114);
|
||||||
|
}
|
||||||
|
.sub-icon{
|
||||||
|
-fx-fill: rgb(113, 118, 114);
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-button {
|
||||||
|
-fx-pref-width: 60px;
|
||||||
|
-fx-background-color: #0F9D58;
|
||||||
|
-fx-background-radius: 60px;
|
||||||
|
-fx-pref-height: 60px;
|
||||||
|
-fx-min-width: -fx-pref-width;
|
||||||
|
-fx-max-width: -fx-pref-width;
|
||||||
|
-fx-min-height: -fx-pref-height;
|
||||||
|
-fx-max-height: -fx-pref-height;
|
||||||
|
-jfx-button-type: RAISED;
|
||||||
|
}
|
||||||
|
.main-button .jfx-rippler{
|
||||||
|
-jfx-rippler-fill: rgba(255,255,255, .87);
|
||||||
|
}
|
||||||
|
.main-icon{
|
||||||
|
-fx-fill: rgba(255,255,255, .87);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.animated-option-sub-button {
|
||||||
|
-fx-background-color: #43609C;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animated-option-sub-button2 {
|
||||||
|
-fx-background-color: rgb(203, 104, 96);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree-table-view .menu-item:focused {
|
||||||
|
-fx-background-color: -fx-tree-table-color;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.tree-table-view .menu-item .label {
|
||||||
|
-fx-padding: 5 0 5 0;
|
||||||
|
}
|
||||||
|
|
||||||
Loading…
Reference in New Issue
Block a user