Skip to content

Commit

Permalink
feat: Update CodeSnippet to use dark theme
Browse files Browse the repository at this point in the history
  • Loading branch information
jerelmiller committed Jun 23, 2020
1 parent 544d01c commit c5895d7
Showing 1 changed file with 5 additions and 2 deletions.
7 changes: 5 additions & 2 deletions src/components/CodeSnippet.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
import React from 'react';
import PropTypes from 'prop-types';
import Highlight, { defaultProps } from 'prism-react-renderer';
import github from 'prism-react-renderer/themes/github';
import lightTheme from 'prism-react-renderer/themes/github';
import darkTheme from 'prism-react-renderer/themes/nightOwl';
import MiddleEllipsis from 'react-middle-ellipsis';
import FeatherIcon from './FeatherIcon';
import styles from './CodeSnippet.module.scss';
import useClipboard from '../hooks/useClipboard';
import useFormattedCode from '../hooks/useFormattedCode';
import Prism from 'prism-react-renderer/prism';
import useDarkMode from 'use-dark-mode';

(typeof global !== 'undefined' ? global : window).Prism = Prism;

Expand All @@ -17,13 +19,14 @@ const CodeSnippet = ({ children, copy, className, lineNumbers, fileName }) => {
const language = className.replace('language-', '');
const formattedCode = useFormattedCode(children ?? '');
const [copied, copyCode] = useClipboard();
const darkMode = useDarkMode();

return (
<div>
<div className={styles.container}>
<Highlight
{...defaultProps}
theme={github}
theme={darkMode.value ? darkTheme : lightTheme}
code={formattedCode.trim()}
language={language}
>
Expand Down

0 comments on commit c5895d7

Please sign in to comment.