Apache
/
nifi
mirror of https://github.com/apache/nifi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[NIFI-2053] update open/close palettes. This closes #775

This commit is contained in:
Scott Aslan 2016-08-03 15:31:38 -04:00 committed by Matt Gilman
parent fa4c6ab03c
commit ed5c44ba53
6 changed files with 49 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp
View File

@ -23,17 +23,15 @@
</nf-breadcrumbs>
<div id="graph-controls">
<div id="navigation-control" class="graph-control">
<div class="graph-control-docked pointer" title="Navigate"
<div class="graph-control-docked pointer fa fa-compass" title="Navigate"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.undock($event)">
<div class="graph-control-icon fa fa-compass"></div>
</div>
<div class="graph-control-header-container hidden">
<div class="graph-control-header-icon">
<div class="graph-control-icon fa fa-compass"></div>
<div class="graph-control-header-container hidden pointer"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)">
<div class="graph-control-header-icon fa fa-compass">
</div>
<div class="graph-control-header">Navigate</div>
<div class="graph-control-header-action"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)">
<div class="graph-control-header-action">
<div class="graph-control-expansion fa fa-plus-square-o pointer"></div>
</div>
<div class="clear"></div>
@ -65,17 +63,15 @@
</div>
</div>
<div id="operation-control" class="graph-control">
<div class="graph-control-docked pointer" title="Operate"
<div class="graph-control-docked pointer fa fa-hand-o-up" title="Operate"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.undock($event)">
<div class="graph-control-icon fa fa-hand-o-up"></div>
</div>
<div class="graph-control-header-container hidden">
<div class="graph-control-header-icon">
<div class="graph-control-icon fa fa-hand-o-up"></div>
<div class="graph-control-header-container hidden pointer"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)">
<div class="graph-control-header-icon fa fa-hand-o-up">
</div>
<div class="graph-control-header">Operate</div>
<div class="graph-control-header-action"
ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)">
<div class="graph-control-header-action">
<div class="graph-control-expansion fa fa-plus-square-o pointer"></div>
</div>
<div class="clear"></div>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
View File

@ -37,7 +37,7 @@
#bulletin-board-refresh-container {
position: absolute;
right: 20px;
bottom: 40px;
bottom: 0px;
left: 20px;
}

41
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css
View File

@ -53,9 +53,9 @@
margin-left: -1px;
}
#graph-controls .graph-control-icon {
font-size: 15px;
.graph-control-header-icon.fa {
color: #004849; /*link-color*/
margin-left: 7px !important;
}
div.graph-control {
@ -64,10 +64,28 @@ div.graph-control {
border-top: 1px solid #aabbc3;
border-right: 1px solid #aabbc3;
border-bottom: 1px solid #aabbc3;
padding: 10px;
margin-bottom: 2px;
}
.graph-control-content {
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
}
.docked {
height: 32px;
width: 32px;
}
div.graph-control-docked {
height: 100%;
width: 100%;
text-align: center;
line-height: 34px;
color: #004849;
}
.docked:hover {
border-top: 1px solid #004849; /*tint base-color 60%*/
border-right: 1px solid #004849; /*tint base-color 60%*/
@ -92,12 +110,14 @@ div.graph-control button:disabled {
}
div.graph-control div.graph-control-expansion {
color: #004849; /*link-color*/
color: #728E9B;
line-height: 34px;
margin-left: 9px !important;
}
div.graph-control-header-icon {
float: left;
padding: 0 5px 0 0;
margin: 8px 10px 0px 0px;
}
div.graph-control-header {
@ -106,12 +126,17 @@ div.graph-control-header {
font-family: 'Roboto Slab';
color: #262626;
letter-spacing: 0.05rem;
line-height: 15px;
margin: 10px 0px;
}
div.graph-control-header-action {
float: right;
font-size: 15px;
height: 32px;
width: 32px;
}
.graph-control-header-container:hover {
background: linear-gradient(90deg, rgba(227,232,235,0) 254px, rgba(227,232,235,1) 32px);
}
/* navigate buttons */
@ -210,7 +235,7 @@ div.button-spacer-large {
}
#birdseye {
width: 248px;
width: 264px;
height: 150px;
background: #fff;
z-index: 1001;

5
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/processor-configuration.css
View File

@ -112,10 +112,6 @@ div.relationship-description {
outline: none;
}
#run-duration-labels {
font-family: sans-serif;
}
#run-duration-zero {
float: left;
}
@ -156,7 +152,6 @@ div.relationship-description {
#run-duration-explanation {
margin-top: 5px;
color: #9F6000;
font-size: 9px;
font-weight: bold;
line-height: normal;

11
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/slickgrid/css/slick-default-theme.css
View File

@ -102,20 +102,14 @@ classes should alter those!
border-right: 0px !important;
}
.grid-canvas *:last-child .fa{
float: left;
}
.grid-canvas *:last-child .icon{
float: left;
}
.slick-viewport .fa {
color: #004849;
line-height: 22px;
margin-top: 0px !important;
width: 12px;
height: 12px;
float: left;
margin-right: 3px !important;
}
.slick-viewport .icon {
@ -125,6 +119,7 @@ classes should alter those!
width: 12px;
height: 12px;
float: left;
margin-right: 3px !important;
}
.slick-header.ui-state-default, .slick-headerrow.ui-state-default {

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/controllers/nf-ng-canvas-graph-controls-controller.js
View File

@ -134,7 +134,7 @@ nf.ng.Canvas.GraphControlsCtrl = function (serviceProvider, navigateCtrl, operat
* @param {jQuery} $event
*/
undock: function ($event) {
openGraphControl($($event.target).parent().parent());
openGraphControl($($event.target).parent());
},
/**
@ -143,7 +143,7 @@ nf.ng.Canvas.GraphControlsCtrl = function (serviceProvider, navigateCtrl, operat
*/
expand: function ($event) {
var icon = $($event.target);
if (icon.hasClass('fa-plus-square-o')) {
if (icon.find('.fa-plus-square-o').length > 0 || icon.hasClass('fa-plus-square-o') || icon.parent().children().find('.fa-plus-square-o').length > 0) {
openGraphControl(icon.closest('div.graph-control'));
} else {
hideGraphControl(icon.closest('div.graph-control'));