From 1ff9c529edb20f0f1cb3eb4b99eff49e5e8f41f9 Mon Sep 17 00:00:00 2001
From: Moeez Muhammad <mmoeez48@gmail.com>
Date: Sat, 28 Dec 2019 15:05:41 -0500
Subject: [PATCH] Style input to be beside the table and add label

---
 client/src/Matches.js   | 12 +++++++-----
 client/src/Strategy.css |  9 +++++++++
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/client/src/Matches.js b/client/src/Matches.js
index 22f9d9a..33e41f9 100644
--- a/client/src/Matches.js
+++ b/client/src/Matches.js
@@ -18,9 +18,15 @@ class Matches extends React.Component {
 
     render() {
         return(
-            <div>
+            <div className="matchesContainer">
                 <h2>Matches</h2>
                 {this.props.event_code ? [
+
+				<form className="searchTeam">
+					<label>Search Team: </label>
+					<input type="text" id="team_to_search" name="team_to_search" onChangeCapture={this.onTeamChange} />
+				</form>,
+
                 <table className='matches'>
                   <thead>
                     <tr><th className='matchNumber rightDivider'>Number</th>
@@ -46,10 +52,6 @@ class Matches extends React.Component {
                 </tbody>
 			</table>,
 
-			<form>
-				<input type="text" id="team_to_search" name="team_to_search" onChangeCapture={this.onTeamChange} />
-			</form>,
-
 					 ] :<span>Select an event</span>}
                 </div>
         );
diff --git a/client/src/Strategy.css b/client/src/Strategy.css
index dab6c6e..f9e9284 100644
--- a/client/src/Strategy.css
+++ b/client/src/Strategy.css
@@ -72,6 +72,15 @@ text-align: left;
 padding-right: 1em;
 }
 
+.matchesContainer {
+	display: inline-block;
+}
+
+.searchTeam {
+	float: right;
+	margin-left: 1vw;
+}
+
 th.rightDivider, td.rightDivider {
 	border-right: var(--divider);
 }