diff --git a/website/plugins/remarkCodeBlocks.mjs b/website/plugins/remarkCodeBlocks.mjs
index 0d327e2a9..0e260e057 100644
--- a/website/plugins/remarkCodeBlocks.mjs
+++ b/website/plugins/remarkCodeBlocks.mjs
@@ -43,7 +43,7 @@ function remarkCodeBlocks(userOptions = {}) {
firstLine.startsWith('%%GITHUB_')
) {
// GitHub URL
- attrs.github = 'true'
+ attrs.github = node.value
}
// If it's a bash code block and single line, check for prompts
if (lang === 'bash') {
diff --git a/website/src/components/code.js b/website/src/components/code.js
index 199de6bbd..b1f134501 100644
--- a/website/src/components/code.js
+++ b/website/src/components/code.js
@@ -207,14 +207,13 @@ export class Code extends React.Component {
static defaultProps = {
lang: 'none',
executable: null,
- github: false,
}
static propTypes = {
lang: PropTypes.string,
title: PropTypes.string,
executable: PropTypes.oneOf(['true', 'false', true, false, null]),
- github: PropTypes.oneOf(['true', 'false', true, false, null]),
+ github: PropTypes.string,
prompt: PropTypes.string,
highlight: PropTypes.string,
className: PropTypes.string,
@@ -246,7 +245,7 @@ export class Code extends React.Component {
const { Juniper } = this.state
if (github) {
- return
+ return
}
if (!!executable && Juniper) {
return (
diff --git a/website/src/components/github.js b/website/src/components/github.js
index a950dbef8..a825b4d55 100644
--- a/website/src/components/github.js
+++ b/website/src/components/github.js
@@ -1,7 +1,13 @@
import React, { useState, useEffect } from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames'
-import highlightCode from 'gatsby-remark-prismjs/highlight-code.js'
+import Prism from 'prismjs'
+
+// We manually load all the languages that are needed, which are currently only those:
+import 'prismjs/components/prism-json.min.js'
+import 'prismjs/components/prism-python.min.js'
+import 'prismjs/components/prism-yaml.min.js'
+import 'prismjs/components/prism-ini.min.js'
import Icon from './icon'
import Link from './link'
@@ -39,7 +45,8 @@ const GitHubCode = ({ url, lang, errorMsg = defaultErrorMsg, className }) => {
}
}, [initialized, rawUrl, errorMsg])
- const highlighted = lang === 'none' || !code ? code : highlightCode(lang, code)
+ const highlighted =
+ lang === 'none' || !code ? code : Prism.highlight(code, Prism.languages[lang], lang)
return (
<>