diff --git a/browser/components/MarkdownEditor.js b/browser/components/MarkdownEditor.js index cd885fd9..5c2ddbdb 100644 --- a/browser/components/MarkdownEditor.js +++ b/browser/components/MarkdownEditor.js @@ -119,7 +119,7 @@ class MarkdownEditor extends React.Component { status: 'PREVIEW' }, () => { this.refs.preview.focus() - this.refs.preview.scrollTo(cursorPosition.line) + this.refs.preview.scrollToRow(cursorPosition.line) }) eventEmitter.emit('topbar:togglelockbutton', this.state.status) } diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index c1dc287e..2b74e4ec 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -102,7 +102,11 @@ ${markdownStyle} body { font-family: '${fontFamily.join("','")}'; font-size: ${fontSize}px; - ${scrollPastEnd ? 'padding-bottom: 90vh;' : ''} + ${scrollPastEnd ? ` + padding-bottom: 90vh; + box-sizing: border-box; + ` + : ''} ${optimizeOverflowScroll ? 'height: 100%;' : ''} } @media print { @@ -611,7 +615,7 @@ export default class MarkdownPreview extends React.Component { // Should scroll to top after selecting another note if (prevProps.noteKey !== this.props.noteKey) { - this.getWindow().scrollTo(0, 0) + this.scrollTo(0, 0) } } @@ -996,7 +1000,11 @@ export default class MarkdownPreview extends React.Component { return this.refs.root.contentWindow } - scrollTo (targetRow) { + /** + * @public + * @param {Number} targetRow + */ + scrollToRow (targetRow) { const blocks = this.getWindow().document.querySelectorAll( 'body>[data-line]' ) @@ -1006,12 +1014,21 @@ export default class MarkdownPreview extends React.Component { const row = parseInt(block.getAttribute('data-line')) if (row > targetRow || index === blocks.length - 1) { block = blocks[index - 1] - block != null && this.getWindow().scrollTo(0, block.offsetTop) + block != null && this.scrollTo(0, block.offsetTop) break } } } + /** + * `document.body.scrollTo` + * @param {Number} x + * @param {Number} y + */ + scrollTo (x, y) { + this.getWindow().document.body.scrollTo(x, y) + } + preventImageDroppedHandler (e) { e.preventDefault() e.stopPropagation() @@ -1054,7 +1071,7 @@ export default class MarkdownPreview extends React.Component { ) if (targetElement != null) { - this.getWindow().scrollTo(0, targetElement.offsetTop) + this.scrollTo(0, targetElement.offsetTop) } return }