demo►hexo

tomorrow-theme

theme-next默认采用的tomorrow-theme

1
2
3
4
# Code Highlight theme
# Available values: normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: normal

相应的code: https://github.com/theme-next/hexo-theme-next/blob/master/source/css/_common/components/highlight/theme.styl

highlight-selection不起作用 https://github.com/theme-next/hexo-theme-next/issues/299

网传的配置，是没有作用的。

1
2
3
highlight:
  enable: false
...

highlight.js

https://zihengcat.github.io/2018/03/05/Hexo%E5%8D%9A%E5%AE%A2%E6%B7%BB%E5%8A%A0highlight-js%E4%BB%A3%E7%A0%81%E9%AB%98%E4%BA%AE/

hexo-prism-plugin

JSX syntax (HTML in JS)

https://github.com/ele828/hexo-prism-plugin

my issue

thanks. Actually, css is not the key point.
The main issue might be the code block render.

In ivan’s pages

1
2
3
4
5
<code class="bash">
  <span class="bash_symbol">$ </span>
  <span class="built_in">yum</span>
   install vsftpd
</code>

default render

1
2
3
"hexo-renderer-ejs": "^0.3.1",
"hexo-renderer-marked": "^0.3.2",
"hexo-renderer-stylus": "^0.3.3

In the default render, I get the following output

1
2
3
4
5
6
7
8
<td class="code">
  <pre>
    <span class="line">
      $ hexo new
      <span class="string">"My New Post"</span>
    </span>
  </pre>
</td>