Merge pull request #171 from sharetribe/layout-fixes

Layout fixes

src/containers/SearchPage/SearchPage.css

@@ -2,6 +2,10 @@
   width: 100%;
 }
 
+.searchResultSummary {
+  margin: 0 1rem;
+}
+
 .tab {
   display: none;
 }

src/containers/SearchPage/SearchPage.js

@@ -102,10 +102,12 @@ export const SearchPageComponent = props => {
 
   return (
     <PageLayout title={`Search page: ${tab}`}>
-      {searchListingsError ? searchError : null}
-      {listingsAreLoaded && totalItems > 0 ? resultsFound : null}
-      {listingsAreLoaded && totalItems === 0 ? noResults : null}
-      {searchInProgress ? loadingResults : null}
+      <div className={css.searchResultSummary}>
+        {searchListingsError ? searchError : null}
+        {listingsAreLoaded && totalItems > 0 ? resultsFound : null}
+        {listingsAreLoaded && totalItems === 0 ? noResults : null}
+        {searchInProgress ? loadingResults : null}
+      </div>
       <div className={css.container}>
         <div className={filtersClassName}>
           <FilterPanel />

src/containers/SearchPage/__snapshots__/SearchPage.test.js.snap

@@ -1,6 +1,7 @@
 exports[`SearchPageComponent matches snapshot 1`] = `
 <Connect(withRouter(PageLayout))
   title="Search page: listings">
+  <div />
   <div>
     <div
       className="">

src/containers/SignupForm/SignupForm.css

@@ -8,17 +8,12 @@
 
 .name {
   display: flex;
+  justify-content: space-between;
 }
 
-.firstName {
-  display: inline-block;
-  width: 35%;
-  margin-right: 1rem;
-}
-
-.lastName {
-  display: inline-block;
-  width: calc(100% - 35% - 1rem);
+.firstNameRoot,
+.lastNameRoot {
+  width: calc(50% - 0.5rem);
 }
 
 .button {

src/containers/SignupForm/SignupForm.js

@@ -15,11 +15,11 @@ class SignupFormComponent extends Component {
       errorClassName: css.error,
     });
     this.EnhancedFirstNameInput = enhancedField('input', {
-      rootClassName: css.firstName,
+      rootClassName: css.firstNameRoot,
       errorClassName: css.error,
     });
     this.EnhancedLastNameInput = enhancedField('input', {
-      rootClassName: css.lastName,
+      rootClassName: css.lastNameRoot,
       errorClassName: css.error,
     });
   }
@@ -75,7 +75,6 @@ class SignupFormComponent extends Component {
           />
           <div className={css.name}>
             <Field
-              className={css.firstName}
               name="firstName"
               type="text"
               label={firstNameLabel}
@@ -83,7 +82,6 @@ class SignupFormComponent extends Component {
               component={this.EnhancedFirstNameInput}
             />
             <Field
-              className={css.lastName}
               name="lastName"
               type="text"
               label={lastNameLabel}