daily brush

README.md

@@ -84,5 +84,7 @@ Free meal planner for cooks short on ideas! (like me …)
 
 - put a preloader
 - route bad request to notFOund (exple: /categories/string, when search results is null)
+  - Use ErrorBoundaries component ?
 - add sidenav on mobile
 - contact form
+- override Router with scoll to top function

src/App.js

@@ -169,7 +169,6 @@ const App = () => {
             searchResults={searchResults}
           />
         </Route>
-
         <Route path="/404">
           <NotFound handleClick={getRandomMeal} />
         </Route>

src/components/CardEntry.js

@@ -12,7 +12,7 @@ const CardEntry = props => {
               <div className="card-image">
                 <img src={strMealThumb} alt={strMeal} />
               </div>
-              <div class="card-content">
+              <div className="card-content">
                 <h4>{strMeal}</h4>
               </div>
             </div>

src/components/SearchBar.js

@@ -4,25 +4,27 @@ import { Link } from "react-router-dom";
 const SearchBar = props => {
   return (
     <div className="row">
-      <input
+      <form>
-        className="input-field col s10"
+        <input
-        type="text"
+          className="input-field col s10"
-        name="search"
+          type="text"
-        value={props.searchString}
+          name="search"
-        placeholder="Search a recipe"
+          value={props.searchString}
-        onChange={props.handleChange}
+          placeholder="Search a recipe"
-      />
+          onChange={props.handleChange}
-      <Link to="/search">
+        />
-        <button
+        <Link to="/search">
-          className="btn-floating waves-effect waves-light  right  "
+          <button
-          type="submit"
+            className="btn-floating waves-effect waves-light  right  "
-          name="searchButton"
+            type="submit"
-          value="Search"
+            name="searchButton"
-          onClick={props.onSubmit}
+            value="Search"
-        >
+            onClick={props.onSubmit}
-          <i className="material-icons right">send</i>
+          >
-        </button>
+            <i className="material-icons right">send</i>
-      </Link>
+          </button>
+        </Link>
+      </form>
     </div>
   );
 };