From 83f4292ecb5415bf3c095e734ab4068299b4a7a9 Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Fri, 9 Jun 2023 02:22:37 +0200
Subject: [PATCH] Created the InfoArea.jsx

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

diff --git a/webui/src/pages/GameCreation/components/InfoArea/InfoArea.jsx b/webui/src/pages/GameCreation/components/InfoArea/InfoArea.jsx
new file mode 100644
index 0000000..17c0712
--- /dev/null
+++ b/webui/src/pages/GameCreation/components/InfoArea/InfoArea.jsx
@@ -0,0 +1,32 @@
+import "./styles.sass";
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {faUser, faUserGroup} from "@fortawesome/free-solid-svg-icons";
+import Member from "@/pages/GameCreation/components/InfoArea/components/Member";
+
+export const InfoArea = () => {
+
+    return (
+        <div className="info-area">
+            <h1>Spiel erstellen</h1>
+            <p className="info-subtext">Lade bis zu 10 Freunde ein!</p>
+
+            <div className="member-area">
+
+                <div className="member-title">
+                    <FontAwesomeIcon icon={faUserGroup} />
+                    <p>Mitspieler</p>
+                </div>
+
+                <div className="member-grid">
+
+                    <Member name="User" />
+
+                    <Member name="User Nr. 2" />
+
+                </div>
+            </div>
+
+        </div>
+    );
+
+}
\ No newline at end of file