diff --git a/README.md b/README.md
index ff1737f..d040236 100644
--- a/README.md
+++ b/README.md
@@ -18,46 +18,40 @@ This theme is designed to look great on both large-screen and small-screen (mobi
### Syntax highlighting
-This theme has support for either Hugo's lightning fast Chroma, or both server side and client side highlighting.
+This theme has support for either Hugo's lightning fast Chroma, or both server side and client side highlighting. See [the Hugo docs for more](https://gohugo.io/content-management/syntax-highlighting/).
-#### Chroma
+#### Chroma - New server side syntax highlighting
To enable Chroma, add the following to your site parameters:
```
pygmentsCodeFences = true
pygmentsUseClasses = true
-[Params]
- UseChroma = true
```
-Then, you can use a different style by running:
+Then, you can generate a different style by running:
```
-hugo gen chromastyles --style=manni > static/css/syntax.css
+hugo gen chromastyles --style=trac > static/css/syntax.css
```
-See [the Hugo docs for more](https://gohugo.io/content-management/syntax-highlighting/).
+#### Pygments - Old server side syntax highlighting
-#### Server side syntax highlighting
-
-Use the `highlight` shortcode (with Pygments),
-see [the Hugo documentation](http://gohugo.io/extras/highlighting/) for more information.
-
-To use this feature install Pygments (`pip install Pygments`) and add
+To use this feature install Pygments (`pip install Pygments`) and add the following to your site parameters:
```
-pygmentsUseClasses = true
+pygmentsStyle = "trac"
pygmentsUseClassic = true
```
-to your `config.toml`.
+Pygments is mostly compatable with the newer Chroma. It is slower but has some additional theme options. I recommend Chroma over Pygments.
-#### Client side syntax highlighting
+#### Highlight.js - Client side syntax highlighting
-Use triple backticks ( ``` ) or triple tilde ( ~~~ ) around code blocks.
+[Params]
+ useHLJS = true
-Client side highlighting does not require pygments to be installed. This currently is only active if you have not selected Chroma, because they don't play well together.
+Client side highlighting does not require pygments to be installed. This will use `highlight.min.css` instead of `syntax.css` for highlighting (effectively disabling Chroma). Highlight.js has a wider range of support for languages and themes, and an alternative highlighting engine.
### Disqus support
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index 9af1643..998b59a 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -8,7 +8,8 @@ pygmentsStyle = "trac"
pygmentsUseClasses = true
pygmentsCodeFences = true
pygmentsCodefencesGuessSyntax = true
-pygmentOptions = "linenos=table"
+#pygmentsUseClassic = true
+#pygmentOptions = "linenos=inline"
#disqusShortname = "XXX"
#googleAnalytics = "XXX"
@@ -21,6 +22,7 @@ pygmentOptions = "linenos=table"
rss = true
comments = true
readingTime = true
+ useHLJS = true
# gcse = "012345678901234567890:abcdefghijk" # Get your code from google.com/cse. Make sure to go to "Look and Feel" and change Layout to "Full Width" and Theme to "Classic"
#[[Params.bigimg]]
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 96fe300..de884a2 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -65,9 +65,10 @@
{{- if .Site.Params.staticman }}
{{- end }}
-{{- if (not ( .Site.Params.UseChroma )) }}
+{{- if .Site.Params.useHLJS }}
+
{{- end -}}
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index f326111..f619f24 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -51,13 +51,13 @@
{{- end -}}
-
- {{- if (not ( .Site.Params.UseChroma )) }}
+ {{- if .Site.Params.useHLJS }}
{{- else -}}
{{- end -}}
-
+
+
{{- if .Site.Params.staticman.recaptcha -}}
{{- end -}}
diff --git a/static/css/codeblock.css b/static/css/codeblock.css
index 40bbbbc..36fcdb7 100644
--- a/static/css/codeblock.css
+++ b/static/css/codeblock.css
@@ -1,35 +1,9 @@
/* --- Code blocks --- */
-pre {
- font-size: 16px;
- line-height: 1.5em;
+.chroma .ln {
+ margin-right: 0.8em;
+ padding: 0 0.4em 0 0.4em;
}
-pre code {
- white-space: pre;
-}
-pre.highlight, .highlight > pre, td.code pre {
- background: #FAFAFA;
- background-image: linear-gradient(#F9F9F9 50%, #FDFDFD 50%);
- background-repeat: repeat;
- background-size: 3em 3em;
- background-position: 0px 10px;
- border-left: 7px solid #444;
-}
-code table, code table td, code table th, code table tbody, code table tr,
-td.gutter pre {
- padding: 0;
- border: none;
- background-color: #fff;
-}
-.highlight > pre {
- padding: 0;
-}
-td.code pre {
- border-width: 0 0 0 2px;
- border-style: solid;
- border-color: #444;
- border-radius: 0;
-}
-td.gutter {
- padding-top: 3px;
+pre code.hljs {
+ padding: 9.5px;
}
diff --git a/static/css/highlight.min.css b/static/css/highlight.min.css
index 77ff6fa..5477a1b 100644
--- a/static/css/highlight.min.css
+++ b/static/css/highlight.min.css
@@ -1 +1 @@
-.hljs{display:block;overflow-x:auto;padding:0.5em;background:#f9f9f9;-webkit-text-size-adjust:none}.hljs,.hljs-subst,.hljs-tag .hljs-title,.nginx .hljs-title{color:black}.hljs-string,.hljs-title,.hljs-constant,.hljs-parent,.hljs-tag .hljs-value,.hljs-rule .hljs-value,.hljs-preprocessor,.hljs-pragma,.hljs-name,.haml .hljs-symbol,.ruby .hljs-symbol,.ruby .hljs-symbol .hljs-string,.hljs-template_tag,.django .hljs-variable,.smalltalk .hljs-class,.hljs-addition,.hljs-flow,.hljs-stream,.bash .hljs-variable,.pf .hljs-variable,.apache .hljs-tag,.apache .hljs-cbracket,.tex .hljs-command,.tex .hljs-special,.erlang_repl .hljs-function_or_atom,.asciidoc .hljs-header,.markdown .hljs-header,.coffeescript .hljs-attribute{color:#800}.smartquote,.hljs-comment,.hljs-annotation,.diff .hljs-header,.hljs-chunk,.asciidoc .hljs-blockquote,.markdown .hljs-blockquote{color:#888}.hljs-number,.hljs-date,.hljs-regexp,.hljs-literal,.hljs-hexcolor,.smalltalk .hljs-symbol,.smalltalk .hljs-char,.go .hljs-constant,.hljs-change,.lasso .hljs-variable,.makefile .hljs-variable,.asciidoc .hljs-bullet,.markdown .hljs-bullet,.asciidoc .hljs-link_url,.markdown .hljs-link_url{color:#080}.hljs-label,.hljs-javadoc,.ruby .hljs-string,.hljs-decorator,.hljs-filter .hljs-argument,.hljs-localvars,.hljs-array,.hljs-attr_selector,.hljs-important,.hljs-pseudo,.hljs-pi,.haml .hljs-bullet,.hljs-doctype,.hljs-deletion,.hljs-envvar,.hljs-shebang,.apache .hljs-sqbracket,.nginx .hljs-built_in,.tex .hljs-formula,.erlang_repl .hljs-reserved,.hljs-prompt,.asciidoc .hljs-link_label,.markdown .hljs-link_label,.vhdl .hljs-attribute,.clojure .hljs-attribute,.asciidoc .hljs-attribute,.lasso .hljs-attribute,.coffeescript .hljs-property,.hljs-phony{color:#88f}.hljs-keyword,.hljs-id,.hljs-title,.hljs-built_in,.css .hljs-tag,.hljs-javadoctag,.hljs-phpdoc,.hljs-dartdoc,.hljs-yardoctag,.smalltalk .hljs-class,.hljs-winutils,.bash .hljs-variable,.pf .hljs-variable,.apache .hljs-tag,.hljs-type,.hljs-typename,.tex .hljs-command,.asciidoc .hljs-strong,.markdown .hljs-strong,.hljs-request,.hljs-status{font-weight:bold}.asciidoc .hljs-emphasis,.markdown .hljs-emphasis{font-style:italic}.nginx .hljs-built_in{font-weight:normal}.coffeescript .javascript,.javascript .xml,.lasso .markup,.tex .hljs-formula,.xml .javascript,.xml .vbscript,.xml .css,.xml .hljs-cdata{opacity:0.5}
+.hljs{display:block;overflow-x:auto;padding:0.5em;color:#333;background:#f8f8f8}.hljs-comment,.hljs-quote{color:#998;font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-subst{color:#333;font-weight:bold}.hljs-number,.hljs-literal,.hljs-variable,.hljs-template-variable,.hljs-tag .hljs-attr{color:#008080}.hljs-string,.hljs-doctag{color:#d14}.hljs-title,.hljs-section,.hljs-selector-id{color:#900;font-weight:bold}.hljs-subst{font-weight:normal}.hljs-type,.hljs-class .hljs-title{color:#458;font-weight:bold}.hljs-tag,.hljs-name,.hljs-attribute{color:#000080;font-weight:normal}.hljs-regexp,.hljs-link{color:#009926}.hljs-symbol,.hljs-bullet{color:#990073}.hljs-built_in,.hljs-builtin-name{color:#0086b3}.hljs-meta{color:#999;font-weight:bold}.hljs-deletion{background:#fdd}.hljs-addition{background:#dfd}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold}
\ No newline at end of file
diff --git a/theme.toml b/theme.toml
index 7ea2c2f..3b446dd 100644
--- a/theme.toml
+++ b/theme.toml
@@ -4,7 +4,7 @@ licenselink = "https://github.com/halogenica/Hugo-BeautifulHugo/blob/master/LICE
description = "A port of Beautiful Jekyll theme"
tags = ["blog", "company", "portfolio", "projects", "minimal", "responsive"]
features = ["blog", "themes", "disqus", "minimal", "responsive", "staticman"]
-min_version = 0.17
+min_version = 0.28
[author]
name = "halogenica"