frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Refresh appearance

Browse Source
This commit is contained in:
Nick O'Leary 2015-07-11 23:43:45 +01:00
parent 846ab08661
commit 6bde07b5a0
10 changed files with 86 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
editor/js/ui/sidebar.js
View File

@ -30,7 +30,8 @@ RED.sidebar = (function() {
if (tab.onremove) { if (tab.onremove) {
tab.onremove.call(tab); tab.onremove.call(tab);
} }
} },
minimumActiveTabWidth: 110
}); });
var knownTabs = { var knownTabs = {
@ -110,7 +111,7 @@ RED.sidebar = (function() {
var d = ui.position.left-sidebarSeparator.start; var d = ui.position.left-sidebarSeparator.start;
var newSidebarWidth = sidebarSeparator.width-d; var newSidebarWidth = sidebarSeparator.width-d;
if (sidebarSeparator.opening) { if (sidebarSeparator.opening) {
newSidebarWidth -= 13; newSidebarWidth -= 3;
} }
if (newSidebarWidth > 150) { if (newSidebarWidth > 150) {
@ -155,7 +156,7 @@ RED.sidebar = (function() {
} }
} }
$("#sidebar-separator").css("left","auto"); $("#sidebar-separator").css("left","auto");
$("#sidebar-separator").css("right",($("#sidebar").width()+13)+"px"); $("#sidebar-separator").css("right",($("#sidebar").width()+3)+"px");
RED.events.emit("sidebar:resize"); RED.events.emit("sidebar:resize");
} }
}); });

12
editor/js/ui/view.js
View File

