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

feat: add theme editor.

Browse Source
This commit is contained in:
jaywcjlove
2022-09-03 12:19:13 +08:00
parent 0580011f7b
commit 1c7167bcf9
16 changed files with 190 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/pages/home/index.tsx
View File

@@ -3,10 +3,10 @@ import { useContext } from 'react';
import { EditorView } from '@codemirror/view';
import styled from 'styled-components';
import { Preview } from './Preview';
import { copy } from './copy';
import { theme as themeCommand, previeTheme } from './theme';
import { copy } from '../../commands/copy';
import { theme as themeCommand, previeTheme } from '../../commands/theme';
import { cssCommand } from '../../commands/css';
import { Context, themes } from '../../store/context';
import data from '../../../README.md';
const Warpper = styled.div`
height: calc(100vh - 2.9rem);
@@ -14,17 +14,19 @@ const Warpper = styled.div`
export const HomePage = () => {
const commands = [...getCommands(), themeCommand];
const { theme } = useContext(Context);
const value = themes[theme].value;
const { theme, markdown, setMarkdown } = useContext(Context);
const themeValue = themes[theme].value;
const handleChange = (value: string) => setMarkdown(value);
return (
<Warpper>
<MarkdownEditor
value={data.source}
value={markdown}
toolbars={commands}
theme={value}
toolbarsMode={[previeTheme, copy, 'preview', 'fullscreen']}
theme={themeValue}
toolbarsMode={[cssCommand, previeTheme, copy, 'preview', 'fullscreen']}
extensions={[EditorView.lineWrapping]}
renderPreview={Preview}
onChange={handleChange}
visible={true}
height="calc(100vh - 4.92rem)"
/>