Explore CSS

nomadcoders · Nov 19, 2017 · 0c4fbb0 · 0c4fbb0
1 parent 2c90557
commit 0c4fbb0
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 4 deletions.
diff --git a/frontend/src/components/Explore/presenter.js b/frontend/src/components/Explore/presenter.js
@@ -13,13 +13,13 @@ const Explore = props => {
 };
 
 const LoadingExplore = props => (
-  <div className={styles.feed}>
+  <div className={styles.explore}>
     <Loading />
   </div>
 );
 
 const RenderExplore = props => (
-  <div className={styles.feed}>
+  <div className={styles.explore}>
     {props.userList.map(user => (
       <UserRow big={true} user={user} key={user.id} />
     ))}

diff --git a/frontend/src/components/Explore/styles.scss b/frontend/src/components/Explore/styles.scss
@@ -1,9 +1,12 @@
 .explore {
-  min-height: 500px;
   display: flex;
   flex-direction: column;
   width: 100%;
-  max-width: $max-page-width;
+  max-width: $max-card-width;
   margin: 0 auto;
   align-items: center;
+  @include boxBorder(yes);
+  @include breakpoint("phone") {
+    background-color: transparent;
+  }
 }
diff --git a/frontend/src/components/UserRow/styles.scss b/frontend/src/components/UserRow/styles.scss
@@ -6,6 +6,12 @@
   width: 100%;
   box-sizing: border-box;
   border-bottom: 1px solid $light-grey;
+  &:last-child {
+    border: 0;
+  }
+  @include breakpoint("phone-tablet") {
+    border-bottom: 0;
+  }
   .column {
     display: flex;
     align-items: center;