update[CausesPage]: Update CausesPage to have search bare fixed at th…

…e top ensuring user friendly UX
Group-5 · Apr 9, 2026 · fe43461 · fe43461
1 parent fbc4ed1
commit fe43461
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 38 deletions.
diff --git a/src/main/java/edu/group5/app/view/causespage/CausesPageView.java b/src/main/java/edu/group5/app/view/causespage/CausesPageView.java
@@ -32,7 +32,10 @@ public CausesPageView(AppState appState, NavigationController nav, OrganizationC
     setCenter(createBody());
   }
 
-  private ScrollPane createBody() {
+  private BorderPane createBody() {
+    BorderPane bodyRoot = new BorderPane();
+    bodyRoot.setTop(createSearchSection());
+
     ScrollPane body = new ScrollPane();
     body.setId("body");
     body.setFitToWidth(true);
@@ -47,11 +50,9 @@ private ScrollPane createBody() {
     // Load organizations INSTANTLY from cache
     allOrganizations = orgController.getTrustedOrgs();
 
-    vBox.getChildren().addAll(
-      createSearchSection(),
-      createOrganizationSection(null)
-    );
+    vBox.getChildren().add(createOrganizationSection(null));
     body.setContent(vBox);
+    bodyRoot.setCenter(body);
 
     // Build a map of org ID -> card for quick lookup
     Map<Integer, OrganizationCard> cardMap = new HashMap<>();
@@ -78,7 +79,7 @@ private ScrollPane createBody() {
     });
   });
 
-    return body;
+    return bodyRoot;
   }
 
   private HBox createSearchSection() {

diff --git a/src/main/resources/loginpage/login.css b/src/main/resources/loginpage/login.css
@@ -1,25 +1,35 @@
 #image-section {
-    -fx-background-image: url("/loginpage/login-image.jpg");
-    -fx-background-size: 200%;
-    -fx-background-position: left center;
-    -fx-background-repeat: no-repeat;
-    -fx-pref-width: 50%;
+  -fx-background-image: url("/loginpage/login-image.jpg");
+  -fx-background-size: 200%;
+  -fx-background-position: left center;
+  -fx-background-repeat: no-repeat;
+  -fx-pref-width: 50%;
 }
+
 #login-btn {
-    -fx-background-color: #000000;
-    -fx-text-fill: white;
-    -fx-pref-height: 35px;
+  -fx-background-color: #000000;
+  -fx-text-fill: white;
+  -fx-pref-height: 35px;
 }
 
 #register-btn {
-    -fx-background-color: #000000;
-    -fx-text-fill: white;
-    -fx-pref-height: 35px;
+  -fx-background-color: #000000;
+  -fx-text-fill: white;
+  -fx-pref-height: 35px;
 }
+
 #login-box {
-    -fx-border-color: #ccc;
-    -fx-border-radius: 8px;
-    -fx-border-width: 1px;
-    -fx-padding: 24px;
-    -fx-max-width:  340px;
+  -fx-border-color: #ccc;
+  -fx-border-radius: 8px;
+  -fx-border-width: 1px;
+  -fx-padding: 24px;
+  -fx-max-width: 340px;
+}
+
+#login-btn:hover {
+  -fx-cursor: hand;
+}
+
+#register-btn:hover {
+  -fx-cursor: hand;
 }
diff --git a/src/main/resources/loginpage/signin.css b/src/main/resources/loginpage/signin.css
@@ -1,25 +1,35 @@
 #image-section {
-    -fx-background-image: url("/loginpage/signin-image.png");
-    -fx-background-size: auto;
-    -fx-background-position: right center;
-    -fx-background-repeat: no-repeat;
-    -fx-pref-width: 50%;
+  -fx-background-image: url("/loginpage/signin-image.png");
+  -fx-background-size: auto;
+  -fx-background-position: right center;
+  -fx-background-repeat: no-repeat;
+  -fx-pref-width: 50%;
 }
+
 #login-btn {
-    -fx-background-color: #000000;
-    -fx-text-fill: white;
-    -fx-pref-height: 35px;
+  -fx-background-color: #000000;
+  -fx-text-fill: white;
+  -fx-pref-height: 35px;
 }
 
 #register-btn {
-    -fx-background-color: #000000;
-    -fx-text-fill: white;
-    -fx-pref-height: 35px;
+  -fx-background-color: #000000;
+  -fx-text-fill: white;
+  -fx-pref-height: 35px;
 }
+
 #login-box {
-    -fx-border-color: #ccc;
-    -fx-border-radius: 8px;
-    -fx-border-width: 1px;
-    -fx-padding: 24px;
-    -fx-max-width:  340px;
+  -fx-border-color: #ccc;
+  -fx-border-radius: 8px;
+  -fx-border-width: 1px;
+  -fx-padding: 24px;
+  -fx-max-width: 340px;
+}
+
+#login-btn:hover {
+  -fx-cursor: hand;
+}
+
+#register-btn:hover {
+  -fx-cursor: hand;
 }