@ -1224,8 +1224,8 @@ RED.view = (function() {
.attr("transform",function(d) { return "translate("+((d._def.align == "right") ? 94 : -25)+",2)"; }) .attr("transform",function(d) { return "translate("+((d._def.align == "right") ? 94 : -25)+",2)"; })
.attr("class",function(d) { return "node_button "+((d._def.align == "right") ? "node_right_button" : "node_left_button"); }); .attr("class",function(d) { return "node_button "+((d._def.align == "right") ? "node_right_button" : "node_left_button"); });
nodeButtonGroup.append('rect') nodeButtonGroup.append('rect')
.attr("rx",8) .attr("rx",5)
.attr("ry",8) .attr("ry",5)
.attr("width",32) .attr("width",32)
.attr("height",node_height-4) .attr("height",node_height-4)
.attr("fill","#eee");//function(d) { return d._def.color;}) .attr("fill","#eee");//function(d) { return d._def.color;})
@ -1233,8 +1233,8 @@ RED.view = (function() {
.attr("class","node_button_button") .attr("class","node_button_button")
.attr("x",function(d) { return d._def.align == "right"? 10:5}) .attr("x",function(d) { return d._def.align == "right"? 10:5})
.attr("y",4) .attr("y",4)
.attr("rx",5) .attr("rx",4)
.attr("ry",5) .attr("ry",4)
.attr("width",16) .attr("width",16)
.attr("height",node_height-12) .attr("height",node_height-12)
.attr("fill",function(d) { return d._def.color;}) .attr("fill",function(d) { return d._def.color;})
@ -1256,8 +1256,8 @@ RED.view = (function() {
var mainRect = node.append("rect") var mainRect = node.append("rect")
.attr("class", "node") .attr("class", "node")
.classed("node_unknown",function(d) { return d.type == "unknown"; }) .classed("node_unknown",function(d) { return d.type == "unknown"; })
.attr("rx", 6) .attr("rx", 5)
.attr("ry", 6) .attr("ry", 5)
.attr("fill",function(d) { return d._def.color;}) .attr("fill",function(d) { return d._def.color;})
.on("mouseup",nodeMouseUp) .on("mouseup",nodeMouseUp)
.on("mousedown",nodeMouseDown) .on("mousedown",nodeMouseDown)

22
editor/sass/flow.scss
View File

@ -49,10 +49,6 @@
margin-left: 20px; margin-left: 20px;
} }
#workspace {
@include component-border;
}
.node_label_italic { .node_label_italic {
font-style: italic; font-style: italic;
} }
@ -90,7 +86,7 @@
.node { .node {
stroke: #999; stroke: #999;
cursor: move; cursor: move;
stroke-width: 2; stroke-width: 1;
} }
.node_unknown { .node_unknown {
stroke-dasharray:10,4; stroke-dasharray:10,4;
@ -120,7 +116,7 @@
} }
.port { .port {
stroke: #999; stroke: #999;
stroke-width: 2; stroke-width: 1;
fill: #ddd; fill: #ddd;
cursor: crosshair; cursor: crosshair;
} }
@ -158,11 +154,12 @@
stroke: #ff0000; stroke: #ff0000;
} }
.node_selected { .node_selected {
stroke-width: 2;
stroke: #ff7f0e !important; stroke: #ff7f0e !important;
} }
.node_highlighted { .node_highlighted {
stroke: #dd1616; stroke: #dd1616;
stroke-width: 3; stroke-width: 2;
stroke-dasharray: 10, 4; stroke-dasharray: 10, 4;
} }
.node_hovered { .node_hovered {
@ -180,7 +177,7 @@
.drag_line { .drag_line {
stroke: #ff7f0e; stroke: #ff7f0e;
stroke-width: 5; stroke-width: 4;
fill: none; fill: none;
pointer-events: none; pointer-events: none;
} }
@ -194,7 +191,7 @@
.link_line { .link_line {
stroke: #7f7f7f; stroke: #7f7f7f;
stroke-width: 4; stroke-width: 3;
fill: none; fill: none;
pointer-events: none; pointer-events: none;
} }
@ -202,12 +199,12 @@
.link_subflow { .link_subflow {
stroke: #bbb; stroke: #bbb;
stroke-dasharray: 10,5; stroke-dasharray: 10,5;
stroke-width: 3; stroke-width: 2;
} }
.link_outline { .link_outline {
stroke: #fff; stroke: #fff;
stroke-width: 6; stroke-width: 4;
cursor: crosshair; cursor: crosshair;
fill: none; fill: none;
pointer-events: none; pointer-events: none;
@ -215,7 +212,7 @@
.link_background { .link_background {
stroke: #fff; stroke: #fff;
opacity: 0; opacity: 0;
stroke-width: 25; stroke-width: 20;
cursor: crosshair; cursor: crosshair;
fill: none; fill: none;
} }
@ -228,4 +225,3 @@ g.link_unknown path.link_line {
stroke-width: 2; stroke-width: 2;
stroke-dasharray: 10, 4; stroke-dasharray: 10, 4;
} }

5
editor/sass/mixins.scss
View File

@ -23,7 +23,6 @@
} }
@mixin component-border { @mixin component-border {
border: 1px solid #000; border: 1px solid #999;
border-radius: 3px; box-sizing: border-box;
} }

48
editor/sass/palette.scss
View File

@ -17,11 +17,11 @@
#palette { #palette {
position: absolute; position: absolute;
top: 5px; top: 0px;
bottom: 10px; bottom: 10px;
left:10px; left:0px;
background: #f3f3f3; background: #f3f3f3;
width: 170px; width: 180px;
text-align: center; text-align: center;
@include disable-selection; @include disable-selection;
@include component-border; @include component-border;
@ -30,11 +30,11 @@
.palette-scroll { .palette-scroll {
display: none; display: none;
position: absolute; position: absolute;
top: 0; top: 35px;
right: 0; right: 0;
bottom: 35px; bottom: 0;
left:0; left:0;
padding: 5px; padding: 0;
overflow-y: auto; overflow-y: auto;
box-sizing:border-box; box-sizing:border-box;
} }
@ -44,27 +44,30 @@
#palette-search { #palette-search {
position: absolute; position: absolute;
display: none; display: none;
bottom: 0; top: 0;
left:0; left:0;
right:0; right:0;
overflow: hidden; overflow: hidden;
background: #f3f3f3; background: #ffffff;
text-align: center; text-align: center;
height: 35px; height: 35px;
padding: 3px; padding: 3px;
border-top: 1px solid #999; border-bottom: 1px solid #999;
box-sizing:border-box; box-sizing:border-box;
} }
#palette-search i {
color: #666;
}
#palette-search i.fa-search { #palette-search i.fa-search {
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
left: 4px; left: 5px;
top: 10px; top: 11px;
} }
#palette-search i.fa-times { #palette-search i.fa-times {
position: absolute; position: absolute;
right: 6px; right: 7px;
top: 10px; top: 11px;
} }
#palette-search-clear { #palette-search-clear {
@ -91,25 +94,22 @@
} }
.palette-category { .palette-category {
border: 1px solid #999; border-bottom: 1px solid #ccc;
border-radius: 3px;
margin-bottom: 5px;
} }
.palette-content { .palette-content {
background: #fff; background: #fff;
border-top: 1px solid #aaa; padding: 3px;
padding-bottom: 3px;
} }
.palette-header { .palette-header {
background: #f3f3f3; background: #f3f3f3;
border-radius: 3px;
cursor: pointer; cursor: pointer;
text-align: left; text-align: left;
padding: 1px; padding: 9px;
font-weight: bold;
} }
.palette-header i { .palette-header i {
margin: 3px 4px 3px 3px; margin: 3px 10px 3px 3px;
-webkit-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out;
@ -141,8 +141,8 @@
background: #ddd; background: #ddd;
margin: 10px auto; margin: 10px auto;
height: 25px; height: 25px;
border-radius: 6px; border-radius: 5px;
border: 2px solid #999; border: 1px solid #999;
background-position: 5% 50%; background-position: 5% 50%;
background-repeat: no-repeat; background-repeat: no-repeat;
width: 120px; width: 120px;
@ -181,7 +181,7 @@
bottom:0; bottom:0;
left:0; left:0;
width: 30px; width: 30px;
border-right: 2px solid rgba(0,0,0,0.1); border-right: 1px solid rgba(0,0,0,0.1);
background-color: rgba(0,0,0,0.05); background-color: rgba(0,0,0,0.05);
} }
.palette_icon_container_right { .palette_icon_container_right {

10
editor/sass/sidebar.scss
View File

@ -18,10 +18,10 @@
#sidebar { #sidebar {
position: absolute; position: absolute;
top: 5px; top: 0px;
right: 10px; right: 0px;
bottom: 10px; bottom: 10px;
width: 305px; width: 315px;
background: #fff; background: #fff;
box-sizing: border-box; box-sizing: border-box;
@include component-border; @include component-border;
@ -35,10 +35,11 @@
#sidebar-content { #sidebar-content {
position: absolute; position: absolute;
top: 30px; top: 35px;
right: 0; right: 0;
bottom: 1px; bottom: 1px;
left: 0px; left: 0px;
padding-top: 10px;
font-size: 1.2em; font-size: 1.2em;
overflow-y: auto; overflow-y: auto;
} }
@ -57,4 +58,3 @@
.sidebar-closed > #sidebar-separator { right: 0px !important; } .sidebar-closed > #sidebar-separator { right: 0px !important; }
.sidebar-closed > #workspace { right: 15px !important; } .sidebar-closed > #workspace { right: 15px !important; }
.sidebar-closed > #chart-zoom-controls { right: 35px !important; } .sidebar-closed > #chart-zoom-controls { right: 35px !important; }

