frodovdr
/
node-red
mirror of https://github.com/node-red/node-red.git
1
0
Fork 0
Code Issues Releases Wiki Activity

prevent editor context menu being clipped by sidebar 

- raise / lower tray z-index for correct slide animation
This commit is contained in:
Steve-Mcl 2021-04-29 17:03:17 +01:00
parent 71bdade7b9
commit f29488b24f
2 changed files with 20 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/node_modules/@node-red/editor-client/src/js/ui/tray.js vendored
View File

@ -166,6 +166,8 @@ RED.tray = (function() {
setTimeout(function() {
// Delay resetting the flag, so we don't close prematurely
openingTray = false;
raiseTrayZ();
handleWindowResize();//cause call to monaco layout
},200);
body.find(":focusable:first").trigger("focus");
@ -206,6 +208,17 @@ RED.tray = (function() {
}
}
//raise tray z-index to prevent editor context menu being clipped by sidebar
function raiseTrayZ() {
setTimeout(function(){
$('#red-ui-editor-stack').css("zIndex","13");
},300);
}
//lower tray z-index back to original place for correct slide animation (related to fix for editor context menu clipped by sidebar)
function lowerTrayZ(){
$('#red-ui-editor-stack').css("zIndex","9");
}
return {
init: function init() {
editorStack = $("#red-ui-editor-stack");
@ -221,6 +234,7 @@ RED.tray = (function() {
});
},
show: function show(options) {
lowerTrayZ();
if (!options) {
if (stack.length > 0) {
var tray = stack[stack.length-1];
@ -252,6 +266,7 @@ RED.tray = (function() {
},
hide: function hide() {
lowerTrayZ();
if (stack.length > 0) {
var tray = stack[stack.length-1];
tray.tray.css({
@ -266,6 +281,7 @@ RED.tray = (function() {
},
resize: handleWindowResize,
close: function close(done) {
lowerTrayZ(); //lower tray z-index for correct animation
if (stack.length > 0) {
var tray = stack.pop();
tray.tray.css({
@ -284,6 +300,8 @@ RED.tray = (function() {
handleWindowResize();
oldTray.tray.css({right:0});
if (oldTray.options.show) {
raiseTrayZ();
handleWindowResize();//cause call to monaco layout
oldTray.options.show();
}
},0);

3
packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss vendored
View File

@ -46,7 +46,7 @@
right: 315px;
bottom:10px;
width: 7px;
z-index: 11;
// z-index: 11;
background: $primary-background url(images/grip.png) no-repeat 50% 50%;
cursor: col-resize;
}
@ -134,6 +134,7 @@ button.red-ui-sidebar-header-button-toggle {
right: calc(100%);
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
z-index: 13;
}
.red-ui-sidebar-control-left {
@include red-ui-sidebar-control;