diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js
index 0348996d..f2157882 100755
--- a/browser/components/MarkdownPreview.js
+++ b/browser/components/MarkdownPreview.js
@@ -132,7 +132,15 @@ const scrollBarStyle = `
}
::-webkit-scrollbar-thumb {
- box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+ background-color: rgba(0, 0, 0, 0.15);
+}
+`
+const scrollBarDarkStyle = `
+::-webkit-scrollbar {
+ width: 12px;
+}
+
+::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.3);
}
`
@@ -301,6 +309,21 @@ export default class MarkdownPreview extends React.Component {
}
}
+ getScrollBarStyle () {
+ const {
+ theme
+ } = this.props
+
+ switch (theme) {
+ case 'dark':
+ case 'solarized-dark':
+ case 'monokai':
+ return scrollBarDarkStyle
+ default:
+ return scrollBarStyle
+ }
+ }
+
componentDidMount () {
this.refs.root.setAttribute('sandbox', 'allow-scripts')
this.refs.root.contentWindow.document.body.addEventListener('contextmenu', this.contextMenuHandler)
@@ -310,7 +333,7 @@ export default class MarkdownPreview extends React.Component {
`
diff --git a/browser/main/global.styl b/browser/main/global.styl
index 9a967085..8f3216ef 100644
--- a/browser/main/global.styl
+++ b/browser/main/global.styl
@@ -19,8 +19,7 @@ body
width 12px
::-webkit-scrollbar-thumb
- box-shadow inset 0 0 6px rgba(0, 0, 0, 0.3)
- background-color rgba(0, 0, 0, 0.3)
+ background-color rgba(0, 0, 0, 0.15)
button, input, select, textarea
font-family DEFAULT_FONTS
@@ -95,6 +94,8 @@ modalBackColor = white
body[data-theme="dark"]
+ ::-webkit-scrollbar-thumb
+ background-color rgba(0, 0, 0, 0.3)
.ModalBase
.modalBack
background-color $ui-dark-backgroundColor
@@ -135,6 +136,8 @@ body[data-theme="dark"]
z-index modalZIndex + 5
body[data-theme="solarized-dark"]
+ ::-webkit-scrollbar-thumb
+ background-color rgba(0, 0, 0, 0.3)
.ModalBase
.modalBack
background-color $ui-solarized-dark-backgroundColor
@@ -142,6 +145,8 @@ body[data-theme="solarized-dark"]
color: $ui-solarized-dark-text-color
body[data-theme="monokai"]
+ ::-webkit-scrollbar-thumb
+ background-color rgba(0, 0, 0, 0.3)
.ModalBase
.modalBack
background-color $ui-monokai-backgroundColor