diff --git a/modules/wowchemy-plugin-reveal/README.md b/modules/wowchemy-plugin-reveal/README.md index ae28a319..736dbe88 100644 --- a/modules/wowchemy-plugin-reveal/README.md +++ b/modules/wowchemy-plugin-reveal/README.md @@ -8,12 +8,11 @@ Supports math, syntax highlighting, diagrams, speaker notes, and much more! ## Install -1. Add the module to your `config/_default/config.yaml` alongside the core Wowchemy module: +1. Add the module to your `config/_default/config.yaml`: ```yaml module: imports: - - path: github.com/wowchemy/wowchemy-hugo-themes/modules/wowchemy - path: github.com/wowchemy/wowchemy-hugo-themes/modules/wowchemy-plugin-reveal ``` diff --git a/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/dracula.css b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/dracula.css new file mode 100644 index 00000000..c19577dc --- /dev/null +++ b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/dracula.css @@ -0,0 +1,85 @@ +/* Background */ .bg { color: #f8f8f2; background-color: #282a36 } +/* PreWrapper */ .chroma { color: #f8f8f2; background-color: #282a36; } +/* Other */ .chroma .x { } +/* Error */ .chroma .err { } +/* CodeLine */ .chroma .cl { } +/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; } +/* LineHighlight */ .chroma .hl { background-color: #ffc } +/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* Line */ .chroma .line { display: flex; } +/* Keyword */ .chroma .k { color: #ff79c6 } +/* KeywordConstant */ .chroma .kc { color: #ff79c6 } +/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic } +/* KeywordNamespace */ .chroma .kn { color: #ff79c6 } +/* KeywordPseudo */ .chroma .kp { color: #ff79c6 } +/* KeywordReserved */ .chroma .kr { color: #ff79c6 } +/* KeywordType */ .chroma .kt { color: #8be9fd } +/* Name */ .chroma .n { } +/* NameAttribute */ .chroma .na { color: #50fa7b } +/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic } +/* NameBuiltinPseudo */ .chroma .bp { } +/* NameClass */ .chroma .nc { color: #50fa7b } +/* NameConstant */ .chroma .no { } +/* NameDecorator */ .chroma .nd { } +/* NameEntity */ .chroma .ni { } +/* NameException */ .chroma .ne { } +/* NameFunction */ .chroma .nf { color: #50fa7b } +/* NameFunctionMagic */ .chroma .fm { } +/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic } +/* NameNamespace */ .chroma .nn { } +/* NameOther */ .chroma .nx { } +/* NameProperty */ .chroma .py { } +/* NameTag */ .chroma .nt { color: #ff79c6 } +/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic } +/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic } +/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic } +/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic } +/* NameVariableMagic */ .chroma .vm { } +/* Literal */ .chroma .l { } +/* LiteralDate */ .chroma .ld { } +/* LiteralString */ .chroma .s { color: #f1fa8c } +/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c } +/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c } +/* LiteralStringChar */ .chroma .sc { color: #f1fa8c } +/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c } +/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c } +/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c } +/* LiteralStringEscape */ .chroma .se { color: #f1fa8c } +/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c } +/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c } +/* LiteralStringOther */ .chroma .sx { color: #f1fa8c } +/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c } +/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c } +/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c } +/* LiteralNumber */ .chroma .m { color: #bd93f9 } +/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 } +/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 } +/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 } +/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 } +/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 } +/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 } +/* Operator */ .chroma .o { color: #ff79c6 } +/* OperatorWord */ .chroma .ow { color: #ff79c6 } +/* Punctuation */ .chroma .p { } +/* Comment */ .chroma .c { color: #6272a4 } +/* CommentHashbang */ .chroma .ch { color: #6272a4 } +/* CommentMultiline */ .chroma .cm { color: #6272a4 } +/* CommentSingle */ .chroma .c1 { color: #6272a4 } +/* CommentSpecial */ .chroma .cs { color: #6272a4 } +/* CommentPreproc */ .chroma .cp { color: #ff79c6 } +/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 } +/* Generic */ .chroma .g { } +/* GenericDeleted */ .chroma .gd { color: #f55 } +/* GenericEmph */ .chroma .ge { text-decoration: underline } +/* GenericError */ .chroma .gr { } +/* GenericHeading */ .chroma .gh { font-weight: bold } +/* GenericInserted */ .chroma .gi { color: #50fa7b; font-weight: bold } +/* GenericOutput */ .chroma .go { color: #44475a } +/* GenericPrompt */ .chroma .gp { } +/* GenericStrong */ .chroma .gs { } +/* GenericSubheading */ .chroma .gu { font-weight: bold } +/* GenericTraceback */ .chroma .gt { } +/* GenericUnderline */ .chroma .gl { text-decoration: underline } +/* TextWhitespace */ .chroma .w { } diff --git a/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-dark.css b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-dark.css new file mode 100644 index 00000000..77716777 --- /dev/null +++ b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-dark.css @@ -0,0 +1,271 @@ +.chroma { + background-color: #0d1117; + color: #fff; +} +.chroma .nn { + color: #fff; +} +.chroma .err { + color: #f85149; +} +.chroma .p { + color: #c9d1d9; +} +.chroma .lntd { + border: 0; + margin: 0; + padding: 0; + vertical-align: top; +} +.chroma .lntable { + width: auto; + border: 0; + margin: 0; + display: block; + padding: 0; + overflow: auto; + border-spacing: 0; +} +.chroma .hl { + width: 100%; + display: block; + background-color: rgba(110,118,129,0.1); +} +.chroma .lnt { + color: #8b949e; + padding: 0 0.4em 0 0.4em; + font-size: 0.875rem; + margin-right: 0.4em; +} +.chroma .ln { + color: #8b949e; + padding: 0 0.4em 0 0.4em; + margin-right: 0.4em; +} +.chroma .k { + color: #ff7b72; +} +.chroma .kc { + color: #ff7b72; + font-weight: bold; +} +.chroma .kd { + color: #ff7b72; + font-weight: bold; +} +.chroma .kn { + color: #ff7b72; + font-weight: bold; +} +.chroma .kp { + color: #ff7b72; + font-weight: bold; +} +.chroma .kr { + color: #ff7b72; + font-weight: bold; +} +.chroma .kt { + color: #ff7b72; + font-weight: bold; +} +.chroma .na { + color: #c9d1d9; +} +.chroma .nb { + color: #c9d1d9; +} +.chroma .bp { + color: #c9d1d9; +} +.chroma .nc { + color: #7ee787; + font-weight: bold; +} +.chroma .no { + color: #79c0ff; + font-weight: bold; +} +.chroma .nd { + color: #bc8cff; + font-weight: bold; +} +.chroma .ni { + color: #ffa657; +} +.chroma .ne { + color: #ffa657; + font-weight: bold; +} +.chroma .nf { + color: #d2a8ff; + font-weight: bold; +} +.chroma .nl { + color: #79c0ff; + font-weight: bold; +} +.chroma .nm { + color: #ff7b72; +} +.chroma .nx { + color: #79c0ff; +} +.chroma .py { + color: #79c0ff; +} +.chroma .nt { + color: #7ee787; +} +.chroma .nv { + color: #79c0ff; +} +.chroma .vc { + color: #79c0ff; +} +.chroma .vg { + color: #79c0ff; +} +.chroma .vi { + color: #79c0ff; +} +.chroma .l { + color: #79c0ff; +} +.chroma .ld { + color: #79c0ff; +} +.chroma .s { + color: #79c0ff; +} +.chroma .sa { + color: #79c0ff; +} +.chroma .sb { + color: #79c0ff; +} +.chroma .sc { + color: #79c0ff; +} +.chroma .dl { + color: #79c0ff; +} +.chroma .sd { + color: #79c0ff; +} +.chroma .s2 { + color: #79c0ff; +} +.chroma .se { + color: #79c0ff; +} +.chroma .sh { + color: #79c0ff; +} +.chroma .si { + color: #79c0ff; +} +.chroma .sx { + color: #79c0ff; +} +.chroma .sr { + color: #79c0ff; +} +.chroma .s1 { + color: #79c0ff; +} +.chroma .ss { + color: #79c0ff; +} +.chroma .m { + color: #79c0ff; +} +.chroma .mb { + color: #79c0ff; +} +.chroma .mf { + color: #79c0ff; +} +.chroma .mh { + color: #79c0ff; +} +.chroma .mi { + color: #79c0ff; +} +.chroma .il { + color: #79c0ff; +} +.chroma .mo { + color: #79c0ff; +} +.chroma .o { + color: #a5d6ff; + font-weight: bold; +} +.chroma .ow { + color: #a5d6ff; + font-weight: bold; +} +.chroma .c { + color: #8b949e; + font-style: italic; +} +.chroma .ch { + color: #8b949e; + font-style: italic; +} +.chroma .cm { + color: #8b949e; + font-style: italic; +} +.chroma .c1 { + color: #8b949e; + font-style: italic; +} +.chroma .cs { + color: #8b949e; + font-style: italic; +} +.chroma .cpf { + color: #8b949e; + font-style: italic; +} +.chroma .gd { + color: #ffa198; + background-color: #490202; +} +.chroma .ge { + color: #c9d1d9; + font-style: italic; +} +.chroma .gr { + color: #ffa198; +} +.chroma .gh { + color: #79c0ff; +} +.chroma .gi { + color: #7ee787; + background-color: #56d364; +} +.chroma .go { + color: #8b949e; +} +.chroma .gp { + color: #8b949e; +} +.chroma .gs { + font-weight: bold; +} +.chroma .gu { + color: #79c0ff; +} +.chroma .gt { + color: #ffa198; +} +.chroma .gl { + text-decoration: underline; +} +.chroma .w { + color: #484f58; +} diff --git a/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-light.css b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-light.css new file mode 100644 index 00000000..07ea90ab --- /dev/null +++ b/modules/wowchemy-plugin-reveal/assets/css/libs/chroma/github-light.css @@ -0,0 +1,85 @@ +/* Background */ .bg { background-color: #fff } +/* PreWrapper */ .chroma { background-color: #fff; } +/* Other */ .chroma .x { } +/* Error */ .chroma .err { color: #a61717; background-color: #e3d2d2 } +/* CodeLine */ .chroma .cl { } +/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; } +/* LineHighlight */ .chroma .hl { background-color: #ffc } +/* LineNumbersTable */ .chroma .lnt { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em;color: #7f7f7f } +/* LineNumbers */ .chroma .ln { white-space: pre; user-select: none; margin-right: 0.4em; padding: 0 0.4em;color: #7f7f7f } +/* Line */ .chroma .line { display: flex; } +/* Keyword */ .chroma .k { color: #000; font-weight: bold } +/* KeywordConstant */ .chroma .kc { color: #000; font-weight: bold } +/* KeywordDeclaration */ .chroma .kd { color: #000; font-weight: bold } +/* KeywordNamespace */ .chroma .kn { color: #000; font-weight: bold } +/* KeywordPseudo */ .chroma .kp { color: #000; font-weight: bold } +/* KeywordReserved */ .chroma .kr { color: #000; font-weight: bold } +/* KeywordType */ .chroma .kt { color: #458; font-weight: bold } +/* Name */ .chroma .n { } +/* NameAttribute */ .chroma .na { color: #008080 } +/* NameBuiltin */ .chroma .nb { color: #0086b3 } +/* NameBuiltinPseudo */ .chroma .bp { color: #999 } +/* NameClass */ .chroma .nc { color: #458; font-weight: bold } +/* NameConstant */ .chroma .no { color: #008080 } +/* NameDecorator */ .chroma .nd { color: #3c5d5d; font-weight: bold } +/* NameEntity */ .chroma .ni { color: #800080 } +/* NameException */ .chroma .ne { color: #900; font-weight: bold } +/* NameFunction */ .chroma .nf { color: #900; font-weight: bold } +/* NameFunctionMagic */ .chroma .fm { } +/* NameLabel */ .chroma .nl { color: #900; font-weight: bold } +/* NameNamespace */ .chroma .nn { color: #555 } +/* NameOther */ .chroma .nx { } +/* NameProperty */ .chroma .py { } +/* NameTag */ .chroma .nt { color: #000080 } +/* NameVariable */ .chroma .nv { color: #008080 } +/* NameVariableClass */ .chroma .vc { color: #008080 } +/* NameVariableGlobal */ .chroma .vg { color: #008080 } +/* NameVariableInstance */ .chroma .vi { color: #008080 } +/* NameVariableMagic */ .chroma .vm { } +/* Literal */ .chroma .l { } +/* LiteralDate */ .chroma .ld { } +/* LiteralString */ .chroma .s { color: #d14 } +/* LiteralStringAffix */ .chroma .sa { color: #d14 } +/* LiteralStringBacktick */ .chroma .sb { color: #d14 } +/* LiteralStringChar */ .chroma .sc { color: #d14 } +/* LiteralStringDelimiter */ .chroma .dl { color: #d14 } +/* LiteralStringDoc */ .chroma .sd { color: #d14 } +/* LiteralStringDouble */ .chroma .s2 { color: #d14 } +/* LiteralStringEscape */ .chroma .se { color: #d14 } +/* LiteralStringHeredoc */ .chroma .sh { color: #d14 } +/* LiteralStringInterpol */ .chroma .si { color: #d14 } +/* LiteralStringOther */ .chroma .sx { color: #d14 } +/* LiteralStringRegex */ .chroma .sr { color: #009926 } +/* LiteralStringSingle */ .chroma .s1 { color: #d14 } +/* LiteralStringSymbol */ .chroma .ss { color: #990073 } +/* LiteralNumber */ .chroma .m { color: #099 } +/* LiteralNumberBin */ .chroma .mb { color: #099 } +/* LiteralNumberFloat */ .chroma .mf { color: #099 } +/* LiteralNumberHex */ .chroma .mh { color: #099 } +/* LiteralNumberInteger */ .chroma .mi { color: #099 } +/* LiteralNumberIntegerLong */ .chroma .il { color: #099 } +/* LiteralNumberOct */ .chroma .mo { color: #099 } +/* Operator */ .chroma .o { color: #000; font-weight: bold } +/* OperatorWord */ .chroma .ow { color: #000; font-weight: bold } +/* Punctuation */ .chroma .p { } +/* Comment */ .chroma .c { color: #998; font-style: italic } +/* CommentHashbang */ .chroma .ch { color: #998; font-style: italic } +/* CommentMultiline */ .chroma .cm { color: #998; font-style: italic } +/* CommentSingle */ .chroma .c1 { color: #998; font-style: italic } +/* CommentSpecial */ .chroma .cs { color: #999; font-weight: bold; font-style: italic } +/* CommentPreproc */ .chroma .cp { color: #999; font-weight: bold; font-style: italic } +/* CommentPreprocFile */ .chroma .cpf { color: #999; font-weight: bold; font-style: italic } +/* Generic */ .chroma .g { } +/* GenericDeleted */ .chroma .gd { color: #000; background-color: #fdd } +/* GenericEmph */ .chroma .ge { color: #000; font-style: italic } +/* GenericError */ .chroma .gr { color: #a00 } +/* GenericHeading */ .chroma .gh { color: #999 } +/* GenericInserted */ .chroma .gi { color: #000; background-color: #dfd } +/* GenericOutput */ .chroma .go { color: #888 } +/* GenericPrompt */ .chroma .gp { color: #555 } +/* GenericStrong */ .chroma .gs { font-weight: bold } +/* GenericSubheading */ .chroma .gu { color: #aaa } +/* GenericTraceback */ .chroma .gt { color: #a00 } +/* GenericUnderline */ .chroma .gl { text-decoration: underline } +/* TextWhitespace */ .chroma .w { color: #bbb } diff --git a/modules/wowchemy-plugin-reveal/assets/js/wowchemy-slides.js b/modules/wowchemy-plugin-reveal/assets/js/wowchemy-slides.js index edadf8f3..79cb5ca2 100644 --- a/modules/wowchemy-plugin-reveal/assets/js/wowchemy-slides.js +++ b/modules/wowchemy-plugin-reveal/assets/js/wowchemy-slides.js @@ -12,7 +12,7 @@ import * as params from '@params'; // Enable core slide features. -var enabledPlugins = [RevealMarkdown, RevealSearch, RevealNotes, RevealMath.MathJax3, RevealZoom]; +var enabledPlugins = [RevealMarkdown, RevealSearch, RevealNotes, RevealMath.KaTeX, RevealZoom]; const isObject = function (o) { return o === Object(o) && !isArray(o) && typeof o !== 'function'; diff --git a/modules/wowchemy-plugin-reveal/config.yaml b/modules/wowchemy-plugin-reveal/config.yaml index 51a337e7..4df424ea 100644 --- a/modules/wowchemy-plugin-reveal/config.yaml +++ b/modules/wowchemy-plugin-reveal/config.yaml @@ -4,3 +4,5 @@ module: target: assets - source: layouts target: layouts + imports: + - path: github.com/wowchemy/wowchemy-hugo-themes/modules/wowchemy-core diff --git a/modules/wowchemy-plugin-reveal/go.mod b/modules/wowchemy-plugin-reveal/go.mod index 32c22ffa..e17730d8 100644 --- a/modules/wowchemy-plugin-reveal/go.mod +++ b/modules/wowchemy-plugin-reveal/go.mod @@ -1,3 +1,7 @@ module github.com/wowchemy/wowchemy-hugo-themes/modules/wowchemy-plugin-reveal go 1.15 + +require ( + github.com/wowchemy/wowchemy-hugo-themes/modules/wowchemy-core v0.1.0 +) diff --git a/modules/wowchemy-plugin-reveal/layouts/slides/baseof.html b/modules/wowchemy-plugin-reveal/layouts/slides/baseof.html index 5e93251f..cabe5d8e 100644 --- a/modules/wowchemy-plugin-reveal/layouts/slides/baseof.html +++ b/modules/wowchemy-plugin-reveal/layouts/slides/baseof.html @@ -2,13 +2,15 @@
+ {{/* Asset versions */}} {{ $cdn_url_reveal := "https://cdn.jsdelivr.net/npm/reveal.js@4.3.1" }} - {{ $js := site.Data.assets.js }} + {{ $mermaid_version := "9.1.3" }} + {{ $mermaid_sri := "sha256-TIYL00Rhw/8WaoUhYTLX9SKIEFdXxg+yMWSLVUbhiLg=" }} - + {{ with site.Home.OutputFormats.Get "WebAppManifest" }} @@ -65,7 +67,7 @@ {{/* Load Mermaid. */}} {{ if $.Param "slides.diagram" | default false}} - {{ printf "" (printf $js.mermaid.url $js.mermaid.version) $js.mermaid.sri | safeHTML }} + {{ printf "" (printf "https://cdn.jsdelivr.net/npm/mermaid@%s/dist/mermaid.min.js" $mermaid_version) $mermaid_sri | safeHTML }} {{ end }} {{/* Initialize slides. */}}