gaoyunchuan/wxmp
1
0
Fork 0
mirror of https://github.com/jaywcjlove/wxmp.git synced 2026-01-12 08:18:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add color palette.

Browse Source
This commit is contained in:
jaywcjlove
2022-09-06 00:06:36 +08:00
parent 8720638f9d
commit 8f62d41020
16 changed files with 232 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
website/src/pages/home/Preview.tsx
View File

@@ -14,7 +14,7 @@ export const Warpper = styled.div`
`;
export const Preview = (props: MarkdownPreviewProps) => {
const { css } = useContext(Context);
const html = markdownToHTML(props.source || '', css);
const { css, preColor, previewTheme } = useContext(Context);
const html = markdownToHTML(props.source || '', css, { preColor, previewTheme });
return <Warpper contentEditable spellCheck={false} dangerouslySetInnerHTML={{ __html: html }} />;
};

3
website/src/pages/home/index.tsx
View File

@@ -3,6 +3,7 @@ import { useContext } from 'react';
import { EditorView } from '@codemirror/view';
import { Preview } from './Preview';
import { copy } from '../../commands/copy';
import { colorCommand } from '../../commands/color';
import { theme as themeCommand, previeTheme } from '../../commands/theme';
import { cssCommand } from '../../commands/css';
import { Context, themes } from '../../store/context';
@@ -18,7 +19,7 @@ export const HomePage = () => {
toolbars={commands}
theme={themeValue}
readOnly={isLoading}
toolbarsMode={[cssCommand, previeTheme, copy, 'fullscreen', 'preview']}
toolbarsMode={[cssCommand, previeTheme, copy, colorCommand, 'fullscreen', 'preview']}
extensions={[EditorView.lineWrapping]}
renderPreview={Preview}
previewWidth="420px"

7
website/src/pages/theme/Preview.tsx
View File

@@ -1,12 +1,11 @@
import { MarkdownPreviewProps } from '@uiw/react-markdown-preview';
import { useContext } from 'react';
import { Context } from '../../store/context';
import { markdownToHTML } from '../../utils/markdownToHTML';
import { Warpper } from '../home/Preview';
export const Preview = (props: MarkdownPreviewProps) => {
const { css, markdown } = useContext(Context);
const html = markdownToHTML(markdown, css);
export const Preview = () => {
const { css, markdown, preColor, previewTheme } = useContext(Context);
const html = markdownToHTML(markdown, css, { preColor, previewTheme });
return <Warpper contentEditable spellCheck={false} dangerouslySetInnerHTML={{ __html: html }} />;
};