add overflow auto; remove gutter outline

This commit is contained in:
2022-10-26 10:33:08 +02:00
parent f3a875f489
commit e9eeaeb6f5

View File

@@ -55,9 +55,21 @@ export default defineComponent({
main { main {
height: 100%; height: 100%;
} }
.left-pane {
overflow-x: auto;
}
.right-pane {
overflow-x: auto;
overflow-y: auto;
}
</style> </style>
<style> <style>
.p-splitter-gutter {
outline-width: 0;
}
.p-splitter-gutter-handle:focus { .p-splitter-gutter-handle:focus {
box-shadow: none !important; box-shadow: none !important;
} }
@@ -66,7 +78,7 @@ main {
<template> <template>
<main> <main>
<Splitter style="height: 100%" :step="50" :gutterSize="8" layout="horizontal"> <Splitter style="height: 100%" :step="50" :gutterSize="8" layout="horizontal">
<SplitterPanel> <SplitterPanel class="left-pane">
<codemirror <codemirror
v-model="code" v-model="code"
placeholder="Code goes here..." placeholder="Code goes here..."
@@ -81,8 +93,8 @@ main {
@blur="log('blur', $event)" @blur="log('blur', $event)"
/> />
</SplitterPanel> </SplitterPanel>
<SplitterPanel> <SplitterPanel class="right-pane">
Right Pane <pre>Right Pane</pre>
</SplitterPanel> </SplitterPanel>
</Splitter> </Splitter>
</main> </main>