From 69e4f8d245409e28b7e799aaf8d33e9319513fdb Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Fri, 9 Jun 2023 02:57:31 +0200
Subject: [PATCH] Created the SettingsArea.jsx

---
 .../components/SettingsArea/SettingsArea.jsx  | 43 +++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 webui/src/pages/GameCreation/components/SettingsArea/SettingsArea.jsx

diff --git a/webui/src/pages/GameCreation/components/SettingsArea/SettingsArea.jsx b/webui/src/pages/GameCreation/components/SettingsArea/SettingsArea.jsx
new file mode 100644
index 0000000..cd341b7
--- /dev/null
+++ b/webui/src/pages/GameCreation/components/SettingsArea/SettingsArea.jsx
@@ -0,0 +1,43 @@
+import "./styles.sass";
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {faGear} from "@fortawesome/free-solid-svg-icons";
+
+export const SettingsArea = () => (
+    <div className="glassy settings-area">
+
+        <div className="settings-title">
+            <FontAwesomeIcon icon={faGear} />
+            <h2>Einstellungen</h2>
+        </div>
+
+        <div className="settings-items">
+
+            <div className="settings-item">
+                <h2>Spielmodus</h2>
+                <select className="glassy settings-input">
+                    <option value="1">Einwohner</option>
+                    <option value="2">Flächen</option>
+                </select>
+            </div>
+
+            <div className="settings-item">
+                <h2>Runden</h2>
+                <select className="glassy settings-input">
+                    {[...Array(10).keys()].map((i) => (
+                        <option value={i}>{i} Runden</option>
+                    ))}
+                </select>
+            </div>
+
+            <div className="settings-item">
+                <h2>Ratezeit</h2>
+                <select className="glassy settings-input">
+                    {[...Array(10).keys()].map((i) => (
+                        <option value={i}>{i} Sekunden</option>
+                    ))}
+                </select>
+            </div>
+
+        </div>
+    </div>
+)
\ No newline at end of file