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 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

41
website/src/store/context.tsx
View File

@@ -97,25 +97,64 @@ export const previewThemes = {
default: {
label: '翡翠绿',
value: defStyle,
color: '#009874',
},
simple: {
label: '简洁蓝',
value: simpleStyle,
color: '#0f4c81',
},
underscore: {
label: '下划线黄',
value: underscoreStyle,
color: '#ffb11b',
},
base: {
label: '简洁',
value: baseStyle,
color: '',
},
};
/** 用于全局主题替换样式 */
export const replaceData: Record<PreviewThemeValue, ReplaceData[]> = {
underscore: [
{ select: 'a', name: 'color', value: '{{color}}' },
{ select: 'h1', name: 'box-shadow', value: 'inset 0 -0.9rem 0 0 {{color}}' },
{ select: 'h2', name: 'box-shadow', value: 'inset 0 -0.7rem 0 0 {{color}}' },
{ select: 'h3', name: 'border-left', value: '5px solid {{color}}' },
],
default: [
{ select: 'a', name: 'color', value: '{{color}}' },
{ select: 'h1', name: 'border-bottom', value: '3px solid {{color}}' },
{ select: 'h2', name: 'background', value: '{{color}}' },
{ select: 'h3', name: 'border-left', value: '5px solid {{color}}' },
],
simple: [
{ select: 'a', name: 'color', value: '{{color}}' },
{ select: 'h1', name: 'border-bottom', value: '3px solid {{color}}' },
{ select: 'h2', name: 'background', value: '{{color}}' },
{ select: 'h3', name: 'border-left', value: '5px solid {{color}}' },
{ select: '.code-spans', name: 'color', value: '{{color}}' },
],
base: [],
};
export type ReplaceData = {
select: string;
name: string;
value: string;
};
export const colors = (Object.keys(previewThemes) as Array<keyof typeof previewThemes>).map(
(key) => previewThemes[key].color,
);
export type ThemeValue = keyof typeof themes;
export type PreviewThemeValue = keyof typeof previewThemes;
export interface CreateContext {
preColor: string;
setPreColor: React.Dispatch<React.SetStateAction<string>>;
isLoading: boolean;
setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;
markdown: string;
@@ -129,6 +168,8 @@ export interface CreateContext {
}
export const Context = React.createContext<CreateContext>({
preColor: '',
setPreColor: () => {},
isLoading: true,
setIsLoading: () => {},
markdown: data.source,