editor: horizontal resize grip
This commit is contained in:
parent
9299972a34
commit
9ffc525391
31
edit.html
31
edit.html
|
@ -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
14
edit.js
|
@ -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;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user