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

Update header buttons

Browse Source
This commit is contained in:
Nick O'Leary 2014-08-22 11:07:32 +01:00
parent 7a9696526a
commit ec5aaa5bfb
4 changed files with 81 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
public/index.html
View File

@ -30,12 +30,10 @@
<head> <head>
<body spellcheck="false"> <body spellcheck="false">
<div id="header"> <div id="header">
<a class="logo" href="#"><img src="node-red.png"> <span class="red">Node-RED</span> </a> <span class="logo"><img src="node-red.png"> <span>Node-RED</span></span>
<div class="btn-group pull-right"> <div class="pull-right">
<a id="btn-sidemenu" class="btn dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-bars"></i> <i class="fa fa-caret-down"></i></a> <a id="btn-deploy" class="button action-deploy disabled" href="#"><i id="btn-icn-deploy" class="fa fa-download"></i> Deploy</a>
</div> <a id="btn-sidemenu" class="button dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-bars"></i></a>
<div class="btn-group pull-right">
<a id="btn-deploy" class="btn action-deploy disabled" href="#"><i id="btn-icn-deploy" class="fa fa-download"></i> Deploy</a>
</div> </div>
</div> </div>
<div id="main-container" class="sidebar-closed"> <div id="main-container" class="sidebar-closed">

2
public/red/main.js
View File

@ -249,7 +249,7 @@ var RED = (function() {
]}, ]},
null, null,
{id:"btn-keyboard-shortcuts",icon:"fa fa-keyboard-o",label:"Keyboard Shortcuts",onselect:showHelp}, {id:"btn-keyboard-shortcuts",icon:"fa fa-keyboard-o",label:"Keyboard Shortcuts",onselect:showHelp},
{id:"btn-help",icon:"fa fa-question",label:"Help...", href:"http://node-red.github.io/docs"} {id:"btn-help",icon:"fa fa-question",label:"Help...", href:"http://nodered.org/docs"}
] ]
}); });

4
public/red/ui/view.js
View File

@ -1379,9 +1379,9 @@ RED.view = (function() {
function setDirty(d) { function setDirty(d) {
dirty = d; dirty = d;
if (dirty) { if (dirty) {
$("#btn-deploy").removeClass("disabled").addClass("btn-danger"); $("#btn-deploy").removeClass("disabled");
} else { } else {
$("#btn-deploy").addClass("disabled").removeClass("btn-danger"); $("#btn-deploy").addClass("disabled");
} }
} }

94
public/style.css
View File

@ -28,7 +28,7 @@ body {
height: 40px; height: 40px;
background: #000; background: #000;
box-sizing: border-box; box-sizing: border-box;
padding: 5px 20px; padding: 5px 0px 5px 20px;
} }
#dropTarget { #dropTarget {
@ -59,34 +59,66 @@ div.btn-group, a.btn {
user-select: none; user-select: none;
} }
a.logo { span.logo {
pointer-events: none;
float: left; float: left;
font-size: 30px; font-size: 30px;
line-height: 30px; line-height: 30px;
text-decoration: none; text-decoration: none;
color: #999; color: #ccc;
} }
a.logo span { span.logo span {
vertical-align: middle; vertical-align: middle;
font-size: 16px !important; font-size: 16px !important;
} }
a.logo:hover span.red { span.logo img {
color: rgb(197, 112, 112) !important;
}
a.logo:hover {
color: #bbb !important;
}
a.logo img {
height: 18px; height: 18px;
} }
#header .button {
line-height: 22px;
display: inline-block;
font-size: 14px;
padding: 4px 12px;
text-decoration: none;
border-radius: 3px;
color: #ccc;
margin: auto 10px;
vertical-align: middle;
}
#header .button:not(.disabled):hover {
box-shadow: 0 0 2px #fff;
}
#btn-deploy:not(.disabled):hover {
background: #ca3f39;
}
.navbar-fixed-top { #btn-deploy {
position: absolute !important; color: #fff !important;
z-index: 100 !important; background: #d24741;
box-shadow: 0 0 2px #fff;
} }
.navbar-inner > .container-fluid { #btn-deploy:not(.disabled):active {
padding-right: 10px; background: #aa1f19 !important;
color: #ccc !important;
box-shadow: 0 0 2px #999;
} }
#btn-deploy.disabled {
cursor: default;
background: #444 ;
color: #999 !important;
}
#btn-sidemenu {
font-size: 20px !important;
}
#btn-sidemenu:active, #btn-sidemenu.active {
background: #333 ;
}
#header .button:focus {
outline: none;
}
#workspace { #workspace {
margin-left: 160px; margin-left: 160px;
@ -633,6 +665,32 @@ div.node-info {
.hidden { .hidden {
display: none; display: none;
} }
/*
.dropdown-menu {
font-size: 14px;
background: #000;
}
.dropdown-menu .divider {
background: #666;
border-bottom: #666;
}
.dropdown-menu>li>a {
color: #ddd;
}
.dropdown-submenu>ul {
border: 1px solid white;
border-radius: 6px !important;
}
.dropdown-menu li.disabled a {
color: #666;
}
.dropdown-menu li.disabled a:hover {
background: none;
}
*/
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-submenu:hover>a, .dropdown-submenu:focus>a {
background: #999;
}
.dropdown-menu * .fa-check { .dropdown-menu * .fa-check {
display: none; display: none;
@ -660,10 +718,6 @@ div.node-info {
white-space: normal !important; white-space: normal !important;
} }
.navbar-fixed-top, .navbar-fixed-bottom {
z-index: 1000;
}
.popover-title { display: none; } .popover-title { display: none; }
.ui-autocomplete { .ui-autocomplete {