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

Make debug/config sidebar headers consistent

This commit is contained in:
Nick O'Leary 2016-01-12 23:55:18 +00:00
parent cb8fe8462a
commit fa4006619e
6 changed files with 25 additions and 31 deletions

View File

@ -19,7 +19,7 @@ RED.sidebar.config = (function() {
var content = document.createElement("div");
content.className = "sidebar-node-config"
$('<div id="sidebar-node-config-header">'+
$('<div class="button-group sidebar-header">'+
'<a class="sidebar-header-button selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
'<a class="sidebar-header-button" id="workspace-config-node-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
'</div>'

View File

@ -43,6 +43,7 @@ $workspace-button-color-disabled: #ccc;
$workspace-button-color-focus: #999;
$workspace-button-color-hover: #666;
$workspace-button-color-active: #666;
$workspace-button-color-selected: #AAA;
$typedInput-button-background: #efefef;
$typedInput-button-background-hover: #ddd;

View File

@ -58,11 +58,16 @@
text-decoration: none;
}
&.selected:not(.disabled) {
color: $workspace-button-color-active;
color: $workspace-button-color-selected;
background: $workspace-button-background-active;
cursor: default;
}
.button-group &:not(:first-child) {
border-left: none;
}
}
@mixin component-footer {
border-top: 1px solid $primary-border-color;
background: #f3f3f3;

View File

@ -62,6 +62,14 @@
padding: 2px 8px;
}
.sidebar-header {
color: #666;
text-align: right;
padding: 8px 10px;
background: #f3f3f3;
border-bottom: 1px solid $secondary-border-color;
}
#sidebar-footer {
@include component-footer;
}
@ -75,3 +83,6 @@
line-height: 13px;
padding: 5px 8px;
}
.sidebar-header-button:not(:first-child) {
border-left: none;
}

View File

@ -67,14 +67,3 @@
border-style: dashed;
color: #aaa;
}
#sidebar-node-config-header {
color: #666;
text-align: right;
padding: 8px 10px;
background: #f3f3f3;
border-bottom: 1px solid $secondary-border-color;
}
.sidebar-header-button:not(:first-child) {
border-left: none;
}

View File

@ -127,17 +127,10 @@
}
},
onpaletteadd: function() {
var content = document.createElement("div");
$(content).css({"position":"relative","height":"100%"});
var toolbar = document.createElement("div");
toolbar.id = "debug-toolbar";
content.appendChild(toolbar);
var content = $("<div>").css({"position":"relative","height":"100%"});
var toolbar = $('<div class="sidebar-header"><a id="debug-tab-clear" title="clear log" class="button" href="#"><i class="fa fa-trash"></i></a></div>').appendTo(content);
toolbar.innerHTML = '<div class="pull-right"><a id="debug-tab-clear" title="clear log" class="button" href="#"><i class="fa fa-trash"></i></a></div> ';
var messages = document.createElement("div");
messages.id = "debug-content";
content.appendChild(messages);
var messages = $('<div id="debug-content"/>').appendTo(content);
RED.sidebar.addTab({
id: "debug",
@ -221,9 +214,9 @@
'</span>';
}
msg.innerHTML += '<span class="debug-message-payload">'+ payload+ '</span>';
var atBottom = (sbc.scrollHeight-messages.offsetHeight-sbc.scrollTop) < 5;
var atBottom = (sbc.scrollHeight-messages.height()-sbc.scrollTop) < 5;
messageCount++;
$(messages).append(msg);
messages.append(msg);
if (messageCount > 200) {
$("#debug-content .debug-message:first").remove();
@ -257,17 +250,12 @@
<style>
#debug-content {
position: absolute;
top: 30px;
top: 43px;
bottom: 0px;
left:0px;
right: 0px;
overflow-y: scroll;
}
#debug-toolbar {
padding: 3px 10px;
height: 24px;
background: #f3f3f3;
}
.debug-message {
cursor: pointer;
border-bottom: 1px solid #eee;