From 224a5bd3fdde466657e33adf52ebb4b9f30a8950 Mon Sep 17 00:00:00 2001
From: Jonathan Rainville <rainville.jonathan@gmail.com>
Date: Tue, 16 Oct 2018 16:17:06 -0400
Subject: [PATCH] fix css a bit and submit on enter press

---
 embark-ui/src/components/SearchBar.js | 15 +++++++++++++--
 embark-ui/src/components/search.css   |  3 ++-
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/embark-ui/src/components/SearchBar.js b/embark-ui/src/components/SearchBar.js
index 72aa5fa1..02f20ddb 100644
--- a/embark-ui/src/components/SearchBar.js
+++ b/embark-ui/src/components/SearchBar.js
@@ -20,6 +20,17 @@ class SearchBar extends React.Component {
     });
   }
 
+  onSubmit(e) {
+    e.preventDefault();
+    this.props.searchSubmit(this.state.searchValue);
+  }
+
+  onKeyPress(e) {
+    if (e.key === 'Enter') {
+      this.onSubmit(e);
+    }
+  }
+
   render() {
     return (
       <Row>
@@ -27,8 +38,8 @@ class SearchBar extends React.Component {
           <Form inline className="search-bar float-right">
             <FormGroup>
               <Input type="text" name="search-bar" placeholder="Search" onChange={(e) => this.onChange(e)}
-                     value={this.state.searchValue}/>
-              <Button color="secondary" onClick={() => this.props.searchSubmit(this.state.searchValue)}>
+                     value={this.state.searchValue} onKeyPress={e => this.onKeyPress(e)}/>
+              <Button color="secondary" onClick={(e) => this.onSubmit(e)}>
                 <FontAwesome name="search"/>
               </Button>
             </FormGroup>
diff --git a/embark-ui/src/components/search.css b/embark-ui/src/components/search.css
index 53e1acc6..39c5673b 100644
--- a/embark-ui/src/components/search.css
+++ b/embark-ui/src/components/search.css
@@ -1,11 +1,12 @@
 .search-bar {
-  margin-top: 10px;
+  margin: 10px 0;
 }
 
 .search-bar input {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
   border: 0;
+  outline: none;
 }
 
 .search-bar button {