client: switch to vs code color palette for syntax highlighting

this eliminates some WCAG contrast errors, especially in light mode.
This commit is contained in:
Max Leiter 2022-03-11 15:59:52 -08:00
parent 988b05d52d
commit 606e38e192
No known key found for this signature in database
GPG key ID: A3512F2F2F17EBDA

View file

@ -5,7 +5,7 @@ import { PrismAsyncLight as SyntaxHighlighter } from 'react-syntax-highlighter';
// @ts-ignore because of no types in remark-a11y-emoji // @ts-ignore because of no types in remark-a11y-emoji
import a11yEmoji from '@fec/remark-a11y-emoji'; import a11yEmoji from '@fec/remark-a11y-emoji';
import styles from './preview.module.css' import styles from './preview.module.css'
import { duotoneDark, duotoneLight } from 'react-syntax-highlighter/dist/cjs/styles/prism' import { vscDarkPlus as dark, vs as light } from 'react-syntax-highlighter/dist/cjs/styles/prism'
import useSharedState from "../../lib/hooks/use-shared-state"; import useSharedState from "../../lib/hooks/use-shared-state";
type Props = { type Props = {
@ -33,7 +33,7 @@ const ReactMarkdownPreview = ({ content, height }: Props) => {
codeTagProps={{ codeTagProps={{
style: { background: 'transparent' } style: { background: 'transparent' }
}} }}
style={themeType === 'dark' ? duotoneDark : duotoneLight} style={themeType === 'dark' ? dark : light}
showLineNumbers={true} showLineNumbers={true}
language={match[1]} language={match[1]}
PreTag="div" PreTag="div"