Style: Update Chat UI themes #337

Merged
j.kropff merged 1 commits from feat/chat-ui-style-optimization into main 2026-05-14 18:42:31 +02:00
2 changed files with 36 additions and 56 deletions
Showing only changes of commit 94613626d9 - Show all commits
@@ -493,27 +493,27 @@
.scroll-pane { .scroll-pane {
-fx-background-color: transparent; -fx-background-color: transparent !important;
-fx-border-color: transparent; -fx-border-color: transparent !important;
} }
.scroll-pane .scroll-bar:vertical, .scroll-pane .scroll-bar:vertical,
.scroll-pane .scroll-bar:horizontal { .scroll-pane .scroll-bar:horizontal {
-fx-background-color: transparent; -fx-background-color: transparent !important;
} }
.scroll-pane .scroll-bar .track { .scroll-pane .scroll-bar .track {
-fx-background-color: #000000; -fx-background-color: #000000 !important;
-fx-background-radius: 5; -fx-background-radius: 5 !important;
} }
.scroll-pane .scroll-bar .thumb { .scroll-pane .scroll-bar .thumb {
-fx-background-color: #333333; -fx-background-color: #333333 !important;
-fx-background-radius: 5; -fx-background-radius: 5 !important;
} }
.scroll-pane .scroll-bar .thumb:hover { .scroll-pane .scroll-bar .thumb:hover {
-fx-background-color: #666666; -fx-background-color: #666666 !important;
} }
.notebook-tips-list { .notebook-tips-list {
@@ -624,10 +624,10 @@
.tab-chat-box { .tab-chat-box {
-fx-background-color: #000000 !important; -fx-background-color: #000000 !important;
-fx-background-radius: 23 !important; -fx-background-radius: 23;
-fx-border-radius: 20 !important; -fx-border-radius: 20;
-fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10 !important; -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10 !important;
-fx-border-width: 3 !important; -fx-border-width: 3;
-fx-padding: 20; -fx-padding: 20;
} }
@@ -647,22 +647,22 @@
.tab-pane .tab-header-area .tab-header-background { .tab-pane .tab-header-area .tab-header-background {
-fx-opacity: 0; -fx-opacity: 0;
-fx-background-color: #000000 !important; -fx-background-color: transparent;
-fx-background-radius: 18 !important; -fx-background-radius: 18 !important;
-fx-border-radius: 10 !important; -fx-border-radius: 10 !important;
-fx-border-color: #000000 !important; /*-fx-border-color: #000000 !important;*/
-fx-border-width: 5; -fx-border-width: 5;
-fx-padding: 10; -fx-padding: 10;
-fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important; /*-fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important;*/
-fx-min-height: 10; -fx-min-height: 10;
} }
.tab-pane .tab { .tab-pane .tab {
-fx-background-color: #000000 !important; -fx-background-color: transparent;
-fx-background-radius: 18 !important; -fx-background-radius: 18 !important;
-fx-border-radius: 10 !important; -fx-border-radius: 10 !important;
-fx-border-color: #000000 !important; /*-fx-border-color: #000000 !important;*/
-fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important; /*-fx-effect: dropshadow(one-pass-box, rgba(0, 0, 0), 0, 0, 0, 0) !important;*/
-fx-border-width: 5; -fx-border-width: 5;
-fx-padding: 6 15; -fx-padding: 6 15;
} }
@@ -9,12 +9,11 @@
} }
.tab-chat-box { .tab-chat-box {
-fx-background-color: #0d9e3b; -fx-background-color: #0d9e3b;
-fx-background-radius: 58; -fx-background-radius: 23;
-fx-border-radius: 50; -fx-border-radius: 20;
-fx-border-color: #0d763b #0d623b #0d623b #0d763b; -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10;
-fx-border-width: 12; -fx-border-width: 3;
-fx-padding: 20; -fx-padding: 20;
} }
@@ -121,76 +120,59 @@
-fx-background-color: transparent; -fx-background-color: transparent;
-fx-background: transparent; -fx-background: transparent;
} }
.scroll-pane { .scroll-pane {
-fx-background-color: transparent; -fx-background-color: transparent;
-fx-border-color: transparent; -fx-border-color: transparent;
} }
.scroll-pane .scroll-bar:vertical { .scroll-pane .scroll-bar:vertical,
.scroll-pane .scroll-bar:horizontal {
-fx-background-color: transparent; -fx-background-color: transparent;
} }
.scroll-pane .scroll-bar .track { .scroll-pane .scroll-bar .track {
-fx-background-color: #5c3d10; /*-fx-background-color: #5c3d10;*/
-fx-background-insets: 0; -fx-background-color: transparent;
-fx-background-radius: 5; -fx-background-radius: 5;
} }
.scroll-pane .scroll-bar .thumb { .scroll-pane .scroll-bar .thumb {
-fx-background-color: #3d260a; -fx-background-color: #3d260a;
-fx-background-insets: 0;
-fx-background-radius: 5;
-fx-pref-width: 6;
-fx-pref-height: 6;
-fx-padding: 0;
}
.scroll-pane .scroll-bar:horizontal {
-fx-background-color: transparent;
}
.scroll-pane .scroll-bar:horizontal .track {
-fx-background-color: #5c3d10;
-fx-background-radius: 5; -fx-background-radius: 5;
} }
.scroll-pane .scroll-bar:horizontal .thumb { .scroll-pane .scroll-bar .thumb:hover {
-fx-background-color: #3d260a; -fx-background-color: #2a1b07;
-fx-background-radius: 5;
-fx-pref-height: 6;
}
.scroll-pane .scroll-bar:horizontal .thumb:hover {
-fx-pref-height: 10;
} }
.tab-pane .tab-header-area .tab-header-background { .tab-pane .tab-header-area .tab-header-background {
-fx-opacity: 0; -fx-opacity: 0;
-fx-background-color: #0d9e3b; -fx-background-color: transparent;
-fx-background-radius: 18; -fx-background-radius: 18;
-fx-border-radius: 10; -fx-border-radius: 10;
-fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10; /*-fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10;*/
-fx-border-width: 5; -fx-border-width: 5;
-fx-padding: 10; -fx-padding: 10;
-fx-effect: dropshadow(one-pass-box, rgba(0,0,0,1), 0, 0, 15, 15); /*-fx-effect: dropshadow(one-pass-box, rgba(0,0,0,1), 0, 0, 15, 15);*/
-fx-min-height: 10; -fx-min-height: 10;
} }
.tab-pane .tab { .tab-pane .tab {
-fx-background-color: #0d983b; -fx-background-color: transparent;
-fx-background-radius: 28; -fx-background-radius: 28;
-fx-border-radius: 10; -fx-border-radius: 10;
-fx-border-color: #0d873b #0d733b #0d733b #0d873b; /*-fx-border-color: #0d873b #0d733b #0d733b #0d873b;*/
-fx-border-width: 5; -fx-border-width: 5;
-fx-padding: 6 15; -fx-padding: 6 15;
} }
.tab-pane .tab:selected { .tab-pane .tab:selected {
-fx-background-color: #0d873b; -fx-background-color: #0d9e3b;
-fx-background-radius: 18; -fx-background-radius: 18;
-fx-border-radius: 10; -fx-border-radius: 10;
-fx-border-color: #0d763b #0d623b #0d623b #0d763b; -fx-border-color: #5c3d10 #3d260a #3d260a #5c3d10;
-fx-border-width: 5; -fx-border-width: 3;
-fx-padding: 6 15; -fx-padding: 6 15;
} }
@@ -232,7 +214,6 @@
-fx-background-radius: 4; -fx-background-radius: 4;
-fx-padding: 6 15; -fx-padding: 6 15;
-fx-cursor: hand; -fx-cursor: hand;
} }
.menu-button:hover { .menu-button:hover {
@@ -245,4 +226,3 @@
-fx-border-color: #ffd700; -fx-border-color: #ffd700;
-fx-text-fill: #ffffff -fx-text-fill: #ffffff
} }