Polished race view text area and send button UI style to make them pretty

tags: #story[1245]
2026-05-09 06:18:44 +00:00 · 2017-09-12 10:59:07 +12:00
parent 235d6c9cef
commit 8c2125276e
96 changed files with 171 additions and 21299 deletions
@@ -0,0 +1,93 @@
+@font-face {
+    src: url("Baloo-Regular.ttf");
+}
+
+* {
+    -fx-pp-light-text-color: #fff;
+    -fx-pp-dark-text-color: #6c6c6c;
+    -fx-pp-theme-color: #3493e3;
+    -fx-pp-light-theme-color: #38a2fa;
+    -fx-pp-background-color: transparent;
+    -fx-pp-front-color: #fff;
+    -fx-font-family: "Baloo";
+
+    -fx-pp-dropshadow-light: dropshadow(gaussian, rgba(0, 0, 0, 0.1), 10.0, 0.2, 3, 4);
+    -fx-pp-dropshadow-dark: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 10.0, 0.2, 5, 6);
+}
+
+/*GridPane .jfx-button {*/
+/*-fx-min-height: 65px; !* because we changed the font, we now need to set mini height for all buttons *!*/
+/*}*/
+
+.jfx-button {
+    -fx-cursor: hand;
+}
+
+.jfx-button:pressed {
+    -fx-cursor: wait;
+}
+
+.jfx-text-field {
+    -jfx-label-float: true;
+}
+
+.jfx-decorator {
+    -fx-decorator-color: -fx-pp-theme-color;
+}
+
+.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;
+}
+/********* customised scroll bar for scroll pane ***********/
+
+/* The main scrollbar **track** CSS class  */
+.scroll-bar:horizontal .track,
+.scroll-bar:vertical .track {
+    -fx-background-color: white;
+    -fx-border-color: derive(-fx-pp-background-color, 50%);
+    -fx-border-style: solid;
+    -fx-border-width: 3px;
+    -fx-background-radius: 0em;
+    -fx-border-radius: 0em;
+}
+
+/* The increment and decrement button CSS class of scrollbar */
+.scroll-bar:horizontal .increment-button,
+.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 */
+
+.scroll-bar:vertical .increment-button,
+.scroll-bar:vertical .decrement-button {
+    -fx-background-color: transparent;
+    -fx-background-radius: 0em;
+    -fx-padding: 0 10 0 10; /* set scroll bar width */
+
+}
+
+.scroll-bar .increment-arrow,
+.scroll-bar .decrement-arrow {
+    -fx-shape: " ";
+    -fx-padding: 0;
+}
+
+/* The main scrollbar **thumb** CSS class which we drag every time (movable) */
+.scroll-bar:horizontal .thumb,
+.scroll-bar:vertical .thumb {
+    -fx-background-color: derive(#c9c9cb, 0%);
+    -fx-background-insets: 2, 0, 0;
+    -fx-background-radius: 0em;
+}
+
+.scroll-bar {
+    -fx-background-insets: 0;
+}