http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp index 881942f..d1208e0 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flow-status.jsp @@ -15,41 +15,24 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="flow-status"> - <div class="flow-status-property-element"> - Active threads: - <span id="active-thread-count" class="flow-status-property-value"></span> +<div id="flow-status" flex layout="row" layout-align="space-between center"> + <div id="flow-status-container" layout="row" layout-align="space-around center"> + <i class="fa fa-cubes" ng-if="appCtrl.nf.Canvas.isClustered()"><span id="connected-nodes-count"></span></i> + <i class="icon icon-threads"><span id="active-thread-count"></span></i> + <i class="fa fa-list"><span id="total-queued"></span></i> + <i class="fa fa-bullseye"><span id="controller-transmitting-count"></span></i> + <i class="icon icon-transmit-false"><span id="controller-not-transmitting-count"></span></i> + <i class="fa fa-play"><span id="controller-running-count"></span></i> + <i class="fa fa-stop"><span id="controller-stopped-count"></span></i> + <i class="fa fa-warning"><span id="controller-invalid-count"></span></i> + <i class="icon icon-enable-false"><span id="controller-disabled-count"></span></i> + <i class="fa fa-refresh"><span id="stats-last-refreshed"></span></i> + <div id="canvas-loading-container" class="loading-container"></div> </div> - <div class="flow-status-property-element"> - Queued: - <span id="total-queued" class="flow-status-property-value"></span> - </div> - <div id="connected-nodes-element" class="flow-status-property-element"> - Connected nodes: - <span id="connected-nodes-count" class="flow-status-property-value"></span> - </div> - <div class="flow-status-property-element"> - Stats last refreshed: - <span id="stats-last-refreshed" class="flow-status-property-value"></span> - </div> - <div id="refresh-required-container" class="flow-status-property-element"> - <div id="refresh-required-icon"></div> - <span id="refresh-required-link" class="link">Refresh</span> - </div> - <div id="controller-bulletins" class="bulletin-icon"></div> - <div id="canvas-loading-container" class="loading-container"></div> - <div id="controller-counts"> - <div class="transmitting"></div> - <div id="controller-transmitting-count" class="controller-component-count">0</div> - <div class="not-transmitting"></div> - <div id="controller-not-transmitting-count" class="controller-component-count">0</div> - <div class="running"></div> - <div id="controller-running-count" class="controller-component-count">-</div> - <div class="stopped"></div> - <div id="controller-stopped-count" class="controller-component-count">-</div> - <div class="invalid"></div> - <div id="controller-invalid-count" class="controller-component-count">-</div> - <div class="disabled"></div> - <div id="controller-disabled-count" class="controller-component-count">-</div> + <div layout="row" layout-align="end center"> + <input id="search-field" type="text"/> + <button id="search-button"><i class="fa fa-search"></i></button> + <button id="bulletin-button"><i class="icon-bulletin"></i></button> </div> </div> +<div id="search-flow-results"></div>
http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flowfile-details-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flowfile-details-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flowfile-details-dialog.jsp index cead866..848c8a6 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flowfile-details-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/flowfile-details-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="flowfile-details-dialog"> +<div id="flowfile-details-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div id="flowfile-details-dialog-content"> <div id="flowfile-details-tabs"></div> <div id="flowfile-details-tabs-content"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/instantiate-template-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/instantiate-template-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/instantiate-template-dialog.jsp index ed76999..f2bf713 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/instantiate-template-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/instantiate-template-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="instantiate-template-dialog"> +<div id="instantiate-template-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div id="available-templates" name="available-templates"></div> </div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/label-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/label-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/label-configuration.jsp index 2f15e99..5efe441 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/label-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/label-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="label-configuration"> +<div id="label-configuration" nf-draggable="{ containment: 'parent', cancel: 'textarea, .button, .combo'}"> <div id="label-configuration-contents"> <div class="setting" style="margin-top: 5px;"> <div class="setting-name">Label Value</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/listing-request-status-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/listing-request-status-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/listing-request-status-dialog.jsp index 3320388..8cbd5a5 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/listing-request-status-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/listing-request-status-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="listing-request-status-dialog"> +<div id="listing-request-status-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-field"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp index 8a545f8..f6190b2 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/navigation.jsp @@ -15,40 +15,138 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<breadcrumbs-directive - breadcrumbs="AppCtrl.ServiceProvider.BreadcrumbsCtrl.getBreadcrumbs();" - click-func="AppCtrl.nf.CanvasUtils.enterGroup" - highlight-crumb-id="AppCtrl.nf.Canvas.getGroupId();" - separator-func="AppCtrl.nf.Common.isDefinedAndNotNull"> -</breadcrumbs-directive> -<div id="pan-and-zoom"> - <div id="graph-control-separator"> </div> - <table class="pan"> - <tr> - <td id="pan-top-left"></td> - <td id="pan-up-button" title="Pan Up" class="pan-up"></td> - <td id="pan-top-right"></td> - </tr> - <tr> - <td id="pan-left-button" title="Pan Left" class="pan-left"></td> - <td id="pan-center"></td> - <td id="pan-right-button" title="Pan Right" class="pan-right"></td> - </tr> - <tr> - <td id="pan-bottom-left"></td> - <td id="pan-down-button" title="Pan Down" class="pan-down"></td> - <td id="pan-bottom-right"></td> - </tr> - </table> - <div id="graph-control-separator"> </div> - <div id="zoom-in-button" title="Zoom In" class="zoom-in"></div> - <div id="zoom-out-button" title="Zoom Out" class="zoom-out"></div> - <div id="graph-control-separator"> </div> - <div id="zoom-fit-button" title="Fit" class="fit-image"></div> - <div id="graph-control-separator"> </div> - <div id="zoom-actual-button" title="Actual Size" class="actual-size"></div> -</div> -<div id="birdseye-collapse" class="birdseye-expanded"></div> -<div id="birdseye-container"> - <div id="birdseye"></div> +<nf-breadcrumbs + breadcrumbs="appCtrl.serviceProvider.breadcrumbsCtrl.getBreadcrumbs();" + click-func="appCtrl.nf.CanvasUtils.enterGroup" + highlight-crumb-id="appCtrl.nf.Canvas.getGroupId();" + separator-func="appCtrl.nf.Common.isDefinedAndNotNull"> +</nf-breadcrumbs> +<div id="graph-controls"> + <div id="navigation-control" class="graph-control"> + <div class="graph-control-docked pointer" title="Navigate" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.undock($event)"> + <i class="graph-control-icon fa fa-compass"></i> + </div> + <div class="graph-control-header-container hidden"> + <div class="graph-control-header-icon"> + <i class="graph-control-icon fa fa-compass"></i> + </div> + <div class="graph-control-header">Navigate</div> + <div class="graph-control-header-action" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)"> + <i class="graph-control-expansion fa fa-plus-square-o pointer"></i> + </div> + <div class="clear"></div> + </div> + <div class="graph-control-content hidden"> + <div id="navigation-buttons"> + <div id="naviagte-zoom-in" class="action-button" title="Zoom In" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.navigateCtrl.zoomIn();"> + <button><i class="graph-control-action-icon fa fa-search-plus"></i></button> + </div> + <div class="button-spacer-small"> </div> + <div id="naviagte-zoom-out" class="action-button" title="Zoom Out" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.navigateCtrl.zoomOut();"> + <button><i class="graph-control-action-icon fa fa-search-minus"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="naviagte-zoom-fit" class="action-button" title="Fit" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.navigateCtrl.zoomFit();"> + <button><i class="graph-control-action-icon icon icon-zoom-fit"></i></button> + </div> + <div class="button-spacer-small"> </div> + <div id="naviagte-zoom-actual-size" class="action-button" title="Actual" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.navigateCtrl.zoomActualSize();"> + <button><i class="graph-control-action-icon icon icon-zoom-actual"></i></button> + </div> + <div class="clear"></div> + </div> + <div id="birdseye"></div> + </div> + </div> + <div id="operation-control" class="graph-control"> + <div class="graph-control-docked pointer" title="Operate" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.undock($event)"> + <i class="graph-control-icon fa fa-hand-o-up"></i> + </div> + <div class="graph-control-header-container hidden"> + <div class="graph-control-header-icon"> + <i class="graph-control-icon fa fa-hand-o-up"></i> + </div> + <div class="graph-control-header">Operate</div> + <div class="graph-control-header-action" + ng-click="appCtrl.serviceProvider.graphControlsCtrl.expand($event)"> + <i class="graph-control-expansion fa fa-plus-square-o pointer"></i> + </div> + <div class="clear"></div> + </div> + <div class="graph-control-content hidden"> + <div id="operation-buttons"> + <div> + <div id="operate-enable" class="action-button" title="Enable"> + <button ng-click="appCtrl.nf.Actions['enable'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty() || !appCtrl.nf.CanvasUtils.canEnable(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon fa fa-flash"></i></button> + </div> + <div class="button-spacer-small"> </div> + <div id="operate-disable" class="action-button" title="Disable"> + <button ng-click="appCtrl.nf.Actions['disable'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty() || !appCtrl.nf.CanvasUtils.canDisable(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon icon icon-enable-false"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="operate-start" class="action-button" title="Start"> + <button ng-click="appCtrl.nf.Actions['start'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="!appCtrl.nf.Common.isDFM();"> + <i class="graph-control-action-icon fa fa-play"></i></button> + </div> + <div class="button-spacer-small"> </div> + <div id="operate-stop" class="action-button" title="Stop"> + <button ng-click="appCtrl.nf.Actions['stop'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="!appCtrl.nf.Common.isDFM();"> + <i class="graph-control-action-icon fa fa-stop"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="operate-template" class="action-button" title="Create Template"> + <button ng-click="appCtrl.nf.Actions['template'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="!appCtrl.nf.Common.isDFM();"> + <i class="graph-control-action-icon icon icon-template"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="operate-copy" class="action-button" title="Copy"> + <button ng-click="appCtrl.nf.Actions['copy'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty() || !appCtrl.nf.CanvasUtils.isCopyable(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon fa fa-copy"></i></button> + </div> + <div class="button-spacer-small"> </div> + <div id="operate-paste" class="action-button" title="Paste"> + <button ng-click="appCtrl.nf.Actions['paste'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="!appCtrl.nf.Clipboard.isCopied() || !appCtrl.nf.CanvasUtils.canModify(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon fa fa-paste"></i></button> + </div> + <div class="clear"></div> + </div> + <div style="margin-top: 5px;"> + <div id="operate-group" class="action-button" title="Group"> + <button ng-click="appCtrl.nf.Actions['group'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty() || !appCtrl.nf.CanvasUtils.isDisconnected(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon icon icon-group"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="operate-color" class="action-button" title="Fill Color"> + <button ng-click="appCtrl.nf.Actions['fillColor'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty() || !appCtrl.nf.CanvasUtils.isColorable(appCtrl.nf.CanvasUtils.getSelection());"> + <i class="graph-control-action-icon fa fa-paint-brush"></i></button> + </div> + <div class="button-spacer-large"> </div> + <div id="operate-delete" class="action-button" title="Delete"> + <button ng-click="appCtrl.nf.Actions['delete'](appCtrl.nf.CanvasUtils.getSelection());" + ng-disabled="appCtrl.nf.CanvasUtils.getSelection().empty();"> + <i class="graph-control-action-icon fa fa-trash"></i><span>Delete</span></button> + </div> + <div class="clear"></div> + </div> + </div> + </div> + </div> </div> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-controller-service-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-controller-service-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-controller-service-dialog.jsp index 9463cb9..f12d085 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-controller-service-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-controller-service-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-controller-service-dialog"> +<div id="new-controller-service-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div id="controller-service-type-filter-controls"> <div id="controller-service-type-filter-container"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-port-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-port-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-port-dialog.jsp index 1f871c0..5646cfe 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-port-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-port-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-port-dialog"> +<div id="new-port-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name"><span id="new-port-type">Input</span> port name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-process-group-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-process-group-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-process-group-dialog.jsp index ac3c3f1..ccaa836 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-process-group-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-process-group-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-process-group-dialog"> +<div id="new-process-group-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">Process group name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-processor-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-processor-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-processor-dialog.jsp index ad33c1c..1fd16ba 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-processor-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-processor-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-processor-dialog"> +<div id="new-processor-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div id="processor-type-filter-controls"> <div id="processor-type-filter-container"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-remote-process-group-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-remote-process-group-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-remote-process-group-dialog.jsp index a479384..7f73572 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-remote-process-group-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-remote-process-group-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-remote-process-group-dialog"> +<div id="new-remote-process-group-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">URL</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-reporting-task-dialog.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-reporting-task-dialog.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-reporting-task-dialog.jsp index 2025aeb..d5621c2 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-reporting-task-dialog.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/new-reporting-task-dialog.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="new-reporting-task-dialog"> +<div id="new-reporting-task-dialog" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div id="reporting-task-type-filter-controls"> <div id="controller-service-type-filter-container"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-configuration.jsp index 89766ef..0c90ac7 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="port-configuration"> +<div id="port-configuration" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="port-setting"> <div class="setting-name">Port name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-details.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-details.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-details.jsp index 7d179e0..8b0028f 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-details.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/port-details.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="port-details"> +<div id="port-details" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="port-setting"> <div class="setting-name">Port name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-configuration.jsp index 0140000..55bf745 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="process-group-configuration"> +<div id="process-group-configuration" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">Name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-details.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-details.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-details.jsp index 6aed45e..534e8d6 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-details.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/process-group-details.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="process-group-details"> +<div id="process-group-details" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">Name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/processor-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/processor-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/processor-configuration.jsp index 0363f72..3d24e5a 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/processor-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/processor-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="processor-configuration"> +<div id="processor-configuration" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="processor-configuration-tab-container"> <div id="processor-configuration-tabs"></div> <div id="processor-configuration-tabs-content"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-configuration.jsp index 57a5612..8995dbe 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="remote-process-group-configuration"> +<div id="remote-process-group-configuration" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">Name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-details.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-details.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-details.jsp index 8b2adde..b74fab4 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-details.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-details.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="remote-process-group-details"> +<div id="remote-process-group-details" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <div class="setting"> <div class="setting-name">Name</div> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-ports.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-ports.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-ports.jsp index e9b4734..b77e2e3 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-ports.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/remote-process-group-ports.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="remote-process-group-ports"> +<div id="remote-process-group-ports" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="dialog-content"> <span id="remote-process-group-ports-id" class="hidden"></span> <div class="settings-left"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/reporting-task-configuration.jsp ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/reporting-task-configuration.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/reporting-task-configuration.jsp index 8d3e84d..42b1d0d 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/reporting-task-configuration.jsp +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/canvas/reporting-task-configuration.jsp @@ -15,7 +15,7 @@ limitations under the License. --%> <%@ page contentType="text/html" pageEncoding="UTF-8" session="false" %> -<div id="reporting-task-configuration"> +<div id="reporting-task-configuration" nf-draggable="{containment: 'parent', handle: '.dialog-header'}"> <div class="reporting-task-configuration-tab-container"> <div id="reporting-task-configuration-tabs"></div> <div id="reporting-task-configuration-tabs-content"> http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/banner.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/banner.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/banner.css index c613781..be5dbe3 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/banner.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/banner.css @@ -19,21 +19,17 @@ */ div.main-banner-header { + display: none; z-index: 100; - font-weight: bold; - font-size: 1em; + font-weight: 300; + font-size: 10px; text-align: center; - line-height: 15px; - color: #7e7e7e; + line-height: 12px; margin: 0px auto; - width: 900px; - height: 17px; - background-color: #fff; + height: 10px; + background-color: #AABBC3; z-index: 100; -} - -div.banner-header-background { - background-image: url(../images/bgHeader.png); + overflow: hidden; } div.main-banner-footer { @@ -42,17 +38,13 @@ div.main-banner-footer { left: 0px; right: 0px; bottom: 0px; - height: 15px; - color: #fff; + height: 10px; text-align: center; - font-weight: bold; - font-size: 1em; - line-height: 15px; + font-weight: 300; + font-size: 10px; + line-height: 9px; overflow: visible; - background-color: #9eb9c7; - background-image: url(../images/bgBannerFoot.png); - background-repeat: repeat-x; - background-position: left top; + background-color: rgba(249,250,251,0.97); } div.utility-banner-header { http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/canvas.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/canvas.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/canvas.css index 1a4eb66..f7ddc84 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/canvas.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/canvas.css @@ -43,4 +43,6 @@ @import url(settings.css); @import url(about.css); @import url(message-pane.css); -@import url(status-history.css); \ No newline at end of file +@import url(status-history.css); +@import url(../fonts/flowfont/flowfont.css); +@import url(../assets/font-awesome/css/font-awesome.css); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css index 22a4006..6ce3538 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/flow-status.css @@ -17,41 +17,70 @@ /* flow status styles positioned at the top of the graph */ #flow-status { - position: absolute; - top: 94px; - left: 0px; - right: 0px; - height: 13px; - padding: 7px 8px 3px 40px; - background: #e3ebee url(../images/bgStatusPanel.png) repeat-x scroll top left; - color: #598599; - z-index: 2; + height: 32px; + background-color:#E3E8EB; /*tint base-color 60%*/ } -div.flow-status-property-element { - float: left; - margin-left: 25px; - font-size: 10px; +#flow-status .icon { + font-size:15px; + font-style: normal; + color: #728E9B; /*base-color*/ } -span.flow-status-property-value { - font-weight: bold; - font-size: 10px; - color: #000; +#flow-status .fa { + font-size:15px; + font-style: normal; + color: #728E9B; /*base-color*/ } -#connected-nodes-element { - display: none; +#flow-status .icon span{ + font-size:15px; + font-weight: 500; + color: #775351; /*value-color*/ } -#controller-bulletins { - margin-top: -1px; - margin-left: 9px; - float: left; - width: 12px; - height: 12px; - background-color: transparent; - display: none; +#flow-status .fa span{ + font-size:15px; + font-weight: 500; + color: #775351; /*value-color*/ + font-family: Roboto, sans-serif; +} + +#flow-status button{ + height: 32px; + width:32px; + border-left:1px solid #AABBC3; /*tint base-color 40%*/ + border-right: none; + border-top: none; + border-bottom: none; +} + +#flow-status span{ + padding-left: 5px; +} + +#search-button { + background-color:#E3E8EB; /*tint base-color 80%*/ +} + +#search-button i{ + color: #004849; + font-size:15px; +} + +#search-button:hover { + background-color:#FFFFFF; + border-left:1px solid #004849; /*link-color*/ + box-shadow:0 2px 2px rgba(0,0,0,0.25); +} + +#bulletin-button { + background-color:#728E9B; /*base-color*/ +} + +#bulletin-button i{ + color: #fff; + font-size:15px; } #canvas-loading-container { @@ -63,48 +92,76 @@ span.flow-status-property-value { background-color: transparent; } -span.alert { - color: #c00; +/* search field */ +div.search-result-icon { + float: left; + margin-right: 5px; + width: 14px; + height: 14px; } -#refresh-required-container { - display: none; - float: left; - margin-left: 10px; - font-size: 10px; +#search-field { + height: 32px; + width: 200px; + background: #FFFFFF; + border: 0px solid #AABBC3; + position: relative; + left: 32px; } -#refresh-required-icon { - float: left; - margin-top: -2px; - margin-right: 10px; - width: 18px; - height: 16px; - background-image: url(../images/iconAlert.png); +input.search-flow { + color: #7098AD; } -#refresh-required-container span.link { - cursor: pointer; - color: #1e373f; - text-decoration: underline; - font-weight: bold; +#search-flow-results .ui-autocomplete { + max-height: 400px; + overflow: auto; + border: 1px solid #aaaaaa; + z-index: 1251; + border-radius: 0; +} + +#search-flow-results .ui-menu .ui-menu-item a.ui-state-focus { + background: #D4E0E5 !important; + border: 1px solid #999999; + border-radius: 0; } -#refresh-required-container span.header-link-over { - color: #264c58; - text-decoration: underline; +#search-flow-results li.search-header { font-weight: bold; + padding-top: 4px; + padding-left: 4px; + padding-right: 4px; + height: 14px; } -#controller-counts { - float: right; - margin-right: 195px; - margin-top: -3px; +#search-flow-results div.search-match-header { + font-weight: normal; + margin-left: 19px; } -div.controller-component-count { +#search-flow-results div.search-match { + margin-left: 26px; + color: #888; + font-size: 10px; + line-height: 1.4em; +} + +#search-flow-results li.search-no-matches { + padding: 4px; font-weight: bold; - color: #000; - margin: 3px 10px 3px 2px; - float: left; + color: #aaa; + font-style: italic; +} + +div.search-glass-pane { + position: absolute; + background-image: url(../images/spacer.png); + background-repeat: repeat; + background-color: transparent; + left: 0px; + top: 0px; + right: 0px; + bottom: 0px; + z-index: 1000; } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css index 8718d27..605a28c 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/graph.css @@ -20,12 +20,12 @@ #canvas-container { position: absolute; - overflow: hidden; - top: 117px; + top: 88px; left: 0px; bottom: 0px; right: 0px; - background: transparent url(../images/grid.gif) repeat scroll 0 0; + background-size: 14px 14px; + background-image: linear-gradient(to right, rgba(229, 235, 237, 1) 1px, transparent 1px), linear-gradient(to bottom, rgba(229, 235, 237, 1) 1px, transparent 1px); z-index: 1; } http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css index 0dd10d7..f95f78c 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/header.css @@ -14,642 +14,161 @@ * See the License for the specific language governing permissions and * limitations under the License. */ + /* Header Settings */ -#header { - position: absolute; - white-space:nowrap; - overflow: visible; - top: 17px; - left: 0px; - height: 47px; - right: 0px; - background-color: #FFF; - color: #000; - font-size: 1.3em; - font-weight: bold; - z-index: 99; -} - -#nf-logo { - float: left; - width: 61px; - height: 90px; - background-image: url(../images/bgNifiLogo.png); - margin-top: -16px; -} - -#nf-logo-name { - float: left; - width: 410px; - height: 47px; - background-image: url(../images/bgNifiToolbar.png); - z-index: 2; -} - -/* styles for the toolbox */ - -#toolbox-container { - position: absolute; - bottom: 0px; - left: 135px; - height: 34px; - z-index: 3; -} - -#toolbox-right-edge { - float: left; - background-image: url(../images/bgNifiToolbarEdge.png); - height: 47px; - width: 13px; - margin-top: -13px; -} - -#toolbox { - float: left; - height: 34px; - padding-top: 1px; -} - -div.toolbox-icon { - width: 32px; - height: 32px; - margin-right: 5px; - margin-left: 5px; - float: left; -} - -div.toolbox-drag-icon { - width: 32px; - height: 32px; -} - -div.processor-icon-disable { - background: transparent url(../images/toolboxIconProcessor.png) no-repeat scroll 0 0; -} - -div.processor-icon { - background: transparent url(../images/toolboxIconProcessor.png) no-repeat scroll -32px 0; -} - -div.processor-icon-hover { - background: transparent url(../images/toolboxIconProcessor.png) no-repeat scroll -64px 0; -} - -div.processor-icon-drag { - background: transparent url(../images/toolboxIconProcessor.png) no-repeat scroll -96px 0; -} - -div.input-port-icon-disable { - background: transparent url(../images/toolboxIconInputPort.png) no-repeat scroll 0 0; -} - -div.input-port-icon { - background: transparent url(../images/toolboxIconInputPort.png) no-repeat scroll -32px 0; -} +md-toolbar.md-small { + height: 56px; + background-color:#AABBC3; /*tint base-color 40%*/ + min-height: 56px; + max-height: 56px; } +md-toolbar.md-small .md-toolbar-tools { + height: 56px; + min-height: 56px; + max-height: 56px; } -div.input-port-icon-hover { - background: transparent url(../images/toolboxIconInputPort.png) no-repeat scroll -64px 0; +#header .icon { + font-size:30px; + color: #004849; } -div.input-port-icon-drag { - background: transparent url(../images/toolboxIconInputPort.png) no-repeat scroll -96px 0; +#header .fa { + font-size:30px; + color: #004849; } -div.output-port-icon-disable { - background: transparent url(../images/toolboxIconOutputPort.png) no-repeat scroll 0 0; +#login-link-container > span.link { + font-size: 12px; + text-transform:uppercase; } -div.output-port-icon { - background: transparent url(../images/toolboxIconOutputPort.png) no-repeat scroll -32px 0; +#logout-link-container > span.link { + font-size: 12px; + text-transform:uppercase; } -div.output-port-icon-hover { - background: transparent url(../images/toolboxIconOutputPort.png) no-repeat scroll -64px 0; -} - -div.output-port-icon-drag { - background: transparent url(../images/toolboxIconOutputPort.png) no-repeat scroll -96px 0; -} - -div.process-group-icon-disable { - background: transparent url(../images/toolboxIconProcessGroup.png) no-repeat scroll 0 0; -} - -div.process-group-icon { - background: transparent url(../images/toolboxIconProcessGroup.png) no-repeat scroll -32px 0; -} - -div.process-group-icon-hover { - background: transparent url(../images/toolboxIconProcessGroup.png) no-repeat scroll -64px 0; -} - -div.process-group-icon-drag { - background: transparent url(../images/toolboxIconProcessGroup.png) no-repeat scroll -96px 0; -} - -div.remote-process-group-icon-disable { - background: transparent url(../images/toolboxIconRemoteProcessGroup.png) no-repeat scroll 0 0; -} - -div.remote-process-group-icon { - background: transparent url(../images/toolboxIconRemoteProcessGroup.png) no-repeat scroll -32px 0; -} - -div.remote-process-group-icon-hover { - background: transparent url(../images/toolboxIconRemoteProcessGroup.png) no-repeat scroll -64px 0; -} - -div.remote-process-group-icon-drag { - background: transparent url(../images/toolboxIconRemoteProcessGroup.png) no-repeat scroll -96px 0; -} - -div.funnel-icon-disable { - background: transparent url(../images/toolboxIconFunnel.png) no-repeat scroll 0 0; -} - -div.funnel-icon { - background: transparent url(../images/toolboxIconFunnel.png) no-repeat scroll -32px 0; -} - -div.funnel-icon-hover { - background: transparent url(../images/toolboxIconFunnel.png) no-repeat scroll -64px 0; -} - -div.funnel-icon-drag { - background: transparent url(../images/toolboxIconFunnel.png) no-repeat scroll -96px 0; -} - -div.template-icon-disable { - background: transparent url(../images/toolboxIconTemplate.png) no-repeat scroll 0 0; -} - -div.template-icon { - background: transparent url(../images/toolboxIconTemplate.png) no-repeat scroll -32px 0; -} - -div.template-icon-hover { - background: transparent url(../images/toolboxIconTemplate.png) no-repeat scroll -64px 0; -} - -div.template-icon-drag { - background: transparent url(../images/toolboxIconTemplate.png) no-repeat scroll -96px 0; -} - -div.label-icon-disable { - background: transparent url(../images/toolboxIconLabel.png) no-repeat scroll 0 0; -} - -div.label-icon { - background: transparent url(../images/toolboxIconLabel.png) no-repeat scroll -32px 0; +#current-user { + font-size: 12px; } -div.label-icon-hover { - background: transparent url(../images/toolboxIconLabel.png) no-repeat scroll -64px 0; +#nifi-logo { + height: 37px; + margin: 0 20px 0 15px; } -div.label-icon-drag { - background: transparent url(../images/toolboxIconLabel.png) no-repeat scroll -96px 0; +#global-menu-button { + background-color:#AABBC3; /*tint base-color 40%*/ + border:1px solid #AABBC3; /*tint base-color 40%*/ + border-top-left-radius:2px; + border-top-right-radius:2px; + margin:0 10px; + cursor: pointer; } -#status-and-toolbar-container { - overflow: hidden; - height: 55px; - margin-top: 15px; +#global-menu-button:hover { + background-color:#C7D2D7; /*tint base-color 60%*/ + box-shadow:0 1px 1px rgba(0,0,0,0.15); } -/* toolbar styles */ - -#toolbar { - position: absolute; - bottom: 0px; - left: 471px; - right: 0px; - height: 27px; - background-image: url(../images/toolbarBg.gif); - background-repeat: repeat-x; - border-bottom: 1px solid #7098ad; - z-index: 1; +#global-menu-content { + font-size: 13px; + padding: 3px 0; + background-color:rgba(249,250,251,0.97); /*tint base-color 96%*/ + border:1px solid #004849; /*link-color*/ + border-radius:2px; + box-shadow:0 2px 3px rgba(0,0,0,0.35); + width: 215px; } -#toolbar-filler { - position: absolute; - bottom: 0px; - right: 0px; +#global-menu-content md-menu-item{ + min-height: 28px; height: 28px; } -/* global actions / controls */ - -div.toolbar-icon { - float: left; - height: 26px; - width: 20px; -} - -#global-controls-container { - float: left; -} - -div.control-border { - float: left; - height: 26px; - width: 1px; - background: transparent url(../images/bgToolbarBtnBorder.png) no-repeat scroll top left; -} - -div.control-separator { - float: left; - height: 26px; - width: 5px; -} - -#global-controls { - float: left; - margin-top: 1px; - margin-left: 20px; -} - -div.enable-all { - background: transparent url(../images/buttonEnable.png) no-repeat scroll top left; -} - -div.enable-all-hover { - background: transparent url(../images/buttonEnable.png) no-repeat scroll top center; -} - -div.enable-all-disable { - background: transparent url(../images/buttonEnable.png) no-repeat scroll top right; -} - -div.disable-all { - background: transparent url(../images/buttonDisable.png) no-repeat scroll top left; -} - -div.disable-all-hover { - background: transparent url(../images/buttonDisable.png) no-repeat scroll top center; -} - -div.disable-all-disable { - background: transparent url(../images/buttonDisable.png) no-repeat scroll top right; -} - -div.start-all { - background: transparent url(../images/buttonRun.png) no-repeat scroll top left; -} - -div.start-all-hover { - background: transparent url(../images/buttonRun.png) no-repeat scroll top center; -} - -div.start-all-disable { - background: transparent url(../images/buttonRun.png) no-repeat scroll top right; -} - -div.stop-all { - background: transparent url(../images/buttonStop.png) no-repeat scroll top left; -} - -div.stop-all-hover { - background: transparent url(../images/buttonStop.png) no-repeat scroll top center; -} - -div.stop-all-disable { - background: transparent url(../images/buttonStop.png) no-repeat scroll top right; -} - -div.copy { - background: transparent url(../images/buttonCopy.png) no-repeat scroll top left; -} - -div.copy-hover { - background: transparent url(../images/buttonCopy.png) no-repeat scroll top center; -} - -div.copy-disable { - background: transparent url(../images/buttonCopy.png) no-repeat scroll top right; -} - -div.paste { - background: transparent url(../images/buttonPaste.png) no-repeat scroll top left; -} - -div.paste-hover { - background: transparent url(../images/buttonPaste.png) no-repeat scroll top center; -} - -div.paste-disable { - background: transparent url(../images/buttonPaste.png) no-repeat scroll top right; -} - -div.fill { - background: transparent url(../images/buttonColor.png) no-repeat scroll top left; -} - -div.fill-hover { - background: transparent url(../images/buttonColor.png) no-repeat scroll top center; -} - -div.fill-disable { - background: transparent url(../images/buttonColor.png) no-repeat scroll top right; -} - -div.group { - background: transparent url(../images/buttonGroup.png) no-repeat scroll top left; -} - -div.group-hover { - background: transparent url(../images/buttonGroup.png) no-repeat scroll top center; -} - -div.group-disable { - background: transparent url(../images/buttonGroup.png) no-repeat scroll top right; -} - -div.delete { - background: transparent url(../images/buttonDelete.png) no-repeat scroll top left; -} - -div.delete-hover { - background: transparent url(../images/buttonDelete.png) no-repeat scroll top center; -} - -div.delete-disable { - background: transparent url(../images/buttonDelete.png) no-repeat scroll top right; -} - -div.template { - background: transparent url(../images/buttonTemplate.png) no-repeat scroll top left; -} - -div.template-hover { - background: transparent url(../images/buttonTemplate.png) no-repeat scroll top center; -} - -div.template-disable { - background: transparent url(../images/buttonTemplate.png) no-repeat scroll top right; -} - -/* search field */ - -div.search-result-icon { - float: left; - margin-right: 5px; - width: 14px; - height: 14px; -} - -div.process-group-small-icon { - background-image: url(../images/iconSmallProcessGroup.png); -} - -div.processor-small-icon { - background-image: url(../images/iconSmallProcessor.png); -} - -div.connection-small-icon { - background-image: url(../images/iconSmallRelationship.png); -} - -div.remote-process-group-small-icon { - background-image: url(../images/iconSmallRemoteProcessGroup.png); -} - -div.input-port-small-icon { - background-image: url(../images/iconSmallInputPort.png); +#global-menu-content md-menu-divider{ + background-color:#C7D2D7; /*tint base-color 60%*/ + margin-top: 3px; + margin-bottom: 3px; } -div.output-port-small-icon { - background-image: url(../images/iconSmallOutputPort.png); +#global-menu-content a{ + height: 28px; + padding: 6px 16px; + cursor: pointer; + padding-left: 10px; + padding-right: 10px; } -div.funnel-small-icon { - background-image: url(../images/iconSmallFunnel.png); +#global-menu-content a:hover{ + background-color:#C7D2D7; } -#search-container { - float: right; - font-weight: normal; - color: #fff; +#global-menu-content .icon { + font-size: 15px; + color: #728E9B; margin-right: 10px; - width: 20%; -} - -#search-field { - font-size: 11px; - margin-top: 3px; - border-width: 0px; - width: 95%; - background: #fff url(../images/bgSearchInput.png) repeat-x scroll top left; - z-index: 1000; - position: relative; } -input.search-flow { - color: #7098AD; -} - -#search-flow-results .ui-autocomplete { - max-height: 400px; - overflow: auto; - border: 1px solid #aaaaaa; - z-index: 1251; - border-radius: 0; +#global-menu-content .fa { + font-size: 15px; + color: #728E9B; + margin-right: 10px; } -#search-flow-results .ui-menu .ui-menu-item a.ui-state-focus { - background: #D4E0E5 !important; - border: 1px solid #999999; - border-radius: 0; -} +/* styles for the toolbox */ -#search-flow-results li.search-header { - font-weight: bold; - padding-top: 4px; - padding-left: 4px; - padding-right: 4px; - height: 14px; -} -#search-flow-results div.search-match-header { - font-weight: normal; - margin-left: 19px; +#header .component-button { + background-color:#AABBC3; /*tint base-color 40%*/ + border-radius:2px; + border: none; } -#search-flow-results div.search-match { - margin-left: 26px; - color: #888; - font-size: 10px; - line-height: 1.4em; +#header .component-button:hover { + background-color:#C7D2D7; /*tint base-color 60%*/ + box-shadow:0 1px 1px rgba(0,0,0,0.15); + cursor:grab; + cursor:-moz-grab; + cursor:-webkit-grab; } -#search-flow-results li.search-no-matches { - padding: 4px; - font-weight: bold; - color: #aaa; - font-style: italic; +#header .component-button:disabled { + background-color:#AABBC3; /*tint base-color 40%*/ + cursor:not-allowed; + box-shadow:none; } -div.search-glass-pane { - position: absolute; - background-image: url(../images/spacer.png); - background-repeat: repeat; - background-color: transparent; - left: 0px; - top: 0px; - right: 0px; - bottom: 0px; - z-index: 1000; +#header .component-button:disabled .icon{ + color:#669192; } /* styles for the status link */ #anonymous-user-alert { - float: left; - margin-top: -2px; - margin-right: 6px; - width: 18px; - height: 16px; - background-image: url(../images/iconAlert.png); + font-size: 12px; } #current-user { - float: left; - margin-right: 8px; - font-weight: bold; + font-family: 'Roboto+Slab'; + font-style: normal; + font-weight: normal; + font-size: 12px; max-width: 250px; text-overflow: ellipsis; line-height: normal; overflow: hidden; + white-space: nowrap; + color: #262626; } -#utilities-container { - float: right; -} - -#utilities-border { - float: left; - width: 42px; - height: 47px; - margin-top: -19px; - background: transparent url(../images/bgControlsInset.png) no-repeat scroll top left; - z-index: 99; -} - -#utility-buttons { - background-color: #80a0b5; - border-top: 1px solid #fff; - float: left; - margin-left: -28px; +#current-user-container .fa{ + font-size: 12px; + color: #262626; padding-right: 5px; } -div.utility-button { - width: 26px; - height: 26px; - float: left; -} - -div.reporting-link { - background: transparent url(../images/iconReporting.png) no-repeat scroll top left; -} - -div.reporting-link-hover { - background: transparent url(../images/iconReporting.png) no-repeat scroll top center; - cursor: pointer; -} - -div.counters-link { - background: transparent url(../images/iconCounter.png) no-repeat scroll top left; -} - -div.counters-link-hover { - background: transparent url(../images/iconCounter.png) no-repeat scroll top center; - cursor: pointer; -} - -div.flow-settings-link { - background: transparent url(../images/iconFlowSettings.png) no-repeat scroll top left; -} - -div.flow-settings-link-hover { - background: transparent url(../images/iconFlowSettings.png) no-repeat scroll top center; - cursor: pointer; -} - -div.flow-settings-link-disabled { - background: transparent url(../images/iconFlowSettings.png) no-repeat scroll top right; -} - -div.templates-link { - background: transparent url(../images/iconTemplates.png) no-repeat scroll top left; -} - -div.templates-link-hover { - background: transparent url(../images/iconTemplates.png) no-repeat scroll top center; - cursor: pointer; -} - -div.templates-link-disabled { - background: transparent url(../images/iconTemplates.png) no-repeat scroll top right; -} - -div.history-link { - background: transparent url(../images/iconHistory.png) no-repeat scroll top left; -} - -div.history-link-hover { - background: transparent url(../images/iconHistory.png) no-repeat scroll top center; - cursor: pointer; -} - -div.history-link-disabled { - background: transparent url(../images/iconHistory.png) no-repeat scroll top right; -} - -div.provenance-link { - background: transparent url(../images/iconProvenance.png) no-repeat scroll top left; -} - -div.provenance-link-hover { - background: transparent url(../images/iconProvenance.png) no-repeat scroll top center; - cursor: pointer; -} - -div.provenance-link-disabled { - background: transparent url(../images/iconProvenance.png) no-repeat scroll top right; -} - -div.cluster-link { - background: transparent url(../images/iconCluster.png) no-repeat scroll top left; -} - -div.cluster-link-hover { - background: transparent url(../images/iconCluster.png) no-repeat scroll top center; - cursor: pointer; -} - -div.cluster-link-disabled { - background: transparent url(../images/iconCluster.png) no-repeat scroll top right; -} - -div.bulletin-board-link { - background: transparent url(../images/iconBulletinBoard.png) no-repeat scroll top left; -} - -div.bulletin-board-hover { - background: transparent url(../images/iconBulletinBoard.png) no-repeat scroll top center; - cursor: pointer; -} - -#header-links-container { - position: absolute; - right: 10px; - z-index: 100; -} - #has-pending-accounts { background-image: url(../images/starburst.png); width: 9px; @@ -657,16 +176,4 @@ div.bulletin-board-hover { margin-top: 2px; margin-left: 13px; background-color: transparent; -} - -a.header-link:link, a.header-link:visited, a.header-link:active { - color: #1e373f; - text-decoration: none; - outline: none; -} - -a.header-link:hover { - color: #264c58; - text-decoration: underline; - outline: none; -} +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css index f9556d7..4488d62 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/main.css @@ -86,11 +86,22 @@ url('../fonts/Roboto_Slab/RobotoSlab-Bold.ttf') format('truetype'); } +/*remove margin from font awesome*/ +i[class^="fa-"]:before, i[class*=" fa-"]:before { + margin: -1px; +} + +/*remove margin from flowfont*/ +i[class^="icon-"]:before, i[class*=" icon-"]:before { + margin: -1px; +} + body { display: block; font-family: Roboto, sans-serif; font-size: 62.5%; overflow: hidden; + color: #262626; } #splash { @@ -417,4 +428,20 @@ span.details-title { font-weight: bold; font-size: 12px; text-decoration: underline; +} + +/* angular material override */ + +button:focus { + outline: none; + border: 0; +} + +div:focus { + outline: none; + border: 0; +} + +input:focus { + outline: none; } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css index 204a4f8..d80ff15 100644 --- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/navigation.css @@ -16,130 +16,168 @@ */ /* styles for the graph pan/zoom controls */ -#pan-and-zoom { +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +/* general graph control styles */ + +#graph-controls { position: absolute; - top: 94px; - width: 59px; - height: 153px; - padding-right: 4px; - padding-bottom: 4px; - z-index: 1000; - background: transparent url(../images/bgPanZoom.png) no-repeat scroll top left; + left: 0; + z-index: 2; } -table.pan { - float: left; - clear: left; - border-collapse: collapse; - padding: 0; - margin: 0; - margin-left: 6px; +#graph-controls .icon { + font-size: 12px; } -#pan-up-button, #pan-down-button { - height: 12px; - width: 18px; - cursor: pointer; - z-index: inherit; +#graph-controls .fa { + font-size: 12px; } -#pan-left-button, #pan-right-button { - width: 14px; - height: 16px; - cursor: pointer; - z-index: inherit; +#graph-controls .graph-control-icon { + font-size: 15px; + color: #004849; /*link-color*/ } -#pan-center { - width: 18px; - height: 16px; - background: transparent url(../images/bgPanCenter.png) no-repeat scroll center center; +div.graph-control { + background-color: rgba(249, 250, 251, 0.97); /*tint base-color 96%*/ + border-top: 1px solid #C7D2D7; /*tint base-color 60%*/ + border-right: 1px solid #C7D2D7; /*tint base-color 60%*/ + border-bottom: 1px solid #C7D2D7; /*tint base-color 60%*/ + border-top-right-radius: 2px; + border-bottom-right-radius: 2px; + padding: 10px; + margin-bottom: 2px; } -#pan-top-right, #pan-top-left, #pan-bottom-right, #pan-bottom-left { - background-color: transparent; +.docked:hover { + border-top: 1px solid #004849; /*tint base-color 60%*/ + border-right: 1px solid #004849; /*tint base-color 60%*/ + border-bottom: 1px solid #004849; /*tint base-color 60%*/ } -td.pan-up { - background: transparent url(../images/buttonPanUp.png) no-repeat scroll top left; +div.graph-control button { + height: 24px; + width: 24px; + border-radius: 2px; + border: 1px solid #CCDADB; /*tint link-color 80%*/ + background-color: rgba(249, 250, 251, 0.97); + color: #004849; } -td.pan-up-hover { - background: transparent url(../images/buttonPanUp.png) no-repeat scroll top right; +div.graph-control button:hover { + border: 1px solid #004849; /*link-color*/ } -td.pan-down { - background: transparent url(../images/buttonPanDown.png) no-repeat scroll top left; +div.graph-control button:disabled { + color: #CCDADB; /*tint link-color 80%*/ + cursor: not-allowed; + border: 1px solid #CCDADB; /*tint link-color 80%*/ } -td.pan-down-hover { - background: transparent url(../images/buttonPanDown.png) no-repeat scroll top right; +div.graph-control i.graph-control-expansion { + color: #004849; /*link-color*/ } -td.pan-left { - background: transparent url(../images/buttonPanLeft.png) no-repeat scroll top left; +div.graph-control-header-icon { + float: left; + padding: 0 5px 0 0; } -td.pan-left-hover { - background: transparent url(../images/buttonPanLeft.png) no-repeat scroll top right; +div.graph-control-header { + float: left; + font-size: 12px; + font-family: 'Roboto+Slab'; + color: #262626; + letter-spacing: 0.05rem; + line-height: 15px; } -td.pan-right { - background: transparent url(../images/buttonPanRight.png) no-repeat scroll top left; +div.graph-control-header-action { + float: right; + font-size: 15px; } -td.pan-right-hover { - background: transparent url(../images/buttonPanRight.png) no-repeat scroll top right; +/* navigate buttons */ + +#navigation-buttons { + margin-bottom: 5px; + margin-top: 10px; } -div.zoom-in { - background: transparent url(../images/buttonZoomIn.png) no-repeat scroll top left; +#operation-buttons { + margin-top: 10px; } -div.zoom-in-hover { - background: transparent url(../images/buttonZoomIn.png) no-repeat scroll top right; +div.action-button { + float: left; } -div.zoom-out { - background: transparent url(../images/buttonZoomOut.png) no-repeat scroll top left; +#operate-delete button { + width: inherit; + padding: 0 7px; } -div.zoom-out-hover { - background: transparent url(../images/buttonZoomOut.png) no-repeat scroll top right; +#operate-delete button span{ + padding-left: 5px; + font-size: 12px; + text-transform:uppercase; + } + +div.graph-control i.icon-disabled { + color: #ddd; } -div.fit-image { - background: transparent url(../images/buttonZoomFit.png) no-repeat scroll top left; +div.button-spacer-small { + float: left; + width: 2px; } -div.fit-image-hover { - background: transparent url(../images/buttonZoomFit.png) no-repeat scroll top right; +div.button-spacer-large { + float: left; + width: 12px; } -div.actual-size { - background: transparent url(../images/buttonZoom100.png) no-repeat scroll top left; +/* outline/birdseye */ + +#birdseye svg, #birdseye canvas { + position: absolute; + overflow: hidden; } -div.actual-size-hover { - background: transparent url(../images/buttonZoom100.png) no-repeat scroll top right; +#birdseye { + width: 248px; + height: 150px; + background: #fff; + z-index: 1001; + overflow: hidden; + border: 1px solid #e5ebed; } -#zoom-in-button, #zoom-out-button, #zoom-fit-button, #zoom-actual-button { - float: left; - clear: left; - margin-left: 20px; - height: 16px; - width: 18px; - cursor: pointer; - z-index: inherit; +.brush .extent { + stroke: #666; + fill-opacity: .125; + shape-rendering: crispEdges; } -#graph-control-separator { - float: left; - clear: left; - height: 8px; - -webkit-user-select: none; - -moz-user-select: none; +rect.birdseye-brush { + stroke: #7098ad; + fill: transparent; } /* styles for the breadcrumbs bar */ @@ -147,14 +185,24 @@ div.actual-size-hover { #breadcrumbs { position: absolute; bottom: 0px; - background-color:rgba(249,250,251,0.97); /*tint base-color 96%*/ - border-top:1px solid #C7D2D7; /*tint base-color 60%*/ + background-color: rgba(249, 250, 251, 0.97); /*tint base-color 96%*/ + border-top: 1px solid #C7D2D7; /*tint base-color 60%*/ color: #598599; z-index: 2; - height:31px; + height: 31px; width: 100%; } +#cluster-indicator { + width: 49px; + height: 15px; + background-color: transparent; + display: none; + position: absolute; + left: 59px; + top: 8px; +} + #breadcrumbs-left-border { position: absolute; left: 0; @@ -162,7 +210,7 @@ div.actual-size-hover { height: 14px; z-index: 3; background-color: transparent; - background: linear-gradient(to right, rgba(249,250,251,0.97), rgba(255, 255, 255, 0)); + background: linear-gradient(to right, rgba(249, 250, 251, 0.97), rgba(255, 255, 255, 0)); filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1, startColorstr=#ffffffff, endColorstr=#00ffffff); } @@ -173,7 +221,7 @@ div.actual-size-hover { height: 14px; z-index: 3; background-color: transparent; - background: linear-gradient(to left, rgba(249,250,251,0.97), rgba(255, 255, 255, 0)); + background: linear-gradient(to left, rgba(249, 250, 251, 0.97), rgba(255, 255, 255, 0)); filter: progid:DXImageTransform.Microsoft.gradient(gradientType=1, startColorstr=#00ffffff, endColorstr=#ffffffff); } @@ -193,75 +241,4 @@ div.actual-size-hover { float: left; white-space: nowrap; line-height: normal; -} - -/* styles for the outline */ - -#birdseye-container { - position: absolute; - top: 94px; - right: 0px; - width: 202px; - height: 117px; - background-image: url(../images/bgOutline.png); - background-color: transparent; - z-index: 1000; - overflow: hidden; -} - -#birdseye-container svg, #birdseye-container canvas { - position: absolute; - overflow: hidden; - top: 1px; - left: 4px; - bottom: 0px; - right: 0px; -} - -#birdseye { - margin-top: 1px; - margin-left: 4px; - width: 194px; - height: 108px; - background: #fff; - z-index: 1001; - overflow: hidden; - border: 1px solid #ccc; -} - -#birdseye-collapse { - position: absolute; - top: 80px; - right: 5px; - width: 15px; - height: 10px; - z-index: 1010; - cursor: pointer; -} - -div.birdseye-expanded { - background: transparent url(../images/buttonOutline.png) no-repeat scroll top left; -} - -div.birdseye-expanded-hover { - background: transparent url(../images/buttonOutline.png) no-repeat scroll top right; -} - -div.birdseye-collapsed { - background: transparent url(../images/buttonOutline.png) no-repeat scroll bottom left; -} - -div.birdseye-collapsed-hover { - background: transparent url(../images/buttonOutline.png) no-repeat scroll bottom right; -} - -.brush .extent { - stroke: #666; - fill-opacity: .125; - shape-rendering: crispEdges; -} - -rect.birdseye-brush { - stroke: #7098ad; - fill: transparent; } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.css ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.css new file mode 100755 index 0000000..99d76e8 --- /dev/null +++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.css @@ -0,0 +1,74 @@ +@font-face { + font-family: 'flowfont'; + src: url('./flowfont.eot?17998772'); + src: url('./flowfont.eot?17998772#iefix') format('embedded-opentype'), + url('./flowfont.woff2?17998772') format('woff2'), + url('./flowfont.woff?17998772') format('woff'), + url('./flowfont.ttf?17998772') format('truetype'), + url('./flowfont.svg?17998772#flowfont') format('svg'); + font-weight: normal; + font-style: normal; +} +/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ +/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ +/* +@media screen and (-webkit-min-device-pixel-ratio:0) { + @font-face { + font-family: 'flowfont'; + src: url('../font/flowfont.svg?17998772#flowfont') format('svg'); + } +} +*/ + + [class^="icon-"]:before, [class*=" icon-"]:before { + font-family: "flowfont"; + font-style: normal; + font-weight: normal; + speak: none; + + display: inline-block; + text-decoration: inherit; + width: 1em; + margin-right: .2em; + text-align: center; + /* opacity: .8; */ + + /* For safety - reset parent styles, that can break glyph codes*/ + font-variant: normal; + text-transform: none; + + /* fix buttons height, for twitter bootstrap */ + line-height: 1em; + + /* Animation center compensation - margins should be symmetric */ + /* remove if not needed */ + /*margin-left: .2em;*/ + + /* you can be more comfortable with increased icons size */ + /* font-size: 120%; */ + + /* Font smoothing. That was taken from TWBS */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + + /* Uncomment for 3D effect */ + /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ +} + +.icon-bulletin:before { content: '\e800'; } /* 'î ' */ +.icon-counter:before { content: '\e801'; } /* 'î ' */ +.icon-enable-false:before { content: '\e802'; } /* 'î ' */ +.icon-funnel:before { content: '\e803'; } /* 'î ' */ +.icon-group:before { content: '\e804'; } /* 'î ' */ +.icon-group-remote:before { content: '\e805'; } /* 'î ' */ +.icon-label:before { content: '\e806'; } /* 'î ' */ +.icon-processor:before { content: '\e807'; } /* 'î ' */ +.icon-provenance:before { content: '\e808'; } /* 'î ' */ +.icon-template:before { content: '\e809'; } /* 'î ' */ +.icon-transmit-false:before { content: '\e80a'; } /* 'î ' */ +.icon-zoom-actual:before { content: '\e80b'; } /* 'î ' */ +.icon-zoom-fit:before { content: '\e80c'; } /* 'î ' */ +.icon-port-in:before { content: '\e832'; } /* 'î ²' */ +.icon-port-out:before { content: '\e833'; } /* 'î ³' */ +.icon-connect:before { content: '\e834'; } /* 'î ´' */ +.icon-threads:before { content: '\e83f'; } /* 'î ¿' */ \ No newline at end of file http://git-wip-us.apache.org/repos/asf/nifi/blob/1df8fe44/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.eot ---------------------------------------------------------------------- diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.eot b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.eot new file mode 100755 index 0000000..18795d6 Binary files /dev/null and b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/fonts/flowfont/flowfont.eot differ
