editor: horizontal resize grip

This commit is contained in:
tophf 2017-06-27 18:55:17 +03:00
parent 9299972a34
commit 9ffc525391
2 changed files with 27 additions and 20 deletions

View File

@ -192,7 +192,13 @@
background: none; background: none;
} }
.CodeMirror-vscrollbar { .CodeMirror-vscrollbar {
margin-bottom: 8px; /* make space for resize-grip */ margin-bottom: 7px; /* make space for resize-grip */
}
.CodeMirror-hscrollbar {
bottom: 7px; /* make space for resize-grip */
}
.CodeMirror-scrollbar-filler {
bottom: 7px; /* make space for resize-grip */
} }
.CodeMirror-dialog { .CodeMirror-dialog {
-webkit-animation: highlight 3s ease-out; -webkit-animation: highlight 3s ease-out;
@ -242,14 +248,29 @@
.resize-grip { .resize-grip {
position: absolute; position: absolute;
display: block; display: block;
width: 8px; height: 6px;
height: 8px;
content: ""; content: "";
left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
z-index: 99; z-index: 9;
cursor: n-resize; cursor: n-resize;
background: linear-gradient(-45deg, transparent 2px, rgba(0,0,0,0.5) 2px, transparent 3px, transparent 4.5px, rgba(0,0,0,0.5) 5px, transparent 5.5px); background-color: inherit;
border-top-width: 1px;
border-top-style: solid;
border-top-color: inherit;
}
.resize-grip:after {
content: "";
bottom: 2px;
left: 0;
right: 0;
margin: 0 8px;
display: block;
position: absolute;
border-top-width: 2px;
border-top-style: dotted;
border-top-color: inherit;
} }
/* applies-to */ /* applies-to */
.applies-to { .applies-to {

14
edit.js
View File

@ -390,20 +390,6 @@ function setupCodeMirror(textarea, index) {
document.body.style.cursor = ''; document.body.style.cursor = '';
}); });
}); });
// resizeGrip has enough space when scrollbars.horiz is visible
if (cm.display.scrollbars.horiz.style.display != "") {
cm.display.scrollbars.vert.style.marginBottom = "0";
}
// resizeGrip space adjustment in case a long line was entered/deleted by a user
new MutationObserver(function(mutations) {
var hScrollbar = mutations[0].target;
var hScrollbarVisible = hScrollbar.style.display != "";
var vScrollbar = hScrollbar.parentNode.CodeMirror.display.scrollbars.vert;
vScrollbar.style.marginBottom = hScrollbarVisible ? "0" : "";
}).observe(cm.display.scrollbars.horiz, {
attributes: true,
attributeFilter: ["style"]
});
editors.splice(index || editors.length, 0, cm); editors.splice(index || editors.length, 0, cm);
return cm; return cm;