Add message to the issues pane for when there are no issues

css/80_app.css

@@ -2967,7 +2967,7 @@ div.full-screen > button:hover {
     color: #DD1400
 }
 
-/* Issues Pane List */
+/* Issues Pane */
 
 .issues-list label {
     padding: 5px;
@@ -2982,6 +2982,18 @@ div.full-screen > button:hover {
     position: static;
 }
 
+.issues-none {
+    border-radius: 4px;
+    border: 1px solid #72D979;
+    background: #C6FFCA;
+    padding: 5px !important;
+    display: flex;
+    margin-top: 5px;
+}
+.issues-none .icon {
+    color: #05AC10;
+}
+
 /* Entity Issues List */
 
 .entity-issues {

data/core.yaml

@@ -1172,6 +1172,9 @@ en:
     warnings:
       list_title: "Warnings ({count})"
       icon_tooltip: warning
+    no_issues:
+      message: Everything looks fine.
+      info: Any issues will be shown here as you edit.
     options:
       title: Options
     almost_junction:
@@ -1236,7 +1239,7 @@ en:
         undo_redo: Connected crossing features.
       connect_almost_junction:
         title: Connect the features
-        undo_redo: Connected two very close features.
+        undo_redo: Connected very close features.
       continue_feature:
         title: Continue this feature
       delete_feature:

dist/locales/en.json

@@ -1421,6 +1421,10 @@
                 "list_title": "Warnings ({count})",
                 "icon_tooltip": "warning"
             },
+            "no_issues": {
+                "message": "Everything looks fine.",
+                "info": "Any issues will be shown here as you edit."
+            },
             "options": {
                 "title": "Options"
             },
@@ -1512,7 +1516,7 @@
                 },
                 "connect_almost_junction": {
                     "title": "Connect the features",
-                    "undo_redo": "Connected two very close features."
+                    "undo_redo": "Connected very close features."
                 },
                 "continue_feature": {
                     "title": "Continue this feature"

modules/ui/issues.js

@@ -113,16 +113,6 @@ export function uiIssues(context) {
 
     function drawIssuesList(selection, issues) {
 
-        /*validations = _reduce(issues, function(validations, val) {
-            var severity = val.severity;
-            if (validations.hasOwnProperty(severity)) {
-                validations[severity].push(val);
-            } else {
-                validations[severity] = [val];
-            }
-            return validations;
-        }, {});*/
-
         var items = selection.selectAll('li')
             .data(issues, function(d) { return d.id(); });
 
@@ -172,12 +162,6 @@ export function uiIssues(context) {
                 .call(svgIcon('#iD-icon-' + iconSuffix, 'pre-text'));
         });
 
-        /*label
-            .append('input')
-            .attr('type', type)
-            .attr('name', name)
-            .on('change', change);
-*/
         label
             .append('span')
             .text(function(d) { return d.message; });
@@ -187,6 +171,22 @@ export function uiIssues(context) {
             .merge(enter);
     }
 
+    function renderNoIssuesBox(selection) {
+
+        selection.append('div')
+            .call(svgIcon('#iD-icon-apply', 'pre-text'));
+
+        var noIssuesLabel = selection.append('span');
+
+        noIssuesLabel.append('strong')
+            .text(t('issues.no_issues.message'));
+
+        noIssuesLabel.append('br');
+
+        noIssuesLabel.append('span')
+            .text(t('issues.no_issues.info'));
+    }
+
     function showsFeatureApplicability(d) {
         return context.validator().getFeatureApplicability() === d;
     }
@@ -242,6 +242,8 @@ export function uiIssues(context) {
             }
         }
 
+        pane.select('.issues-none').classed('hide', warnings.length > 0 || errors.length > 0);
+
         //if (!pane.select('.disclosure-wrap-issues_options').classed('hide')) {
         //    updateFeatureApplicabilityList();
         //}
@@ -323,6 +325,11 @@ export function uiIssues(context) {
             .append('div')
             .attr('class', 'pane-content');
 
+        content
+            .append('div')
+            .attr('class', 'issues-none')
+            .call(renderNoIssuesBox)
+
         // errors
         content
             .append('div')