From 3170c9f88d2a183170c36014c393612c98e914fc Mon Sep 17 00:00:00 2001 From: curben <2809763-curben@users.noreply.gitlab.com> Date: Fri, 18 Oct 2019 07:06:18 +0100 Subject: [PATCH] feat(code_highlight): update to newer syntax - use Dracula theme - https://github.com/hexojs/hexo-util/issues/19 - https://github.com/dracula/highlightjs --- _config.yml | 1 + themes/chameleon/source/css/typing.css | 146 +++++++++++-------------- 2 files changed, 64 insertions(+), 83 deletions(-) diff --git a/_config.yml b/_config.yml index 088bd77..23100de 100644 --- a/_config.yml +++ b/_config.yml @@ -47,6 +47,7 @@ highlight: line_number: false auto_detect: false tab_replace: + hljs: true # Tag tag_map: diff --git a/themes/chameleon/source/css/typing.css b/themes/chameleon/source/css/typing.css index ebd331f..68a4ffb 100644 --- a/themes/chameleon/source/css/typing.css +++ b/themes/chameleon/source/css/typing.css @@ -534,108 +534,88 @@ td { border: 1px solid #ddd; } -.highlight .line.marked { - background: #444; -} - -.highlight { - padding: 1em; - font-size: 0.9em; - overflow: auto; - line-height: 1.8; -} - -.highlight .gutter pre { - color: #cacdd0; +code.hljs { font-size: 0.9em; } -.article-entry pre code { - background: 0 0; - text-shadow: none; - padding: 0; +/* Dracula Theme v1.2.5 + * + * https://github.com/dracula/highlightjs + * + * Copyright 2016-present, All rights reserved + * + * Code licensed under the MIT license + * + * @author Denis Ciccale + * @author Zeno Rocha + */ + +.hljs { + display: block; + overflow-x: auto; + padding: 0.5em; + /* background: #282a36; */ } -.highlight pre { - border: 0; - margin: 0; - padding: 0; +.hljs-built_in, +.hljs-selector-tag, +.hljs-section, +.hljs-link { + color: #8be9fd; } -.highlight table { - margin: 0; - width: 100%; +.hljs-keyword { + color: #ff79c6; } -.highlight td { - border: 0; - padding: 0; +/* .hljs, +.hljs-subst { + color: #f8f8f2; +} */ + +.hljs-title { + color: #50fa7b; } -pre .comment, -pre .title, -.highlight figcaption { - color: #8e908c; +.hljs-string, +.hljs-meta, +.hljs-name, +.hljs-type, +.hljs-attr, +.hljs-symbol, +.hljs-bullet, +.hljs-addition, +.hljs-variable, +.hljs-template-tag, +.hljs-template-variable { + color: #f1fa8c; } -highlight figcaption a { - float: right; +.hljs-comment, +.hljs-quote, +.hljs-deletion { + color: #6272a4; } -pre .attribute, -pre .css .class, -pre .css .id, -pre .css .pseudo, -pre .html .doctype, -pre .regexp, -pre .ruby .constant, -pre .tag, -pre .variable, -pre .xml .doctype, -pre .xml .pi, -pre .xml .tag .title { - color: #c82829; +.hljs-keyword, +.hljs-selector-tag, +.hljs-literal, +.hljs-title, +.hljs-section, +.hljs-doctag, +.hljs-type, +.hljs-name, +.hljs-strong { + font-weight: bold; } -pre .built_in, -pre .constant, -pre .literal, -pre .number, -pre .params, -pre .preprocessor { - color: #f5871f; +.hljs-literal, +.hljs-number { + color: #bd93f9; } -pre .class, -pre .css .rules .attribute, -pre .header, -pre .inheritance, -pre .ruby .class .title, -pre .ruby .symbol, -pre .string, -pre .value, -pre .xml .cdata { - color: #718c00; -} - -pre .css .hexcolor { - color: #3e999f; -} - -pre .coffeescript .title, -pre .function, -pre .javascript .title, -pre .perl .sub, -pre .python .decorator, -pre .python .title, -pre .ruby .function .title, -pre .ruby .title .keyword { - color: #4271ae; -} - -pre .javascript .function, -pre .keyword { - color: #8959a8; +.hljs-emphasis { + font-style: italic; } /* hide mobile nav menu and its checkbox */