7
editor/sass/style.scss
View File

@ -46,12 +46,12 @@
body { body {
font: 13px "Helvetica" !important; font: 13px "Helvetica" !important;
padding-top: 100px; padding-top: 100px;
background: url("images/pw_maze_white.png"); background: #f3f3f3;
} }
#main-container { #main-container {
position: absolute; position: absolute;
top:50px; left:0; bottom: 0; right:0; top:40px; left:0; bottom: 0; right:0;
overflow:hidden; overflow:hidden;
} }
@ -65,6 +65,3 @@ i.spinner {
background: url(images/spin.svg) no-repeat 50% 50%; background: url(images/spin.svg) no-repeat 50% 50%;
background-size: contain background-size: contain
} }

29
editor/sass/tabs.scss
View File

@ -16,12 +16,13 @@
ul.red-ui-tabs { ul.red-ui-tabs {
list-style-type: none; list-style-type: none;
padding:5px 2px 0px 5px; padding:0;
margin: 0; margin: 0;
display: block; display: block;
height: 24px; height: 35px;
box-sizing:border-box;
border-bottom: 1px solid #999; border-bottom: 1px solid #999;
background: #e3e3e3; background: #fff;
-webkit-user-select: none; -webkit-user-select: none;
-khtml-user-select: none; -khtml-user-select: none;
-moz-user-select: none; -moz-user-select: none;
@ -30,17 +31,16 @@ ul.red-ui-tabs {
} }
ul.red-ui-tabs li { ul.red-ui-tabs li {
border-top-left-radius: 5px; box-sizing:border-box;
border-top-right-radius: 5px;
display: inline-block; display: inline-block;
border-left: 1px solid #999; border-left: 1px solid #999;
border-top: 1px solid #999; border-top: 1px solid #999;
border-right: 1px solid #999; border-right: 1px solid #999;
border-bottom: 1px solid #999; border-bottom: 1px solid #999;
background: #e3e3e3; background: #f3f3f3;
margin: 0 5px 0 0; margin: 3px 3px 0 3px;
height: 23px; height: 32px;
line-height: 17px; line-height: 24px;
max-width: 200px; max-width: 200px;
width: 14%; width: 14%;
overflow: hidden; overflow: hidden;
@ -49,7 +49,9 @@ ul.red-ui-tabs li {
ul.red-ui-tabs li a.red-ui-tab-label { ul.red-ui-tabs li a.red-ui-tab-label {
display: block; display: block;
padding: 3px 16px; padding: 3px 12px;
width: 100%;
height: 100%;
color: #666; color: #666;
} }
ul.red-ui-tabs li { ul.red-ui-tabs li {
@ -75,11 +77,15 @@ ul.red-ui-tabs li a.red-ui-tab-close:hover {
} }
ul.red-ui-tabs li a:hover { ul.red-ui-tabs li a:hover {
text-decoration: none; text-decoration: none;
background: #f0f0f0; background: #ddd;
}
ul.red-ui-tabs li a:focus {
text-decoration: none;
} }
ul.red-ui-tabs li.active { ul.red-ui-tabs li.active {
background: #fff; background: #fff;
font-weight: bold;
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
} }
ul.red-ui-tabs li.active a { ul.red-ui-tabs li.active a {
@ -93,7 +99,6 @@ ul.red-ui-tabs li.active a.red-ui-tab-label:hover {
} }
ul.red-ui-tabs li.red-ui-add-tab { ul.red-ui-tabs li.red-ui-add-tab {
width: 25px; width: 25px;
border-top-right-radius: 15px;
line-height: 22px; line-height: 22px;
} }
ul.red-ui-tabs li.red-ui-add-tab a { ul.red-ui-tabs li.red-ui-add-tab a {

18
editor/sass/workspace.scss
View File

@ -20,9 +20,10 @@
background: #e3e3e3; background: #e3e3e3;
position: absolute; position: absolute;
bottom:0px; bottom:0px;
top: 30px; top: 35px;
left:0px; left:0px;
right:0px; right:0px;
box-sizing:border-box;
} }
#chart svg:focus { #chart svg:focus {
outline: none; outline: none;
@ -31,11 +32,12 @@
#workspace { #workspace {
position: absolute; position: absolute;
margin: 0; margin: 0;
top:5px; top:0px;
left:190px; left:179px;
bottom: 10px; bottom: 10px;
right: 330px; right: 330px;
overflow: hidden; overflow: hidden;
@include component-border;
} }
#chart-zoom-controls { #chart-zoom-controls {
@ -56,21 +58,21 @@
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
height: 29px; height: 34px;
width: 28px; width: 28px;
border-bottom: 1px solid #999; border-bottom: 1px solid #999;
border-left: 1px solid #999;
} }
#btn-workspace-add-tab { #btn-workspace-add-tab {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
background: #e3e3e3; background: #f3f3f3;
height: 100%; height: 100%;
line-height: 30px; line-height: 35px;
text-align: center; text-align: center;
color: #000; color: #000;
} }
#btn-workspace-add-tab:hover { #btn-workspace-add-tab:hover {
background: #efefef; background: #ddd;
} }

2
locales/en-US/editor.json
View File

@ -154,7 +154,7 @@
}, },
"palette": { "palette": {
"noInfo": "no information available", "noInfo": "no information available",
"filter": "filter", "filter": "filter nodes",
"label": { "label": {
"subflows": "subflows", "subflows": "subflows",
"input": "input", "input": "input",