amass/md
1
0
Fork 0
mirror of https://github.com/doocs/md.git synced 2024-10-06 03:53:14 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: style of custom (#396)

Browse Source
This commit is contained in:
YangFong 2024-09-10 08:21:25 +08:00 committed by GitHub
parent 7a3b35063c
commit 4630fe7d03
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 45 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
src/stores/index.js
View File

@ -45,11 +45,6 @@ export const useStore = defineStore(`store`, () => {
const fontSizeNumber = computed(() => fontSize.value.replace(`px`, ``))
const renderer = initRenderer({
theme: customizeTheme(themeMap[theme.value], { fontSize: fontSizeNumber.value, color: primaryColor.value }),
fonts: fontFamily.value,
})
// 内容编辑器编辑器
const editor = ref(null)
// 编辑区域内容
@ -80,43 +75,6 @@ export const useStore = defineStore(`store`, () => {
}
}
// 更新编辑器
const editorRefresh = () => {
codeThemeChange()
renderer.reset({ status: isCiteStatus.value, legend: legend.value })
let outputTemp = marked.parse(editor.value.getValue(0))
// 去除第一行的 margin-top
outputTemp = outputTemp.replace(/(style=".*?)"/, `$1;margin-top: 0"`)
// 引用脚注
outputTemp += renderer.buildFootnotes()
// 附加的一些 style
outputTemp += renderer.buildAddition()
if (isMacCodeBlock.value) {
outputTemp += `
<style>
.hljs.code__pre > .mac-sign {
display: inline-block;
}
.hljs.code__pre {
padding: 0!important;
}
.hljs.code__pre code {
display: -webkit-box;
padding: 0.5em 1em 1em;
overflow-x: auto;
text-indent: 0;
}
</style>
`
}
output.value = outputTemp
}
// 自义定 CSS 编辑器
const cssEditor = ref(null)
const setCssEditorValue = (content) => {
@ -170,6 +128,49 @@ export const useStore = defineStore(`store`, () => {
const validatorTabName = (val) => {
return cssContentConfig.value.tabs.every(({ name }) => name !== val)
}
const renderer = initRenderer({
theme: customCssWithTemplate(css2json(getCurrentTab().content), primaryColor.value, customizeTheme(themeMap[theme.value], { fontSize: fontSizeNumber.value, color: primaryColor.value })),
fonts: fontFamily.value,
})
// 更新编辑器
const editorRefresh = () => {
codeThemeChange()
renderer.reset({ status: isCiteStatus.value, legend: legend.value })
let outputTemp = marked.parse(editor.value.getValue(0))
// 去除第一行的 margin-top
outputTemp = outputTemp.replace(/(style=".*?)"/, `$1;margin-top: 0"`)
// 引用脚注
outputTemp += renderer.buildFootnotes()
// 附加的一些 style
outputTemp += renderer.buildAddition()
if (isMacCodeBlock.value) {
outputTemp += `
<style>
.hljs.code__pre > .mac-sign {
display: inline-block;
}
.hljs.code__pre {
padding: 0!important;
}
.hljs.code__pre code {
display: -webkit-box;
padding: 0.5em 1em 1em;
overflow-x: auto;
text-indent: 0;
}
</style>
`
}
output.value = outputTemp
}
// 更新 CSS
const updateCss = () => {
const json = css2json(cssEditor.value.getValue())
@ -257,12 +258,12 @@ export const useStore = defineStore(`store`, () => {
const getTheme = (size, color) => {
const newTheme = themeMap[theme.value]
const fontSize = size.replace(`px`, ``)
return customizeTheme(newTheme, { fontSize, color })
return customCssWithTemplate(css2json(getCurrentTab().content), color, customizeTheme(newTheme, { fontSize, color }))
}
const themeChanged = withAfterRefresh((newTheme) => {
renderer.setOptions({
theme: customizeTheme(themeMap[newTheme], { fontSize: fontSizeNumber.value, color: primaryColor.value }),
theme: customCssWithTemplate(css2json(getCurrentTab().content), primaryColor.value, customizeTheme(themeMap[newTheme], { fontSize: fontSizeNumber.value })),
})
theme.value = newTheme
})