fix(search): tweak and center align landing

client/src/components/search/searchPage/EmptySearch.js

@@ -3,7 +3,11 @@ import React from 'react';
 import './empty-search.css';
 
 function EmptySearch() {
-  return <div className='empty-search-wrapper'>Empty Search</div>;
+  return (
+    <div className='empty-search-wrapper'>
+      Looking for something? Try the search bar on this page.
+    </div>
+  );
 }
 
 EmptySearch.displayName = 'EmptySearch';

client/src/pages/search.css

@@ -0,0 +1,5 @@
+.powered-by-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}

client/src/pages/search.js

@@ -2,11 +2,14 @@ import React, { Fragment, Component } from 'react';
 import PropTypes from 'prop-types';
 import Helmet from 'react-helmet';
 import { connect } from 'react-redux';
-import { Index, PoweredBy } from 'react-instantsearch-dom';
+import { Index, PoweredBy as PoweredByAlgolia } from 'react-instantsearch-dom';
 import { Grid, Row, Col } from '@freecodecamp/react-bootstrap';
 
 import { updateSearchQuery } from '../components/search/redux';
 import SearchPageHits from '../components/search/searchPage/SearchPageHits';
+import Spacer from '../components/helpers/Spacer';
+
+import './search.css';
 
 const propTypes = { updateSearchQuery: PropTypes.func.isRequired };
 
@@ -29,7 +32,9 @@ class SearchPage extends Component {
               <main>
                 <SearchPageHits />
               </main>
-              <PoweredBy />
+              <Spacer />
+              <PoweredByAlgolia className='powered-by-wrapper' />
+              <Spacer />
             </Col>
           </Row>
         </Grid>