1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Namespace context/config sidebar css

This commit is contained in:
Nick O'Leary 2019-04-30 23:28:35 +01:00
parent 9dac679b72
commit 5866dad79a
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
4 changed files with 31 additions and 31 deletions

View File

@ -47,19 +47,19 @@ RED.sidebar.config = (function() {
var container = $('<div class="red-ui-palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
var header = $('<div class="workspace-config-node-tray-header red-ui-palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
if (label) {
$('<span class="config-node-label"/>').text(label).appendTo(header);
$('<span class="red-ui-palette-node-config-label"/>').text(label).appendTo(header);
} else {
$('<span class="config-node-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
$('<span class="red-ui-palette-node-config-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
}
$('<span class="config-node-filter-info"></span>').appendTo(header);
category = $('<ul class="red-ui-palette-content config-node-list"></ul>').appendTo(container);
$('<span class="red-ui-sidebar-node-config-filter-info"></span>').appendTo(header);
category = $('<ul class="red-ui-palette-content red-ui-sidebar-node-config-list"></ul>').appendTo(container);
container.i18n();
var icon = header.find("i");
var result = {
label: label,
list: category,
size: function() {
return result.list.find("li:not(.config_node_none)").length
return result.list.find("li:not(.red-ui-palette-node-config-none)").length
},
open: function(snap) {
if (!icon.hasClass("expanded")) {
@ -96,7 +96,7 @@ RED.sidebar.config = (function() {
categories[name] = result;
} else {
if (categories[name].label !== label) {
categories[name].list.parent().find('.config-node-label').text(label);
categories[name].list.parent().find('.red-ui-palette-node-config-label').text(label);
categories[name].label = label;
}
}
@ -119,27 +119,27 @@ RED.sidebar.config = (function() {
})
hiddenCount = hiddenCount - nodes.length;
if (hiddenCount > 0) {
list.parent().find('.config-node-filter-info').text(RED._('sidebar.config.filtered',{count:hiddenCount})).show();
list.parent().find('.red-ui-sidebar-node-config-filter-info').text(RED._('sidebar.config.filtered',{count:hiddenCount})).show();
} else {
list.parent().find('.config-node-filter-info').hide();
list.parent().find('.red-ui-sidebar-node-config-filter-info').hide();
}
} else {
list.parent().find('.config-node-filter-info').hide();
list.parent().find('.red-ui-sidebar-node-config-filter-info').hide();
}
list.empty();
if (nodes.length === 0) {
$('<li class="config_node_none" data-i18n="sidebar.config.none">NONE</li>').i18n().appendTo(list);
$('<li class="red-ui-palette-node-config-none" data-i18n="sidebar.config.none">NONE</li>').i18n().appendTo(list);
category.close(true);
} else {
var currentType = "";
nodes.forEach(function(node) {
var label = RED.utils.getNodeLabel(node,node.id);
if (node.type != currentType) {
$('<li class="config_node_type">'+node.type+'</li>').appendTo(list);
$('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list);
currentType = node.type;
}
var entry = $('<li class="red-ui-palette-node config_node red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
var entry = $('<li class="red-ui-palette-node red-ui-palette-node-config red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
entry.data('node',node.id);
$('<div class="red-ui-palette-label"></div>').text(label).appendTo(entry);
if (node._def.hasUsers !== false) {
@ -155,7 +155,7 @@ RED.sidebar.config = (function() {
}
RED.popover.tooltip(iconContainer,RED._('editor.nodesUse',{count:node.users.length}));
if (node.users.length === 0) {
entry.addClass("config_node_unused");
entry.addClass("red-ui-palette-node-config-unused");
}
}
entry.on('click',function(e) {

View File

@ -32,13 +32,13 @@ RED.sidebar.context = (function() {
function init() {
content = $("<div>").css({"position":"relative","height":"100%"});
content.className = "sidebar-context"
content.className = "red-ui-sidebar-context"
var footerToolbar = $('<div></div>');
var stackContainer = $("<div>",{class:"sidebar-context-stack"}).appendTo(content);
var stackContainer = $("<div>",{class:"red-ui-sidebar-context-stack"}).appendTo(content);
sections = RED.stack.create({
container: stackContainer
});
@ -52,7 +52,7 @@ RED.sidebar.context = (function() {
});
nodeSection.expand();
nodeSection.content.css({height:"100%"});
nodeSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(nodeSection.content);
nodeSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(nodeSection.content);
var table = $('<table class="node-info"></table>').appendTo(nodeSection.content);
nodeSection.table = $('<tbody>').appendTo(table);
var bg = $('<div style="float: right"></div>').appendTo(nodeSection.header);
@ -86,7 +86,7 @@ RED.sidebar.context = (function() {
});
flowSection.expand();
flowSection.content.css({height:"100%"});
flowSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(flowSection.content);
flowSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(flowSection.content);
var table = $('<table class="node-info"></table>').appendTo(flowSection.content);
flowSection.table = $('<tbody>').appendTo(table);
bg = $('<div style="float: right"></div>').appendTo(flowSection.header);
@ -104,7 +104,7 @@ RED.sidebar.context = (function() {
});
globalSection.expand();
globalSection.content.css({height:"100%"});
globalSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(globalSection.content);
globalSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(globalSection.content);
var table = $('<table class="node-info"></table>').appendTo(globalSection.content);
globalSection.table = $('<tbody>').appendTo(table);
@ -230,7 +230,7 @@ RED.sidebar.context = (function() {
sortedData[keys[i]].forEach(function(v) {
var k = keys[i];
var l2 = sortedData[k].length;
var propRow = $('<tr class="node-info-node-row"><td class="sidebar-context-property"></td><td></td></tr>').appendTo(container);
var propRow = $('<tr class="node-info-node-row"><td class="red-ui-sidebar-context-property"></td><td></td></tr>').appendTo(container);
var obj = $(propRow.children()[0]);
obj.text(k);
var tools = $('<span class="button-group"></span>');
@ -312,7 +312,7 @@ RED.sidebar.context = (function() {
tools: tools
}).appendTo(propRow.children()[1]);
if (contextStores.length > 1) {
$("<span>",{class:"sidebar-context-property-storename"}).text(v.store).appendTo($(propRow.children()[0]))
$("<span>",{class:"red-ui-sidebar-context-property-storename"}).text(v.store).appendTo($(propRow.children()[0]))
}
});
}

View File

@ -22,7 +22,7 @@
@include disable-selection;
}
.config-node-list {
.red-ui-sidebar-node-config-list {
margin: 0;
list-style-type: none;
.red-ui-palette-node {
@ -32,7 +32,7 @@
background-color: #eee;
}
}
.palette_label {
.red-ui-palette-label {
margin-left: 8px;
line-height: 24px;
text-align: left;
@ -60,14 +60,14 @@
}
}
}
.config_node {
.red-ui-palette-node-config {
width: 160px;
height: 30px;
background: #f3f3f3;
color: #666;
cursor: pointer;
}
.config_node_type {
.red-ui-palette-node-config-type {
color: #999;
text-align: right;
padding-right: 3px;
@ -75,18 +75,18 @@
margin-top: 20px;
}
}
.config_node_none {
.red-ui-palette-node-config-none {
color: #ddd;
text-align:right;
padding-right: 3px;
}
.config_node_unused {
.red-ui-palette-node-config-unused {
border-color: #aaa;
background: #f9f9f9;
border-style: dashed;
color: #aaa;
}
.config-node-filter-info {
.red-ui-sidebar-node-config-filter-info {
position: absolute;
top: 0;
right:0;

View File

@ -14,7 +14,7 @@
* limitations under the License.
**/
.sidebar-context-stack {
.red-ui-sidebar-context-stack {
position: absolute;
top: 0;
bottom: 0;
@ -29,7 +29,7 @@
}
}
.sidebar-context-property {
.red-ui-sidebar-context-property {
position: relative;
.debug-message-tools {
right: 0px;
@ -40,13 +40,13 @@
display: inline-block;
}
}
.sidebar-context-updated {
.red-ui-sidebar-context-updated {
text-align: right;
font-size: 11px;
color: #bbb;
padding: 1px 3px;
}
.sidebar-context-property-storename {
.red-ui-sidebar-context-property-storename {
display: block;
font-size: 0.8em;
font-style: italic;