Fix resizer highlight and scroll bar style

This commit is contained in:
Thomas Nordquist
2019-04-15 11:00:28 +02:00
parent 2de7840897
commit 46fa93edbd
3 changed files with 12 additions and 11 deletions

View File

@@ -39,7 +39,8 @@
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(30,30,30,0.3); -webkit-box-shadow: inset 0 0 6px rgba(60,60,60,0.5);
background-color: rgba(140,140,140,0.1);
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
@@ -74,21 +75,23 @@
} }
.Resizer.horizontal:hover { .Resizer.horizontal:hover {
border-top: 5px solid rgba(0, 0, 0, 0.5); border-top: 5px solid rgba(120, 120, 120, 0.5);
border-bottom: 5px solid rgba(0, 0, 0, 0.5); border-bottom: 5px solid rgba(120, 120, 120, 0.5);
} }
.Resizer.vertical { .Resizer.vertical {
width: 11px; /* width: 11px;
margin: 0 -5px; margin: 0 -5px; */
border-left: 5px solid rgba(255, 255, 255, 0); width: 2px;
border-right: 5px solid rgba(255, 255, 255, 0); margin: 0px -8px 0px 0px;
border-left: 4px solid rgba(128, 128, 128, 0);
border-right: 4px solid rgba(128, 128, 128, 0);
cursor: col-resize; cursor: col-resize;
} }
.Resizer.vertical:hover { .Resizer.vertical:hover {
border-left: 5px solid rgba(255, 255, 255, 0.5); border-left: 4px solid rgba(130, 130, 130, 1);
border-right: 5px solid rgba(255, 255, 255, 0.5); border-right: 4px solid rgba(140, 140, 140, 1);
} }
.Resizer.disabled { .Resizer.disabled {
cursor: not-allowed; cursor: not-allowed;

View File

@@ -12,7 +12,6 @@ export default function ContentView(props: {heightProperty: any, paneDefaults: a
split="vertical" split="vertical"
minSize={250} minSize={250}
defaultSize={500} defaultSize={500}
resizerStyle={{ width: '2px', margin: '0 -10px 0 0px' }}
allowResize={true} allowResize={true}
style={{ position: 'relative' }} style={{ position: 'relative' }}
pane1Style={{ overflow: 'hidden' }} pane1Style={{ overflow: 'hidden' }}

View File

@@ -5,7 +5,6 @@ import { CodeBlockColors, CodeBlockColorsBraceMonokai } from './CodeBlockColors'
import { selectTextWithCtrlA } from '../../utils/handleTextSelectWithCtrlA' import { selectTextWithCtrlA } from '../../utils/handleTextSelectWithCtrlA'
import { Theme, withStyles } from '@material-ui/core' import { Theme, withStyles } from '@material-ui/core'
import 'prismjs/components/prism-json' import 'prismjs/components/prism-json'
import 'prismjs/themes/prism-tomorrow.css'
interface Props { interface Props {
previous: string previous: string