Experimental highlighting of tab characters in JS code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60
diff --git a/components/prism-javascript.js b/components/prism-javascript.js
index ccecda8..ca1bd09 100644
--- a/components/prism-javascript.js
+++ b/components/prism-javascript.js
@@ -8,5 +8,6 @@ Prism.languages.javascript = {
'number': /\b-?(0x)?\d*\.?\d+\b/g,
'operator': /[-+]{1,2}|!|=?<|=?>|={1,2}|(&){1,2}|\|?\||\?|:|\*|\//g,
'ignore': /&(lt|gt|amp);/gi,
- 'punctuation': /[{}[\];(),.]/g
+ 'punctuation': /[{}[\];(),.]/g,
+ 'tab': /\t/g
};
\ No newline at end of file
diff --git a/examples.html b/examples.html
index d592e90..e8c9eb8 100644
--- a/examples.html
+++ b/examples.html
@@ -104,6 +104,13 @@ ol {}</code></pre>
<h2>Operators</h2>
<pre class="prism"><code class="language-javascript">(1 + 2 * 3)/4 >= 3 && 4 < 5 || 6 > 7</code></pre>
+
+ <h2>Indented code</h2>
+ <pre class="prism"><code class="language-javascript">if (true) {
+ while (true) {
+ doSomething();
+ }
+}</code></pre>
</pre>
</section>
diff --git a/prism.css b/prism.css
index b33a1af..347f957 100644
--- a/prism.css
+++ b/prism.css
@@ -78,4 +78,9 @@ pre.prism {
.important {
font-weight: bold;
+}
+
+.tab:not(:empty)::before {
+ content: '▸';
+ color: hsl(24, 20%, 87%);
}
\ No newline at end of file
diff --git a/prism.js b/prism.js
index f3d1481..f4e2725 100644
--- a/prism.js
+++ b/prism.js
@@ -255,7 +255,8 @@ Prism.languages.javascript = {
'number': /\b-?(0x)?\d*\.?\d+\b/g,
'operator': /[-+]{1,2}|!|=?<|=?>|={1,2}|(&){1,2}|\|?\||\?|:|\*|\//g,
'ignore': /&(lt|gt|amp);/gi,
- 'punctuation': /[{}[\];(),.]/g
+ 'punctuation': /[{}[\];(),.]/g,
+ 'tab': /\t/g
};
/***********************************************