Fix user popup styles

diff --git a/app/assets/javascripts/user.js b/app/assets/javascripts/user.js
index 25456d04ebb080b46564fb359b5801fac551c163..4e1c7d0c3ff19132eced6d9458787b6b788ad220 100644 (file)
--- a/app/assets/javascripts/user.js
+++ b/app/assets/javascripts/user.js
@@ -33,7 +33,7 @@ $(document).ready(function () {
       var user = $(this).data('user');
       if (user.lon && user.lat) {
         L.marker([user.lat, user.lon], {icon: getUserIcon(user.icon)}).addTo(map)
-          .bindPopup(user.description);
+          .bindPopup(user.description, {offset: L.point(-1, -20)});
       }
     });
   }

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index ee10f6098e23f3227490cf24d8a5817dc84e56a1..c0796bdad289638fcc161493ed9db05eb9afe05d 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -1007,6 +1007,10 @@ p#contributorGuidance {
 
 /* Rules for user popups on maps */
 
+.user_popup {
+  min-width: 200px;
+}
+
 .user_popup p {
   padding-top: 3px;
   padding-bottom: 3px;

diff --git a/app/assets/stylesheets/leaflet-all.css b/app/assets/stylesheets/leaflet-all.css
index 15f427b77b3d25dfc876e55efe52589a5711763d..5270dd6b8357739e7877222fda36017e68aa151d 100644 (file)
--- a/app/assets/stylesheets/leaflet-all.css
+++ b/app/assets/stylesheets/leaflet-all.css
@@ -11,3 +11,13 @@
   background: #fff;
   border-radius: 3px;
 }
+
+/* Override some conflicting styles.
+   https://github.com/openstreetmap/openstreetmap-website/pull/121#issuecomment-10206946 */
+.leaflet-popup-content img.user_thumbnail {
+  max-width: 50px !important;
+}
+
+.user_popup p {
+  margin: 0px 2px 0px 55px !important;
+}