Show tab indicators in the diff view
Feature: Issue 3677
Change-Id: I230c19eb7efa2e9790e1559a97dab026fef81654
diff --git a/polygerrit-ui/app/elements/gr-diff-side.html b/polygerrit-ui/app/elements/gr-diff-side.html
index 6e150d6..0120d3b 100644
--- a/polygerrit-ui/app/elements/gr-diff-side.html
+++ b/polygerrit-ui/app/elements/gr-diff-side.html
@@ -60,6 +60,11 @@
/* Line feed */
content: '\A';
}
+ .tab:before {
+ color: #C62828;
+ /* >> character */
+ content: '\00BB';
+ }
.filler {
background: #eee;
}
@@ -80,6 +85,8 @@
SEMICOLON: ';'.charCodeAt(0),
};
+ var TAB_REGEX = /\t/g;
+
Polymer({
is: 'gr-diff-side',
@@ -201,6 +208,7 @@
if (numLines > 1) {
html = this._addNewLines(code.content, html, numLines);
}
+ html = this._addTabIndicators(code.content, html);
// If the html is equivalent to the text then it didn't get highlighted
// or escaped. Use textContent which is faster than innerHTML.
@@ -300,6 +308,11 @@
return result;
},
+ _addTabIndicators: function(content, html) {
+ return html.replace(TAB_REGEX,
+ '<span class="style-scope gr-diff-side tab">\t</span>');
+ },
+
_createElement: function(tagName, className) {
var el = document.createElement(tagName);
// When Shady DOM is being used, these classes are added to account for