From ba4173f029fd3aa9348bca500baa869a3b9379f4 Mon Sep 17 00:00:00 2001
From: ramollia <@>
Date: Sat, 4 Oct 2025 16:24:27 +0200
Subject: [PATCH] add: separators

---
 .../java/org/toop/app/layer/Container.java    | 15 ++++++++++++-
 .../app/layer/layers/MultiplayerLayer.java    |  2 ++
 app/src/main/resources/assets/style/app.css   | 21 ++++++++++++++++++-
 3 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/app/src/main/java/org/toop/app/layer/Container.java b/app/src/main/java/org/toop/app/layer/Container.java
index 5f37e58..afcc1bc 100644
--- a/app/src/main/java/org/toop/app/layer/Container.java
+++ b/app/src/main/java/org/toop/app/layer/Container.java
@@ -5,8 +5,10 @@ import org.toop.framework.eventbus.GlobalEventBus;
 
 import javafx.beans.property.BooleanProperty;
 import javafx.beans.property.SimpleBooleanProperty;
+import javafx.geometry.Orientation;
 import javafx.scene.Node;
 import javafx.scene.control.Label;
+import javafx.scene.control.Separator;
 import javafx.scene.control.Slider;
 import javafx.scene.control.TextField;
 import javafx.scene.layout.Region;
@@ -19,7 +21,6 @@ public abstract class Container {
 	public abstract Region getContainer();
 
 	public abstract void addNode(Node node);
-
 	public abstract void addContainer(Container container, boolean fill);
 
 	public void addText(String cssClass, String x, boolean wrap) {
@@ -129,4 +130,16 @@ public abstract class Container {
 	public void addInput(String input, Consumer<String> consumer) {
 		addInput("input", input, consumer);
 	}
+
+	public void addSeparator(String cssClass, boolean horizontal) {
+		final Separator element = new Separator(horizontal ? Orientation.HORIZONTAL : Orientation.VERTICAL);
+		element.getStyleClass().add(cssClass);
+		element.setMinSize(50, 50);
+
+		addNode(element);
+	}
+
+	public void addSeparator(boolean horizontal) {
+		addSeparator("separator", horizontal);
+	}
 }
\ No newline at end of file
diff --git a/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java b/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java
index 56ed738..d1b0437 100644
--- a/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java
+++ b/app/src/main/java/org/toop/app/layer/layers/MultiplayerLayer.java
@@ -87,6 +87,8 @@ public class MultiplayerLayer extends Layer {
 			player2Container.addInput("", (input) -> {
 			});
 
+			player2Container.addSeparator(true);
+
 			player2Container.addText("Server Port", true);
 			player2Container.addInput("", (input) -> {
 			});
diff --git a/app/src/main/resources/assets/style/app.css b/app/src/main/resources/assets/style/app.css
index 4d8dc33..6c2c859 100644
--- a/app/src/main/resources/assets/style/app.css
+++ b/app/src/main/resources/assets/style/app.css
@@ -13,7 +13,7 @@
     -fx-background-radius: 5;
 }
 
-.text, .button, .toggle, .input {
+.text, .button, .toggle {
 	-fx-padding: 10;
 
 	-fx-fill: white;
@@ -37,6 +37,21 @@
 	-fx-effect: dropshadow(gaussian, #007fff, 10, 0.5, 0, 0);
 }
 
+.input {
+	-fx-padding: 10;
+
+	-fx-fill: white;
+	-fx-text-fill: white;
+
+	-fx-font-family: "Segoe UI", sans-serif;
+	-fx-font-weight: bold;
+	-fx-font-size: 20px;
+
+	-fx-background-color: transparent;
+
+	-fx-border-color: #7f7f7f;
+}
+
 .input:focused {
 	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
 	-fx-background-insets: 0, 2;
@@ -58,4 +73,8 @@
 
 .slider .thumb {
 	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
+}
+
+.separator {
+	-fx-background-color: linear-gradient(to bottom right, orange, indigo), #1d1d1d;
 }
\ No newline at end of file