diff --git a/src/main/resources/ui-structure/Casinogameui-blackwhite.css b/src/main/resources/ui-structure/Casinogameui-blackwhite.css new file mode 100644 index 0000000..ae21f45 --- /dev/null +++ b/src/main/resources/ui-structure/Casinogameui-blackwhite.css @@ -0,0 +1,710 @@ +/*main box css*/ + +.root { + -fx-background-color: #000000; + -fx-font-family: "Monospaced", "Courier New"; /* font */ +} + +.background { + -fx-background-color: #000000; + -fx-background-size: cover; /* Image fills the entire window */ + /* Centers the image and prevents it from repeating in a tile-like pattern. */ + -fx-background-position: center center; + -fx-background-repeat: no-repeat; +} + +.info-text { + -fx-text-fill: #ffffff; + -fx-font-size: 16px; +} + +.casino-table { + -fx-background-color: #000000; + -fx-background-radius: 210; + -fx-border-radius: 200; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 12; + /*-fx-min-height: 60vh;*/ + /*-fx-max-height: 60vh;*/ + /*-fx-min-width: 90vh;*/ + /*-fx-max-width: 90vh;*/ + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 15, 15); +} + +.dealer-box { + -fx-background-color: #ffffff; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-background-radius: 0; + -fx-border-radius: 0; + -fx-min-width: 70; + -fx-min-height: 100; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 4, 4); +} + +.table-title { + -fx-text-fill: #ffffff; + -fx-font-size: 28px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255), 0, 0, 3, 3);*/ +} + +.taskbar { + -fx-background-color: #000000; + -fx-background-radius: 23; + -fx-border-radius: 20; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-padding: 10 25; + -fx-cursor: move; + -fx-effect: dropshadow(one-pass-box, rgba(0,0,0,0.8), 0, 0, 5, 5); +} + +.taskbar:hover { + -fx-border-color: #ffffff; +} + +.taskbar.player-active-turn { + /* Active turn should only change the shadow to avoid flicker/transparency jumps. */ + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.black-input-field { + -fx-background-color: #000000 !important; + -fx-text-fill: #ffffff !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-background-radius: 8 !important; + -fx-border-radius: 8 !important; + -fx-border-color: #333333 !important; + -fx-border-width: 2 !important; + -fx-padding: 5 12 !important; +} + +.black-input-field:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +.black-input-field:focused { + -fx-border-color: #ffffff !important; + /*-fx-background-color: #000000;*/ +} + +.gray-input-field { + -fx-background-color: #000000 !important; + -fx-text-fill: #ffffff !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-background-radius: 8 !important; + -fx-border-radius: 8 !important; + -fx-border-color: #333333 !important; + /*-fx-color-color: #000000;*/ + -fx-border-width: 2 !important; + -fx-padding: 5 12 !important; +} + +.gray-input-field:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +.gray-input-field:focused { + -fx-border-color: #ffffff !important; + /*-fx-background-color: #333333;*/ +} + +.yellow-input-field { + -fx-background-color: #b8860b !important; + -fx-text-fill: #ffffff !important; + -fx-prompt-text-fill: #ffffff !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-background-radius: 8 !important; + -fx-border-radius: 8 !important; + -fx-border-color: #ffd700 !important; + -fx-border-width: 2 !important; + -fx-padding: 5 12 !important; +} + +.yellow-input-field:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +/*.yellow-input-field:focused {*/ +/* -fx-border-color: #ffd700;*/ +/* -fx-background-color: #b8860b;*/ +/*}*/ + +.red-input-field { + -fx-background-color: #8b0000 !important; + -fx-text-fill: #ffffff !important; + -fx-prompt-text-fill: #ffffff !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-background-radius: 8 !important; + -fx-border-radius: 8 !important; + -fx-border-color: #ff4444 !important; + -fx-border-width: 2 !important; + -fx-padding: 5 12 !important; +} + +.red-input-field:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +/*.red-input-field:focused {*/ +/* -fx-border-color: #ff4444;*/ +/* -fx-background-color: #8b0000;*/ +/*}*/ + +.yellow-button { + -fx-background-color: #b8860b !important; + -fx-border-color: #ffd700 !important; + -fx-text-fill: #ffffff !important; +} + +.red-button { + -fx-background-color: #8b0000 !important; + -fx-border-color: #ff4444 !important; + -fx-text-fill: #ffffff !important; +} + +.gray-button { + -fx-background-color: #000000 !important; + -fx-border-color: #333333 !important; + -fx-text-fill: #ffffff !important; +} + +.gray-button .label { + -fx-text-fill: #ffffff !important; +} + +.green-button { + -fx-background-color: #000000 !important; + -fx-border-color: #333333 !important; + -fx-text-fill: #ffffff !important; +} + +.gray-button, .yellow-button, .red-button, .green-button { + -fx-background-radius: 12 !important; + -fx-border-radius: 12 !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-border-width: 2 !important; + -fx-padding: 6 15 !important; + -fx-cursor: hand !important; +} + +.gray-button:hover, .yellow-button:hover, .red-button:hover, .green-button:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +.community-cards-box { + -fx-alignment: center !important; + -fx-spacing: 12 !important; + -fx-padding: 15 !important; + -fx-background-color: transparent !important; +} + +.community-card { + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3); + + -fx-alignment: center; + -fx-spacing: 12; + -fx-padding: 20; + -fx-background-color: linear-gradient(to bottom, #0b3d2e, #06261d); + -fx-background-radius: 16; + -fx-scale-x: 1; + -fx-scale-y: 1; + -fx-translate-y: 0; + -fx-opacity: 1; +} + +.player-card { + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3); + + -fx-alignment: center; + -fx-spacing: 12; + -fx-padding: 20; + -fx-background-color: linear-gradient(to bottom, #0b3d2e, #06261d); + -fx-background-radius: 16; + -fx-scale-x: 1; + -fx-scale-y: 1; + -fx-translate-y: 0; + -fx-opacity: 1; +} + +.player-card.player-cards-active-turn { + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.dealer-box.player-cards-active-turn { + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.chips-icon { + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3); +} + +.dealer-icon { + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3); +} + +.player-cards-box { + -fx-padding: 10; +} + +/*.player-cards-box.player-cards-active-turn {*/ +/* -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5);*/ +/*}*/ + +.money-value { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 2, 2);*/ +} + +.pot-title { + -fx-text-fill: #ffffff; + -fx-font-size: 14px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 3, 3);*/ +} + +.pot-box { + -fx-padding: 5; +} + +.player-status-pane { + -fx-background-color: rgba(13, 158, 59, 0); + -fx-background-radius: 15; + -fx-border-radius: 15; + /* -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 2; + -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.5), 10, 0, 0, 4);*/ +} + +.player-status-pane:hover { + -fx-translate-y: -3; +} + +.status-inner-box-top { + -fx-background-color: #000000; + -fx-background-radius: 19; + -fx-border-radius: 15; + -fx-padding: 5 10; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0, 0.8), 0, 0, 3, 3); +} + +.status-inner-box-midle { + -fx-background-color: rgba(13, 158, 59, 0); +} + +.status-inner-box-bottom { + -fx-background-color: #000000; + -fx-background-radius: 19; + -fx-border-radius: 15; + -fx-padding: 5 10; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0, 0.8), 0, 0, 3, 3); +} + +.status-inner-box-top.player-status-active-turn { + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.status-inner-box-bottom.player-status-active-turn { + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.status-label-small { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 2, 2);*/ +} + +.status-value-text { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 2, 2);*/ +} + +.status-value-money { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 2, 2);*/ +} + +.status-circle { + -fx-background-color: #000000; + -fx-background-radius: 50; + -fx-border-color: #ffffff; + -fx-border-width: 1; + -fx-border-radius: 50; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0, 0.8), 0, 0, 3, 3); +} + +.browser-root { + -fx-background-image: url("/images/background.png"); + -fx-background-size: cover; + -fx-background-position: center; + -fx-background-color: #0b2d15; +} + +.browser-web-view { + -fx-background-color: rgb(13, 158, 59); + -fx-background-radius: 23; + -fx-border-radius: 20; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-padding: 0; + -fx-cursor: default; + -fx-effect: dropshadow(one-pass-box, rgba(0,0,0,0.8), 0, 0, 5, 5); +} + +.web-view { + -fx-background-color: transparent; +} + +.taskbar-browser { + -fx-background-color: rgb(13, 158, 59); + -fx-background-radius: 23; + -fx-border-radius: 20; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-padding: 10 25; + -fx-cursor: default; + -fx-effect: dropshadow(one-pass-box, rgba(0,0,0,0.8), 0, 0, 5, 5); +} + +/*.taskbar-browser:hover {*/ +/* -fx-border-color: #ffffff;*/ +/*}*/ + +.security-label { + -fx-text-fill: #000000; + -fx-font-weight: bold; + -fx-font-size: 16px; +} + +.context-menu { + -fx-background-color: #333333 !important; + -fx-text-fill: #ffffff !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-background-radius: 8 !important; + -fx-border-radius: 8 !important; + -fx-border-color: #333333 !important; + -fx-color-color: #cccccc !important; + -fx-border-width: 2 !important; + -fx-padding: 5 12 !important; +} + +.context-menu .menu-item { + -fx-background-color: #333333 !important; +} + +.context-menu .menu-item .label { + -fx-text-fill: #ffffff !important; + -fx-font-size: 13px !important; +} + +/*.context-menu .menu-item:focused {*/ +/* -fx-background-color: #333333;*/ +/*}*/ + +.context-menu .menu-item:hover .label, +.context-menu .menu-item:focused .label { + /*-fx-text-fill: #b8860b;*/ + -fx-font-size: 15px !important; +} + +.notebook { + -fx-background-color: #000000; + -fx-background-radius: 23; + -fx-border-radius: 20; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-effect: dropshadow(one-pass-box, rgb(255, 255, 255), 0, 0, 5, 5); + /*-fx-cursor: move;*/ + + -fx-padding: 0 0 15 0; +} + +.notebook:hover { + -fx-border-color: #ffffff; +} + +.notebook.player-active-turn { + /* Active turn should only change the shadow to avoid flicker/transparency jumps. */ + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.notebook-header { + -fx-background-color: #000000; + -fx-background-radius: 25 25 0 0; + -fx-padding: 8 10; + -fx-cursor: move; +} + +.notebook-title { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, rgb(255, 255, 255), 0, 0, 3, 3);*/ +} + +.notebook-content { + -fx-background-color: transparent; + -fx-padding: 0; +} + +.notebook-content > .viewport { + -fx-background-color: #000000; + -fx-background-radius: 0 0 25 25; +} + + +.scroll-pane { + -fx-background-color: transparent; + -fx-border-color: transparent; +} + +.scroll-pane .scroll-bar:vertical, +.scroll-pane .scroll-bar:horizontal { + -fx-background-color: transparent; +} + +.scroll-pane .scroll-bar .track { + -fx-background-color: #000000; + -fx-background-radius: 5; +} + +.scroll-pane .scroll-bar .thumb { + -fx-background-color: #333333; + -fx-background-radius: 5; +} + +.scroll-pane .scroll-bar .thumb:hover { + -fx-background-color: #666666; +} + +.notebook-tips-list { + -fx-padding: 10; + -fx-spacing: 10; + -fx-background-color: transparent; +} + +.notebook-tips-list .text-flow { + -fx-padding: 12; + -fx-background-color: #000000; + -fx-background-radius: 15; +} + +.settings-box { + -fx-background-color: #000000; + -fx-background-radius: 23; + -fx-border-radius: 20; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; + -fx-border-width: 3; + -fx-effect: dropshadow(one-pass-box, rgb(255, 255, 255), 0, 0, 5, 5); + /*-fx-cursor: move;*/ + -fx-padding: 0 0 15 0; +} + +.settings-box:hover { + -fx-border-color: #ffffff; +} + +.settings-box.player-active-turn { + /* Active turn should only change the shadow to avoid flicker/transparency jumps. */ + -fx-effect: dropshadow(one-pass-box, rgb(184, 134, 11), 0, 0, 5, 5); +} + +.settings-header { + -fx-background-color: transparent; + -fx-background-radius: 20 20 0 0; + -fx-padding: 10 15; + -fx-cursor: move; + -fx-border-width: 0 0 1 0; +} + +.settings-label { + -fx-text-fill: #ffffff; + -fx-font-size: 18px; + -fx-font-weight: bold; + /*-fx-effect: dropshadow(one-pass-box, rgb(255, 255, 255), 0, 0, 3, 3);*/ +} + +.settings-content { + -fx-padding: 15 20 20 20; + -fx-spacing: 12; +} + +.settings-content { + -fx-background-color: transparent; + -fx-text-fill: #ffffff; + -fx-font-size: 13px; +} + +.radio-button { + -fx-text-fill: #ffffff; + -fx-font-size: 13px; + + -fx-padding: 6 8; + -fx-background-radius: 10; +} + +.radio-button:hover { + -fx-font-size: 15px; +} + +.radio-button:selected { + -fx-text-fill: #b8860b; +} + +.radio-button .radio { + -fx-background-color: #b8860b; + /*-fx-border-width: 3;*/ + /*-fx-border-color: #b8860b;*/ + /*-fx-border-radius: 50%;*/ +} + +.radio-button:selected .radio { + -fx-background-color: #b8860b; + -fx-effect: dropshadow(gaussian, rgba(184,134,11,0.8), 6, 0.3, 0, 0); +} + +.settings-box { + -fx-background-insets: 0; +} + +.settings-content { + -fx-background-color: transparent; +} + +/*chat box css*/ + +.chat-box { + -fx-background-color: #000000 !important; + -fx-background-radius: 58; + -fx-border-radius: 50; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10 !important; + -fx-border-width: 12; + -fx-padding: 20; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255), 0, 0, 15, 15) !important; +} + +.tab-chat-box { + -fx-background-color: #000000 !important; + -fx-background-radius: 23 !important; + -fx-border-radius: 20 !important; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10 !important; + -fx-border-width: 3 !important; + -fx-padding: 20; +} + +.chat-header { + -fx-text-fill: #ffffff !important; + -fx-font-size: 22px; + -fx-font-weight: bold; + -fx-padding: 0 0 10 0; + -fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 0, 0) !important; +} + +.chat-separator { + -fx-background-color: #ffffff !important; + -fx-min-height: 4px; + -fx-effect: dropshadow(one-pass-box, #000000, 0, 0, 0, 0) !important; +} + +.tab-pane .tab-header-area .tab-header-background { + -fx-opacity: 0; + -fx-background-color: #000000 !important; + -fx-background-radius: 18 !important; + -fx-border-radius: 10 !important; + -fx-border-color: #000000 !important; + -fx-border-width: 5; + -fx-padding: 10; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important; + -fx-min-height: 10; +} + +.tab-pane .tab { + -fx-background-color: #000000 !important; + -fx-background-radius: 18 !important; + -fx-border-radius: 10 !important; + -fx-border-color: #000000 !important; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important; + -fx-border-width: 5; + -fx-padding: 6 15; +} + +.tab-pane .tab:selected { + -fx-background-color: #000000 !important; + -fx-background-radius: 18 !important; + -fx-border-radius: 10 !important; + -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10 !important; + -fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important; + -fx-border-width: 3 !important; + -fx-padding: 6 15; +} + +.tab-pane .tab .tab-close-button { + -fx-text-fill: #ffffff; +} + +.tab-pane .tab-header-area .headers-region { + -fx-background-color: #000000 !important; +} + +.tab .tab-label { + -fx-alignment: CENTER; + -fx-text-fill: #ffffff; + -fx-font-size: 12px; + -fx-font-weight: bold; +} + +.tab:selected .tab-label { + -fx-alignment: CENTER; + -fx-text-fill: #ffffff; +} + +.menu-button { + -fx-background-color: #000000 !important; + -fx-border-color: #333333 !important; + -fx-text-fill: #ffffff !important; + -fx-background-radius: 12 !important; + -fx-border-radius: 12 !important; + -fx-font-family: "Courier New" !important; + -fx-font-weight: bold !important; + -fx-border-width: 2 !important; + -fx-padding: 6 15 !important; + -fx-cursor: hand !important; +} + +.menu-button .label { + -fx-text-fill: #ffffff !important; +} + +.menu-button:hover { + -fx-translate-y: -3 !important; + -fx-effect: dropshadow(one-pass-box, rgba(255, 255, 255, 0.8), 0, 0, 3, 3) !important; +} + +.menu-button .menu-item { + -fx-background-color: #333333 !important; + -fx-border-color: #333333 !important; + -fx-text-fill: #ffffff; +}