From 7d705b4bd5da933e5a150101c768bddd5a7d58ed Mon Sep 17 00:00:00 2001
From: Tom MacWright <tom@macwright.org>
Date: Wed, 9 Jan 2013 12:40:17 -0500
Subject: [PATCH] Restyle notice and move responsibility for it outside of the
 map. Fixes #131

---
 css/app.css           | 18 ++++++++++--------
 js/id/id.js           |  6 ++++++
 js/id/renderer/map.js | 11 +----------
 3 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/css/app.css b/css/app.css
index 82e90b0e3..822f272e9 100644
--- a/css/app.css
+++ b/css/app.css
@@ -924,15 +924,17 @@ div.typeahead a:first-child {
 
 .notice {
     position:absolute;
-    top:0px;
-    left:70px;
-    width:250px;
-    height:50px;
-    padding:10px;
+    top:11px;
+    left:11px;
+    width:278px;
+    text-align: center;
+    height:38px;
+    padding:10px 20px;
     background:#fff;
-    font-size: 20px;
-    font-weight: bold;
-    line-height:30px;
+    font-weight: normal;
+    line-height: 21px;
+    border-radius:5px;
+    opacity: 0.9;
 }
 
 /* Tooltips
diff --git a/js/id/id.js b/js/id/id.js
index 64090e5a2..1c5c347aa 100644
--- a/js/id/id.js
+++ b/js/id/id.js
@@ -38,12 +38,18 @@ window.iD = function(container) {
         function disableTooHigh() {
             if (map.zoom() < 16) {
                 buttons.attr('disabled', 'disabled');
+                notice.message('Zoom in to edit the map');
                 controller.enter(iD.modes.Browse());
             } else {
+                notice.message('');
                 buttons.attr('disabled', null);
             }
         }
 
+        notice = iD.notice(bar
+            .append('div')
+            .attr('class', 'notice'));
+
         map.on('move.disable-buttons', disableTooHigh)
             .on('move.contributors', _.debounce(function() {
                 contributors.call(iD.contributors(map));
diff --git a/js/id/renderer/map.js b/js/id/renderer/map.js
index 5b1dfadf8..f63ee682f 100644
--- a/js/id/renderer/map.js
+++ b/js/id/renderer/map.js
@@ -12,7 +12,6 @@ iD.Map = function() {
             .on('zoom', zoomPan),
         dblclickEnabled = true,
         fastEnabled = true,
-        notice,
         background = iD.Background()
             .projection(projection),
         transformProp = iD.util.prefixCSSProperty('Transform'),
@@ -52,11 +51,6 @@ iD.Map = function() {
         var arrow = surface.append('text').text('►----');
         alength = arrow.node().getComputedTextLength();
         arrow.remove();
-
-        notice = iD.notice(supersurface
-            .append('div')
-            .attr('class', 'notice'));
-
         map.size(this.size());
         map.surface = surface;
 
@@ -192,13 +186,10 @@ iD.Map = function() {
     }
 
     function editOff() {
-        notice.message('Zoom in to edit the map');
         surface.selectAll('.layer-g *').remove();
     }
 
-    function editOn() {
-        notice.message('');
-    }
+    function editOn() { }
 
     function drawLines(data, filter, group, fixedClasses) {
         var lines = group.selectAll('path')