yusanshi/emgithub

Theme request: arduino-dark

BelKed opened this issue · 3 comments

Hey yusnanshi,

I would like to request to add Arduino dark theme based on One Dark Prohttps://github.com/konrad91/OneDarkArduino.
It's really nice theme for highlighting Arduino code.

Here is sample image of code highlighted by that theme:
Arduino dark theme

Thanks for your idea.

As you know, the code highlighting job in the repo is provided by highlight.js and we're using the theme from it.

https://github.com/yusanshi/embed-like-gist/blob/master/embed.js#L33
image

I just looked into https://highlightjs.org/static/demo/, and I found there is no Arduino Dark theme, but Arduino Light.
image

I checked the https://github.com/konrad91/OneDarkArduino repo you provided, and surely the code in it can't be directly used by this project. The needed style code should be like this:

https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.17.1/build/styles/arduino-light.min.css

.hljs{display:block;overflow-x:auto;padding:.5em;background:#FFFFFF}.hljs,.hljs-subst{color:#434f54}.hljs-keyword,.hljs-attribute,.hljs-selector-tag,.hljs-doctag,.hljs-name{color:#00979D}.hljs-built_in,.hljs-literal,.hljs-bullet,.hljs-code,.hljs-addition{color:#D35400}.hljs-regexp,.hljs-symbol,.hljs-variable,.hljs-template-variable,.hljs-link,.hljs-selector-attr,.hljs-selector-pseudo{color:#00979D}.hljs-type,.hljs-string,.hljs-selector-id,.hljs-selector-class,.hljs-quote,.hljs-template-tag,.hljs-deletion{color:#005C5F}.hljs-title,.hljs-section{color:#880000;font-weight:bold}.hljs-comment{color:rgba(149,165,166,0.8)}.hljs-meta-keyword{color:#728E00}.hljs-meta{color:#434f54}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold}.hljs-function{color:#728E00}.hljs-number{color:#8A7B52}

So I think there're 2 options we can choose from:

  1. Write our own CSS code for Arduino Dark.
  2. Request this theme to highlight.js. Since they have provided Arduino Light theme, adding a dark version should not be so hard, I think. :)

I suggest option 2: request the theme to highlight.js.

Once the work was done, we can upgrade highlight.js in this project to use the newly added theme.

As @yusanshi mentioned, there already is theme like that – Atom One Dark.