Using VSCode "Copy as HTML" to improve loading time
I'm sure I'm not the first person to figure this out, but you can copy as HTML from VS Code instead of making screenshots.
Unfortunately, this is pretty shitty HTML code:
<meta charset='utf-8'><html><body><!--StartFragment--><pre><div style='color: #000000; background-color: #ffffff; font-family: Menlo, Monaco, 'Courier New', monospace, monospace, AppleBraille; font-size: 12px;'><div><span></span><span style='color: #cd3131;'>Resolver Error:</span><span> </span></div><div><span> </span><span style='color: #949494;'>╭─[</span><span>test.sla:6:9</span><span style='color: #949494;'>]</span><span> </span></div><div><span> </span><span style='color: #949494;'>│</span><span> </span></div><div><span> </span><span style='color: #949494;'>6 │</span><span> </span><span style='color: #b2b2b2;'> </span><span style='color: #ff00ff;'>fib(x - 1)</span><span style='color: #b2b2b2;'> + fib(x - 2)</span><span> </span></div><div><span> </span><span style='color: #585858;'> │</span><span> </span><span style='color: #ff00ff;'>─────┬────</span><span> </span></div><div><span> </span><span style='color: #585858;'> │</span><span> </span><span style='color: #ff00ff;'>╰──────</span><span> function fib not found </span></div><div><span> </span><span style='color: #585858;'> │</span><span> </span></div><div><span> </span><span style='color: #585858;'> │</span><span> </span><span style='color: #87d7af;'>Note</span><span>: This error occurred in the compiler at: src/resolver.rs:691:36 </span></div><div><span></span><span style='color: #949494;'>───╯</span><span> </span></div></div></pre><!--EndFragment--></body></html>It also doesn't look ideal...
Resolver Error:╭─[test.sla:6:9]│6 │ fib(x - 1) + fib(x - 2)│ ─────┬────│ ╰────── function fib not found││ Note: This error occurred in the compiler at: src/resolver.rs:691:36───╯
Luckily, I already have a syntax-highlighting plugin and CSS, and can reuse that CSS here, so it can look like this:
Error:
╭─[test.sla:6:9]
│
6 │ fib(x - 1) + fib(x - 2)
│ ─────┬────
│ ╰────── function fib not found
│
───╯
And the HTML manually cleaned up to be:
<style>
.g { color: #949494; }
.d { color: #585858; }
.p { color: #ff00ff; }
</style>
<pre class="language-rust" style="line-height: 1 !important;"><code class="language-rust" style="line-height: 1 !important;"><span style='color: #cd3131;'>Error:</span>
<span class="g"> ╭─[</span><span>test.sla:6:9</span><span class="g">]</span>
<span class="g"> │</span>
<span class="g"> 6 │</span></span><span class="p"> fib(x - 1)</span><span style='color: #b2b2b2;'> + fib(x - 2)</span>
<span class="d"> │</span><span class="p"> ─────┬────</span>
<span class="d"> │</span><span class="p"> ╰──────</span><span> function fib not found</span>
<span class="d"> │</span>
<span class="g">───╯</span>
</code></pre>