better error modal.

css/app.css

@@ -1642,7 +1642,7 @@ div.typeahead a:first-child {
     left: 0;
     right: 0;
     margin: auto;
-    top: 80px;
+    top: 30px;
     z-index: 3;
 }
 
@@ -2039,7 +2039,7 @@ a.success-action {
 ------------------------------------------------------- */
 
 @media only screen and (max-width: 840px) {
-    #bar span.label {display: none;}
+    #bar .label {display: none;}
     #bar .icon.icon-pre-text { margin-right: 0px;}
     /* override hide for save button */
     #bar .save .label { display: block;}

js/id/ui/commit.js

@@ -70,10 +70,9 @@ iD.ui.Commit = function(context) {
             .attr('class', 'commit-info')
             .html(t('commit.upload_explanation', {user: userLink.html()}));
 
-        // Confirm / Cancel Buttons
-
+        // Confirm Button
         var saveButton = saveSection.append('button')
-            .attr('class', 'action col3 button')
+            .attr('class', 'action col2 button')
             .on('click.save', function() {
                 var comment = commentField.node().value;
                 localStorage.comment = comment;

js/id/ui/confirm.js

@@ -4,17 +4,19 @@ iD.ui.confirm = function(selection) {
     modal.select('.modal')
         .classed('modal-alert', true);
 
-    var section = modal.select('.content')
-        .attr('class', 'modal-section');
+    var section = modal.select('.content');
+
+    var modalHeader = section.append('div')
+        .attr('class', 'modal-section header');
 
     var description = section.append('div')
-        .attr('class', 'description');
+        .attr('class', 'modal-section message-text');
 
     var buttonwrap = section.append('div')
-        .attr('class', 'buttons cf');
+        .attr('class', 'modal-section buttons cf');
 
     var okbutton = buttonwrap.append('button')
-        .attr('class', 'col2 action centered')
+        .attr('class', 'col2 action')
         .on('click.confirm', function() {
             modal.remove();
         })

js/id/ui/restore.js

@@ -11,7 +11,7 @@ iD.ui.Restore = function(context) {
         var introModal = modal.select('.content');
 
         introModal.append('div')
-            .attr('class', 'modal-section fillL')
+            .attr('class', 'modal-section header')
             .append('h3')
             .text(t('restore.description'));
 

js/id/ui/save.js

@@ -39,11 +39,15 @@ iD.ui.Save = function(context) {
             function(err, changeset_id) {
                 loading.remove();
                 if (err) {
-                    var desc = iD.ui.confirm(context.container())
-                        .select('.description');
-                    desc.append('h2')
+                    var confirm = iD.ui.confirm(context.container());
+                    confirm
+                        .select('.modal-section.header')
+                        .append('h3')
                         .text(t('save.error'));
-                    desc.append('p').text(err.responseText);
+                    confirm
+                        .select('.modal-section.message-text')
+                        .append('p')
+                        .text(err.responseText);
                 } else {
                     history.reset();
                     map.flush().redraw();

js/id/ui/tag_reference.js

@@ -4,7 +4,7 @@ iD.ui.tagReference = function(selection) {
         var selection = d3.select(this);
         var header = selection.append('div')
             .attr('class','modal-section fillL header')
-            .append('h2');
+            .append('h3');
 
         header.selectAll('span.icon')
             .data(g('types'))
@@ -23,7 +23,7 @@ iD.ui.tagReference = function(selection) {
             .attr('class','modal-section fillL2');
 
         referenceBody
-            .append('h5')
+            .append('h4')
             .text(t('tag_reference.description'));
 
         if (selection.datum().image) {