frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2025-03-01 10:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix menu padding to handle both icons and submenus

Browse Source 
Fixes #3683
This commit is contained in:
Nick O'Leary
2022-06-16 23:18:02 +01:00
parent 7d7682b34e
commit 53184715bc
2 changed files with 35 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js vendored
View File

@@ -133,6 +133,8 @@ RED.menu = (function() {
if (opt.options) {
item.addClass("red-ui-menu-dropdown-submenu"+(opt.direction!=='right'?" pull-left":""));
var submenu = $('<ul id="'+opt.id+'-submenu" class="red-ui-menu-dropdown"></ul>').appendTo(item);
var hasIcons = false
var hasSubmenus = false
for (var i=0;i<opt.options.length;i++) {
@@ -144,6 +146,8 @@ RED.menu = (function() {
opt.options[i].onpostselect = opt.onpostselect
}
opt.options[i].direction = opt.direction
hasIcons = hasIcons || (opt.options[i].icon);
hasSubmenus = hasSubmenus || (opt.options[i].options);
}
var li = createMenuItem(opt.options[i]);
@@ -151,6 +155,14 @@ RED.menu = (function() {
li.appendTo(submenu);
}
}
if (!hasIcons) {
submenu.addClass("red-ui-menu-dropdown-noicons")
}
if (hasSubmenus) {
submenu.addClass("red-ui-menu-dropdown-submenus")
}
}
if (opt.disabled) {
item.addClass("disabled");
@@ -191,6 +203,8 @@ RED.menu = (function() {
}
var lastAddedSeparator = false;
var hasSubmenus = false;
var hasIcons = false;
for (var i=0;i<options.options.length;i++) {
var opt = options.options[i];
if (opt) {
@@ -203,6 +217,8 @@ RED.menu = (function() {
opt.direction = options.direction || 'left'
}
if (opt !== null || !lastAddedSeparator) {
hasIcons = hasIcons || (opt && opt.icon);
hasSubmenus = hasSubmenus || (opt && opt.options);
var li = createMenuItem(opt);
if (li) {
li.appendTo(topMenu);
@@ -210,7 +226,12 @@ RED.menu = (function() {
}
}
}
if (!hasIcons) {
topMenu.addClass("red-ui-menu-dropdown-noicons")
}
if (hasSubmenus) {
topMenu.addClass("red-ui-menu-dropdown-submenus")
}
return topMenu;
}

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

@@ -46,7 +46,7 @@
& > li > a,
& > li > a:focus {
display: block;
padding: 4px 20px 4px 12px;
padding: 4px 12px 4px 32px;
clear: both;
font-weight: normal;
line-height: 20px;
@@ -58,6 +58,18 @@
& > li.pull-left > a:focus {
padding: 4px 12px 4px 32px;
}
&.red-ui-menu-dropdown-noicons > li > a,
&.red-ui-menu-dropdown-noicons > li > a:focus {
padding: 4px 12px 4px 12px;
}
&.red-ui-menu-dropdown-submenus > li > a,
&.red-ui-menu-dropdown-submenus > li > a:focus {
padding-right: 20px;
}
& > .active > a,
& > .active > a:hover,
& > .active > a:focus {