From 7192b13b50ce861583497b234d676ee546d1813b Mon Sep 17 00:00:00 2001
From: ficristo <ficristo.work@gmail.com>
Date: Wed, 28 Jun 2017 08:59:56 +0200
Subject: [PATCH] Problems panel: add an icon per problem to tell which type it
 is (#13430)

---
 src/htmlContent/problems-panel-table.html |  5 ++++-
 src/styles/brackets.less                  | 24 +++++++++++++++++++++++
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/src/htmlContent/problems-panel-table.html b/src/htmlContent/problems-panel-table.html
index c50f10d0200..e987187f20d 100644
--- a/src/htmlContent/problems-panel-table.html
+++ b/src/htmlContent/problems-panel-table.html
@@ -2,7 +2,7 @@
     <tbody>
         {{#reportList}}
         <tr class="inspector-section">
-            <td colspan="3">
+            <td colspan="4">
                 <span class="disclosure-triangle {{#isExpanded}}expanded{{/isExpanded}}"></span>
                 <input type="hidden" value="{{providerName}}" />
                 {{providerName}} ({{results.length}})
@@ -11,6 +11,9 @@
         {{#results}}
         <tr class="{{display}}">
             <td class="line-number" data-character="{{pos.ch}}">{{friendlyLine}}</td>
+            <td class="line-icon">
+                <div class="line-icon-default line-icon-{{type}}"></div>
+            </td>
             <td class="line-text">{{message}}</td>
             <td class="line-snippet">{{codeSnippet}}</td>
         </tr>
diff --git a/src/styles/brackets.less b/src/styles/brackets.less
index aa2c0fdef3f..ef41796b623 100644
--- a/src/styles/brackets.less
+++ b/src/styles/brackets.less
@@ -2112,9 +2112,33 @@ textarea.exclusions-editor {
         text-align: right;  // make line number line up with editor line numbers
     }
 
+    .line-icon {
+        vertical-align: middle;
+
+        .line-icon-default {
+            width: 20px;
+            height: 18px;
+            background-image: url(images/topcoat-inactive-15.svg);
+            background-repeat: no-repeat;
+            background-position: 0px 1px;
+        }
+
+        // Add an image based on the type of the problem.
+        .line-icon-problem_type_error {
+            background-image: url(images/topcoat-error-15.svg);
+        }
+        .line-icon-problem_type_warning {
+            background-image: url(images/topcoat-warning-15.svg);
+        }
+        .line-icon-problem_type_meta {
+            background-image: url(images/topcoat-inactive-15.svg);
+        }
+    }
+
     .line-text {
         white-space: nowrap;
         width: auto;
+        padding-left: 5px;
     }
 
     .line-snippet {