From 96d25cc91d171370190061fa2b66e867a207459a Mon Sep 17 00:00:00 2001
From: Connor Turland <connorturland@gmail.com>
Date: Mon, 24 Oct 2016 14:23:05 +0000
Subject: [PATCH] mapper profile mobile styling

---
 app/assets/stylesheets/base.css.erb    | 6 +++---
 app/assets/stylesheets/mobile.scss.erb | 5 +++++
 frontend/src/components/Maps/index.js  | 3 ++-
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/app/assets/stylesheets/base.css.erb b/app/assets/stylesheets/base.css.erb
index 2e266272..09120edd 100644
--- a/app/assets/stylesheets/base.css.erb
+++ b/app/assets/stylesheets/base.css.erb
@@ -957,7 +957,7 @@ font-family: 'din-regular', helvetica, sans-serif;
 /* mapper card */
 
 .mapper {
-    float: left;
+    display: inline-block;
     width:220px;
     height:340px;
     font-size: 12px;
@@ -989,10 +989,10 @@ font-family: 'din-regular', helvetica, sans-serif;
     font-size: 24px;
     text-align: center;
     margin-top: 24px;
-    padding: 0 16px;
+    padding: 0 5%;
     white-space: nowrap;
     text-overflow: ellipsis;
-    width: 189px;
+    width: 90%;
     overflow: hidden;
 }
 
diff --git a/app/assets/stylesheets/mobile.scss.erb b/app/assets/stylesheets/mobile.scss.erb
index 1cf3ff4d..64794153 100644
--- a/app/assets/stylesheets/mobile.scss.erb
+++ b/app/assets/stylesheets/mobile.scss.erb
@@ -90,6 +90,11 @@
   #exploreMaps > div {
     margin-top: 70px;
   }
+  
+  .mapper {
+    width: 100%;
+    margin: 0 0 30px 0;
+  }
 
   .map.newMap {
     a {
diff --git a/frontend/src/components/Maps/index.js b/frontend/src/components/Maps/index.js
index 421cf056..4dc1ab23 100644
--- a/frontend/src/components/Maps/index.js
+++ b/frontend/src/components/Maps/index.js
@@ -4,9 +4,10 @@ import Header from './Header'
 import MapperCard from './MapperCard'
 import MapCard from './MapCard'
 
+// 220 wide + 16 padding on both sides
 const MAP_WIDTH = 252
 const MOBILE_VIEW_BREAKPOINT = 504
-const MOBILE_VIEW_PADDING = 20
+const MOBILE_VIEW_PADDING = 40
 const MAX_COLUMNS = 4
 
 class Maps extends Component {