public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-13 17:56:25 +00:00
Code Issues Releases Wiki Activity

Codeblock theme of markdown preview

Browse Source
This commit is contained in:
Dick Choi
2016-07-14 14:37:14 +09:00
parent 44f270f408
commit 2d46d12628
3 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
browser/components/MarkdownEditor.js
View File

@@ -96,7 +96,7 @@ class MarkdownEditor extends React.Component {
style={previewStyle}
fontSize={config.preview.fontSize}
fontFamily={config.preview.fontFamily}
codeBlockTheme={config.preview.theme}
codeBlockTheme={config.preview.codeBlockTheme}
codeBlockFontFamily={config.editor.fontFamily}
lineNumber={config.preview.lineNumber}
ref='preview'

7
browser/components/MarkdownPreview.js
View File

@@ -1,6 +1,7 @@
import React, { PropTypes } from 'react'
import markdown from 'browser/lib/markdown'
import _ from 'lodash'
import hljsTheme from 'browser/lib/hljsThemes'
const markdownStyle = require('!!css!stylus?sourceMap!./markdown.styl')[0][1]
const { shell } = require('electron')
@@ -44,6 +45,7 @@ export default class MarkdownPreview extends React.Component {
prevProps.fontFamily !== this.props.fontFamily ||
prevProps.fontSize !== this.props.fontSize ||
prevProps.codeBlockFontFamily !== this.props.codeBlockFontFamily ||
prevProps.codeBlockTheme !== this.props.codeBlockTheme ||
prevProps.lineNumber !== this.props.lineNumber
) this.rewriteIframe()
}
@@ -53,13 +55,14 @@ export default class MarkdownPreview extends React.Component {
el.removeEventListener('click', goExternal)
})
let { value, fontFamily, fontSize, codeBlockFontFamily, lineNumber } = this.props
let { value, fontFamily, fontSize, codeBlockFontFamily, lineNumber, codeBlockTheme } = this.props
fontFamily = _.isString(fontFamily) && fontFamily.trim().length > 0
? [fontFamily].concat(defaultFontFamily)
: defaultFontFamily
codeBlockFontFamily = _.isString(codeBlockFontFamily) && codeBlockFontFamily.trim().length > 0
? [codeBlockFontFamily].concat(defaultCodeBlockFontFamily)
: defaultCodeBlockFontFamily
codeBlockTheme = hljsTheme().some((theme) => theme.name === codeBlockTheme) ? codeBlockTheme : 'xcode'
this.refs.root.contentWindow.document.head.innerHTML = `
<style>
@@ -86,7 +89,7 @@ export default class MarkdownPreview extends React.Component {
opacity: 0.5;
}
</style>
<link rel="stylesheet" href="../node_modules/highlight.js/styles/xcode.css" id="hljs-css">
<link rel="stylesheet" href="../node_modules/highlight.js/styles/${codeBlockTheme}.css">
<link rel="stylesheet" href="../resources/katex.min.css">
`
this.refs.root.contentWindow.document.body.innerHTML = markdown(value)

3
browser/components/markdown.styl
View File

@@ -198,13 +198,14 @@ code
margin-left 2px
pre
padding 1em !important
background-color #f7f7f7 !important
border solid 1px alpha(borderColor, 0.5)
border-radius 5px
overflow-x auto
margin 0 0 1em
line-height 1.35
code
margin 0
background-color inherit
padding 0
border none
border-radius 0