Member-only story
Syntax Highlighting Displayed In Ubuntu Terminal Like
Display the code of your apps, websites or blogs with code highlighting in stylish Ubuntu Terminal like.
A couple of days ago, Cody Pearce published an article which picked my curiosity. In his post he was displaying how the unique and immediately recognizable design of the Ubuntu terminal can be reproduced with CSS.
In DeckDeckGo, our editor for presentations, we are providing a code highlighter Web Component, developed with Stencil, which can be integrated in your slides, apps or even easily in a Gatsby website.
That’s why I thought it would be fun to merge Cody’s idea and design 😄.
HTML
The quickest way to try out the component is probably to plug it, with the help of Unpkg, in a plain HTML file. Once the references to fetch its code have been added in the page header, it can be consumed.
Regarding the code to highlight, it should be provided to match the slot name code and that’s it, everything you need to highlight the code is ready.
<html>
<head>
<script type="module" src="https://unpkg.com/@deckdeckgo/highlight-code@latest/dist/deckdeckgo-highlight-code/deckdeckgo-highlight-code.esm.js"></script>
<script nomodule=""…
