basic.js.output.html

<pre class="shiki github-dark has-diff" style="background-color:#24292e;color:#e1e4e8" tabindex="0"><code><span class="line"></span><span class="line"><span style="color:#F97583">const</span><span style="color:#79B8FF"> </span><span style="color:#79B8FF" class="diff add">foo</span><span style="color:#F97583"> =</span><span style="color:#9ECBFF"> 'bar'</span></span><span class="line"><span style="color:#F97583">const</span><span style="color:#79B8FF"> </span><span style="color:#79B8FF" class="diff remove">bar</span><span style="color:#F97583"> =</span><span style="color:#9ECBFF"> 'baz'</span></span><span class="line"><span style="color:#E1E4E8" class="diff add">console.</span><span style="color:#B392F0" class="diff add">log</span><span style="color:#E1E4E8">(</span><span style="color:#9ECBFF">'hello'</span><span style="color:#E1E4E8">)</span></span><span class="line"><span style="color:#E1E4E8" class="diff add">console.</span><span style="color:#B392F0" class="diff add">log</span><span style="color:#E1E4E8">(</span><span style="color:#9ECBFF">'world'</span><span style="color:#E1E4E8">)</span></span><span class="line"></span></code></pre>
<style>
body { margin: 0; }
.shiki { padding: 1.5em; }
.line { display: block; width: 100%; height: 1.2em; }
.diff.add { background-color: #0505; color: green; }
.diff.remove { background-color: #8005; color: red; }
</style>