Improve ui

potaotototo · Oct 28, 2024 · 2405f03 · 2405f03
1 parent 41fb839
commit 2405f03
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 28 deletions.
diff --git a/src/main/resources/view/DarkTheme.css b/src/main/resources/view/DarkTheme.css
@@ -77,19 +77,18 @@
 }
 
 .split-pane:horizontal .split-pane-divider {
-    -fx-background-color: derive(#1d1d1d, 20%);
-    -fx-border-color: transparent transparent transparent #4d4d4d;
+    -fx-background-color: #fdf5f5;
+    -fx-border-width: 0;
 }
 
 .split-pane {
-    -fx-border-radius: 1;
-    -fx-border-width: 1;
-    -fx-background-color: derive(#1d1d1d, 20%);
+    -fx-background-color: #fdf5f5;
+    -fx-border-width: 0;
 }
 
 .list-view {
     -fx-background-insets: 0;
-    -fx-padding: 5;
+    -fx-padding: 5 0 0 5; /* top right bottom left */
     -fx-background-color: #fdf5f5
 }
 
@@ -129,34 +128,30 @@
 .cell_big_label {
     -fx-font-family: "Raleway Semibold";
     -fx-font-size: 16px;
-    -fx-text-fill: derive(#757575, -10%);
+    -fx-text-fill: derive(#757575, -50%);
 }
 
 .cell_small_label {
     -fx-font-family: "Raleway";
     -fx-font-size: 12px;
-    -fx-text-fill: derive(#757575, -10%);
+    -fx-text-fill: derive(#757575, -50%);
 }
 
 .card_big_label {
-    -fx-font-family: "Raleway Semibold";
-        -fx-font-size: 16px;
-        -fx-text-fill: derive(#757575, -10%);
+    -fx-font-family: "Raleway Black";
+        -fx-font-size: 26px;
+        -fx-text-fill: derive(#757575, -50%);
+    -fx-padding: 8 0 5 0;
 }
 
 .card_small_label {
     -fx-font-family: "Raleway";
-    -fx-font-size: 12px;
-    -fx-text-fill: derive(#757575, -10%);
+    -fx-font-size: 16px;
+    -fx-text-fill: derive(#757575, -50%);
 }
 
 .stack-pane {
      -fx-background-color: #fdf5f5;
-     /*-fx-padding: 10px;*/
-}
-
-.right-pane {
-    -fx-background-color: #fdf5f5;
 }
 
 .pane-with-border {
@@ -388,3 +383,21 @@
     -fx-background-radius: 2;
     -fx-font-size: 12;
 }
+
+#remarks {
+    -fx-spacing: 2;
+    -fx-padding: 5 0 10 0;
+}
+
+#remarks .label {
+    -fx-font-family: "Raleway";
+        -fx-font-style: italic;
+    -fx-font-size: 12px;
+    -fx-text-fill: derive(#e8def8, -50%);
+    -fx-background-color: #fdf5f5;
+    -fx-padding: 3 5 3 5;
+    -fx-background-radius: 3;
+    -fx-border-radius: 3;
+    -fx-border-color: #e0e0e0;
+    -fx-border-width: 1;
+}
diff --git a/src/main/resources/view/DisplayCard.fxml b/src/main/resources/view/DisplayCard.fxml
@@ -41,7 +41,7 @@
             <Label fx:id="email" styleClass="card_small_label" text="\$email" managed="${email.visible}" />
 
             <!-- Remarks -->
-            <VBox fx:id="remarks" spacing="5">
+            <VBox fx:id="remarks">
             </VBox>
         </VBox>
     </GridPane>

diff --git a/src/main/resources/view/MainWindow.fxml b/src/main/resources/view/MainWindow.fxml
@@ -38,14 +38,14 @@
         <SplitPane xmlns="http://javafx.com/javafx/17"
                    xmlns:fx="http://javafx.com/fxml/1"
                    VBox.vgrow="ALWAYS"
-                   dividerPositions="0.3">
+                   dividerPositions="0.4">
           <!-- Left: Person List -->
           <StackPane fx:id="personListPanelPlaceholder"
-                     minWidth="200"
-                     maxWidth="200"/>  <!-- Add maxWidth to fix the width -->
+                     minWidth="260"
+                     maxWidth="260"/>
           <!-- Right: Display Card -->
           <StackPane fx:id="displayCardPanelPlaceholder"
-                     minWidth="200"/>
+                     minWidth="800"/>
         </SplitPane>
 
         <!-- Result Display -->

diff --git a/src/main/resources/view/PersonListPanel.fxml b/src/main/resources/view/PersonListPanel.fxml
@@ -4,8 +4,6 @@
 <?import javafx.scene.layout.VBox?>
 
 <?import javafx.scene.layout.HBox?>
-<HBox>
-  <VBox xmlns="http://javafx.com/javafx/17" xmlns:fx="http://javafx.com/fxml/1">
-    <ListView fx:id="personListView" VBox.vgrow="ALWAYS" />
-  </VBox>
-</HBox>
+<VBox xmlns="http://javafx.com/javafx/17" xmlns:fx="http://javafx.com/fxml/1">
+  <ListView fx:id="personListView" VBox.vgrow="ALWAYS" />
+</VBox>