You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mc...@apache.org on 2016/07/20 11:07:36 UTC

[2/2] nifi git commit: [NIFI-2257] [NIFI-2294] refresh updateattribute processor advanced shell and fix connection config setting tab scrolling issue [NIFI-2270] Update splash screen This closes #646

[NIFI-2257] [NIFI-2294] refresh updateattribute processor advanced shell and fix connection config setting tab scrolling issue
[NIFI-2270] Update splash screen
This closes #646


Project: http://git-wip-us.apache.org/repos/asf/nifi/repo
Commit: http://git-wip-us.apache.org/repos/asf/nifi/commit/8f23afde
Tree: http://git-wip-us.apache.org/repos/asf/nifi/tree/8f23afde
Diff: http://git-wip-us.apache.org/repos/asf/nifi/diff/8f23afde

Branch: refs/heads/master
Commit: 8f23afde5009d992410e5f63e1f960a39a1ef419
Parents: 6c7c3c0
Author: Scott Aslan <ja...@hortonworks.com>
Authored: Tue Jul 19 14:42:42 2016 -0400
Committer: Matt Gilman <ma...@gmail.com>
Committed: Wed Jul 20 06:59:30 2016 -0400

----------------------------------------------------------------------
 .../nifi-framework/nifi-web/nifi-web-ui/pom.xml |  11 +
 .../filters/bulletin-board-min.properties       |   3 +-
 .../resources/filters/bulletin-board.properties |   1 +
 .../resources/filters/canvas-min.properties     |   3 +-
 .../main/resources/filters/canvas.properties    |   3 +-
 .../resources/filters/cluster-min.properties    |   3 +-
 .../main/resources/filters/cluster.properties   |   3 +-
 .../resources/filters/counters-min.properties   |   3 +-
 .../main/resources/filters/counters.properties  |   1 +
 .../resources/filters/history-min.properties    |   3 +-
 .../main/resources/filters/history.properties   |   1 +
 .../main/resources/filters/login-min.properties |   3 +-
 .../src/main/resources/filters/login.properties |   1 +
 .../resources/filters/provenance-min.properties |   3 +-
 .../resources/filters/provenance.properties     |   1 +
 .../resources/filters/summary-min.properties    |   3 +-
 .../main/resources/filters/summary.properties   |   1 +
 .../resources/filters/templates-min.properties  |   3 +-
 .../main/resources/filters/templates.properties |   1 +
 .../main/resources/filters/users-min.properties |   3 +-
 .../src/main/resources/filters/users.properties |   1 +
 .../src/main/webapp/WEB-INF/pages/canvas.jsp    |   4 +-
 .../partials/counters/counters-content.jsp      |   2 +-
 .../src/main/webapp/css/bulletin-board.css      |   3 +-
 .../nifi-web-ui/src/main/webapp/css/canvas.css  |   1 +
 .../src/main/webapp/css/common-ui.css           | 495 +++++++++++++++++++
 .../webapp/css/connection-configuration.css     |   2 -
 .../nifi-web-ui/src/main/webapp/css/dialog.css  |  39 --
 .../nifi-web-ui/src/main/webapp/css/main.css    | 443 +----------------
 .../src/main/webapp/images/nifi-drop-splash.svg |  17 +
 .../main/webapp/js/jquery/combo/jquery.combo.js |  37 +-
 .../src/main/webapp/WEB-INF/jsp/worksheet.jsp   |  56 ++-
 .../src/main/webapp/css/main.css                | 303 +++++-------
 .../src/main/webapp/js/application.js           | 170 ++++---
 34 files changed, 839 insertions(+), 788 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
index 4d2f4be..a84c212 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/pom.xml
@@ -587,6 +587,13 @@
                                         </aggregation>
                                         <aggregation>
                                             <insertNewLine>true</insertNewLine>
+                                            <output>${project.build.directory}/${project.build.finalName}/css/nf-common-ui.css</output>
+                                            <includes>
+                                                <include>${staging.dir}/css/common-ui.css</include>
+                                            </includes>
+                                        </aggregation>
+                                        <aggregation>
+                                            <insertNewLine>true</insertNewLine>
                                             <output>${project.build.directory}/${project.build.finalName}/css/nf-history-all.css</output>
                                             <includes>
                                                 <include>${staging.dir}/css/main.css</include>
@@ -696,10 +703,14 @@
                                 assets/**/*,
                                 css/reset.css,
                                 css/reset.css.gz,
+                                css/common-ui.css,
+                                css/common-ui.css.gz,
                                 css/message-page.css,
                                 css/message-page.css.gz,
                                 css/message-pane.css,
                                 css/message-pane.css.gz,
+                                css/nf-common-ui.css,
+                                css/nf-common-ui.css.gz,
                                 css/nf-canvas-all.css,
                                 css/nf-canvas-all.css.gz,
                                 css/nf-history-all.css,

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board-min.properties
index 822c001..0cef1c6 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board-min.properties
@@ -15,4 +15,5 @@
 
 nf.bulletin.board.script.tags=<script type="text/javascript" src="js/nf/bulletin-board/nf-bulletin-board-all.js?${project.version}"></script>
 nf.bulletin.board.style.tags=<link rel="stylesheet" href="css/nf-bulletin-board-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board.properties
index 72f99a5..bdc7b15 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/bulletin-board.properties
@@ -25,6 +25,7 @@ nf.bulletin.board.script.tags=<script type="text/javascript" src="js/nf/nf-commo
 <script type="text/javascript" src="js/nf/bulletin-board/nf-bulletin-board.js?${project.version}"></script>
 nf.bulletin.board.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas-min.properties
index 2c34e6d..1943157 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas-min.properties
@@ -15,4 +15,5 @@
 
 nf.canvas.script.tags=<script type="text/javascript" src="js/nf/canvas/nf-canvas-all.js?${project.version}"></script>
 nf.canvas.style.tags=<link rel="stylesheet" href="css/nf-canvas-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas.properties
index 0f219d4..738abc1 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/canvas.properties
@@ -81,4 +81,5 @@ nf.canvas.script.tags=<script type="text/javascript" src="js/nf/nf-client.js?${p
 <script type="text/javascript" src="js/nf/canvas/directives/nf-ng-draggable-directive.js?${project.version}"></script>\n\
 <script type="text/javascript" src="js/nf/nf-ng-app-controller.js?${project.version}"></script>\n\
 <script type="text/javascript" src="js/nf/nf-ng-app-config.js?${project.version}"></script>
-nf.canvas.style.tags=<link rel="stylesheet" href="css/canvas.css?${project.version}" type="text/css" />
\ No newline at end of file
+nf.canvas.style.tags=<link rel="stylesheet" href="css/canvas.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster-min.properties
index 03f1fcf..f16ca37 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster-min.properties
@@ -15,4 +15,5 @@
 
 nf.cluster.script.tags=<script type="text/javascript" src="js/nf/cluster/nf-cluster-all.js?${project.version}"></script>
 nf.cluster.style.tags=<link rel="stylesheet" href="css/nf-cluster-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster.properties
index 9061e02..bce1a8e 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/cluster.properties
@@ -25,4 +25,5 @@ nf.cluster.style.tags=<link rel="stylesheet" href="css/reset.css?${project.versi
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/cluster.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/cluster.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters-min.properties
index fdb05a1..8be3bb6 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters-min.properties
@@ -15,4 +15,5 @@
 
 nf.counters.script.tags=<script type="text/javascript" src="js/nf/counters/nf-counters-all.js?${project.version}"></script>
 nf.counters.style.tags=<link rel="stylesheet" href="css/nf-counters-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters.properties
index 4414909..83479a9 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/counters.properties
@@ -22,6 +22,7 @@ nf.counters.script.tags=<script type="text/javascript" src="js/nf/nf-common.js?$
 <script type="text/javascript" src="js/nf/counters/nf-counters-table.js?${project.version}"></script>
 nf.counters.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history-min.properties
index 7d72216..1a53f77 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history-min.properties
@@ -15,4 +15,5 @@
 
 nf.history.script.tags=<script type="text/javascript" src="js/nf/history/nf-history-all.js?${project.version}"></script>
 nf.history.style.tags=<link rel="stylesheet" href="css/nf-history-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history.properties
index e532204..5ab98a0 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/history.properties
@@ -23,6 +23,7 @@ nf.history.script.tags=<script type="text/javascript" src="js/nf/nf-common.js?${
 <script type="text/javascript" src="js/nf/history/nf-history-model.js?${project.version}"></script>
 nf.history.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login-min.properties
index 4dafb02..fc60809 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login-min.properties
@@ -15,4 +15,5 @@
 
 nf.login.script.tags=<script type="text/javascript" src="js/nf/login/nf-login-all.js?${project.version}"></script>
 nf.login.style.tags=<link rel="stylesheet" href="css/nf-login-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login.properties
index 7a1678d..03e6394 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/login.properties
@@ -21,6 +21,7 @@ nf.login.script.tags=<script type="text/javascript" src="js/nf/nf-common.js?${pr
 <script type="text/javascript" src="js/nf/login/nf-login.js?${project.version}"></script>
 nf.login.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance-min.properties
index 1be3238..9eb3097 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance-min.properties
@@ -15,4 +15,5 @@
 
 nf.provenance.script.tags=<script type="text/javascript" src="js/nf/provenance/nf-provenance-all.js?${project.version}"></script>
 nf.provenance.style.tags=<link rel="stylesheet" href="css/nf-provenance-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
index c0fe613..0a199df 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/provenance.properties
@@ -27,6 +27,7 @@ nf.provenance.script.tags=<script type="text/javascript" src="js/nf/nf-common.js
 <script type="text/javascript" src="js/nf/nf-ng-app-config.js?${project.version}"></script>
 nf.provenance.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary-min.properties
index 3f079bc..1ac220a 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary-min.properties
@@ -15,4 +15,5 @@
 
 nf.summary.script.tags=<script type="text/javascript" src="js/nf/summary/nf-summary-all.js?${project.version}"></script>
 nf.summary.style.tags=<link rel="stylesheet" href="css/nf-summary-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary.properties
index 52dfe49..51dd9df 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/summary.properties
@@ -30,6 +30,7 @@ nf.summary.script.tags=<script type="text/javascript" src="js/nf/nf-common.js?${
 <script type="text/javascript" src="js/nf/nf-ng-app-config.js?${project.version}"></script>
 nf.summary.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/processor-details.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates-min.properties
index 0ec2c27..f0b78ec 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates-min.properties
@@ -15,4 +15,5 @@
 
 nf.templates.script.tags=<script type="text/javascript" src="js/nf/templates/nf-templates-all.js?${project.version}"></script>
 nf.templates.style.tags=<link rel="stylesheet" href="css/nf-templates-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates.properties
index 7ad302c..c8a357d 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/templates.properties
@@ -22,6 +22,7 @@ nf.templates.script.tags=<script type="text/javascript" src="js/nf/nf-common.js?
 <script type="text/javascript" src="js/nf/templates/nf-templates-table.js?${project.version}"></script>
 nf.templates.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users-min.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users-min.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users-min.properties
index 9375334..e87e952 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users-min.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users-min.properties
@@ -15,4 +15,5 @@
 
 nf.users.script.tags=<script type="text/javascript" src="js/nf/users/nf-users-all.js?${project.version}"></script>
 nf.users.style.tags=<link rel="stylesheet" href="css/nf-users-all.css?${project.version}" type="text/css" />\n\
-<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />
\ No newline at end of file
+<link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/nf-common-ui.css?${project.version}" type="text/css" />
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users.properties
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users.properties b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users.properties
index b2dee8e..b0e2093 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users.properties
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/resources/filters/users.properties
@@ -23,6 +23,7 @@ nf.users.script.tags=<script type="text/javascript" src="js/nf/nf-client.js?${pr
 <script type="text/javascript" src="js/nf/users/nf-users-table.js?${project.version}"></script>
 nf.users.style.tags=<link rel="stylesheet" href="css/reset.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/main.css?${project.version}" type="text/css" />\n\
+<link rel="stylesheet" href="css/common-ui.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/banner.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/dialog.css?${project.version}" type="text/css" />\n\
 <link rel="stylesheet" href="css/message-pane.css?${project.version}" type="text/css" />\n\

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/canvas.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/canvas.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/canvas.jsp
index 44f284a..c6662ca 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/canvas.jsp
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/pages/canvas.jsp
@@ -85,7 +85,9 @@
     </head>
     <body ng-controller="ngCanvasAppCtrl" id="canvas-body">
         <div id="splash">
-            <img id="splash-img" src="images/loadAnimation.gif" alt="Loading..."/>
+            <div id="splash-img" layout="row" layout-align="center center">
+                <md-progress-circular md-mode="indeterminate" class="md-warn" md-diameter="150"></md-progress-circular>
+            </div>
         </div>
         <jsp:include page="/WEB-INF/partials/message-pane.jsp"/>
         <jsp:include page="/WEB-INF/partials/banners-main.jsp"/>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/counters/counters-content.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/counters/counters-content.jsp b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/counters/counters-content.jsp
index 22f686f..6399d0b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/counters/counters-content.jsp
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/WEB-INF/partials/counters/counters-content.jsp
@@ -23,7 +23,7 @@
                 Displaying&nbsp;<span id="displayed-counters"></span>&nbsp;of&nbsp;<span id="total-counters"></span>
             </div>
             <div id="counters-filter-container" class="filter-container">
-                <input type="text" id="counters-filter" class="filter"/>
+                <input type="text" id="counters-filter" placeholder="Filter" class="filter"/>
                 <div id="counters-filter-type" class="filter-type"></div>
             </div>
         </div>

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
index afa8af8..253c86b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/bulletin-board.css
@@ -21,10 +21,9 @@
 #bulletin-board {
     position: absolute;
     top: 0px;
-    bottom: 0px;
+    bottom: 40px;
     left: 20px;
     right: 20px;
-    height: 100%;
     overflow: auto;
 }
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/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 db9f4ce..9922ebc 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,6 +43,7 @@
 @import url(settings.css);
 @import url(about.css);
 @import url(message-pane.css);
+@import url(common-ui.css);
 @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/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css
new file mode 100644
index 0000000..52f6162
--- /dev/null
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/common-ui.css
@@ -0,0 +1,495 @@
+/*
+ * 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.
+ */
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 300;
+    src: local('Roboto Light'),
+    local('Roboto-Light'),
+    url('../fonts/Roboto/Roboto-Light.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: italic;
+    font-weight: 300;
+    src: local('Roboto LightItalic'),
+    local('Roboto-LightItalic'),
+    url('../fonts/Roboto/Roboto-LightItalic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: normal;
+    src: local('Roboto Regular'),
+    local('Roboto-Regular'),
+    url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 500;
+    src: local('Roboto Medium'),
+    local('Roboto-Medium'),
+    url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: bold;
+    src: local('Roboto Bold'),
+    local('Roboto-Bold'),
+    url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto';
+    font-style: italic;
+    font-weight: normal;
+    src: local('Roboto Italic'),
+    local('Roboto-Italic'),
+    url('../fonts/Roboto/Roboto-Italic.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto Slab';
+    font-style: normal;
+    font-weight: normal;
+    src: local('RobotoSlab Regular'),
+    local('RobotoSlab-Regular'),
+    url('../fonts/Roboto_Slab/RobotoSlab-Regular.ttf') format('truetype');
+}
+
+@font-face {
+    font-family: 'Roboto Slab';
+    font-style: normal;
+    font-weight: bold;
+    src: local('RobotoSlab Bold'),
+    local('RobotoSlab-Bold'),
+    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: -2px;
+}
+
+body {
+    display: block;
+    font-family: Roboto, sans-serif;
+    font-size: 62.5%;
+    overflow: hidden;
+    color: #262626;
+}
+
+.value-color {
+    color: #775351;
+}
+
+ul.links li {
+    float: left;
+    display: block;
+    margin-left: 10px;
+    padding: 4px;
+    text-align: center;
+    font-size: 11px;
+    font-weight: normal;
+    text-decoration: none;
+}
+
+ul.links span.header-link-over {
+    color: #264c58;
+    text-decoration: underline;
+}
+
+/*
+    General Styles
+*/
+
+.unselectable {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+.clear {
+    clear: both;
+}
+
+.pointer {
+    cursor: pointer !important;
+}
+
+.hidden {
+    display: none;
+}
+
+.blank, .unset, .sensitive {
+    font-style: italic;
+    font-weight: normal;
+    color: #aaa;
+}
+
+.required {
+    font-weight: bold !important;
+}
+
+
+.ellipsis {
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+.ellipsis.multiline {
+    white-space: normal;
+}
+
+input.filter-list {
+    color: #888;
+}
+
+.table-cell {
+    overflow: hidden;
+    white-space: nowrap;
+    line-height: normal;
+    float: left;
+    margin-top: 4px;
+}
+
+label {
+    font-family: 'Roboto Slab', serif;
+    font-size: 12px;
+    color: #262626; /*base-font-color*/
+    letter-spacing: 0.05rem;
+    display: block;
+    margin-bottom: 2px;
+}
+
+input::placeholder {
+    color: #728e9b; /*base-color*/
+}
+
+input[type=text], input[type=password], textarea {
+    background-color: #eaeef0;
+    border: 1px solid #eaeef0;
+    font-family: Roboto, sans-serif;
+    font-size: 13px;
+    padding: 0px 0px 0px 10px;
+    resize: none;
+    height: 32px;
+    width: 100%;
+    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
+    -moz-box-sizing: border-box; /* Firefox, other Gecko */
+    box-sizing: border-box;
+    color: #262626;
+}
+
+input:focus, textarea:focus {
+    background-color: #fff;
+    border: 1px solid #004849; /*link-color*/
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
+    outline: none;
+}
+
+textarea {
+    overflow: hidden;
+    padding: 10px 10px;
+    resize: vertical;
+    color: #262626;
+    font-size: 13px !important;
+}
+
+ul.property-info {
+    list-style-type: disc;
+    margin-left: 10px;
+}
+
+ul.property-info li {
+    padding: 0px 0px;
+    margin-left: 10px;
+}
+
+div.nf-checkbox {
+    cursor: default;
+    width: 12px;
+    height: 12px;
+    float: left;
+    margin-right: 4px;
+}
+
+div.checkbox-unchecked {
+    background: transparent url(../images/inputCheckbox.png) no-repeat scroll top left;
+}
+
+div.checkbox-checked {
+    background: transparent url(../images/inputCheckbox.png) no-repeat scroll top right;
+}
+
+div.ajax-loading {
+    background-image: url(../images/iconLoading.gif);
+}
+
+div.ajax-complete {
+    background-image: url(../images/iconCommit.png);
+}
+
+div.ajax-error {
+    background-image: url(../images/iconDelete.png);
+}
+
+.refresh-button {
+    float: left;
+}
+
+.ui-draggable .dialog-header {
+    cursor: move;
+}
+
+span.link {
+    cursor: pointer;
+    color: #004849; /*link-color*/
+    font-weight: normal;
+    display: inline-block;
+    border-bottom: 1px solid #CCDADB;
+    font-size: 13px;
+    font-family: Roboto;
+}
+
+span.link-over {
+    border-bottom: 1px solid #004849;
+}
+
+span.link-bold {
+    font-weight: bold;
+    border-bottom: none;
+}
+
+button {
+    height: 28px;
+    width: 28px;
+    border: 1px solid #CCDADB; /*tint link-color 80%*/
+    background-color: rgba(249, 250, 251, 0.97);
+    color: #004849;
+}
+
+button.refresh-button {
+    font-size: 16px;
+}
+
+button:hover {
+    border: 1px solid #004849; /*link-color*/
+}
+
+button:disabled {
+    color: #CCDADB !important; /*tint link-color 80%*/
+    cursor: not-allowed;
+    border: 1px solid #CCDADB; /*tint link-color 80%*/
+}
+
+/* angular material override */
+
+button:focus {
+    outline: none;
+}
+
+div:focus {
+    outline: none;
+}
+
+input:focus {
+    background-color: #fff;
+    border: 1px solid #004849; /*link-color*/
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
+    outline: none;
+}
+
+/* filter controls */
+
+.filter-controls {
+    position: absolute;
+    top: 10px;
+}
+
+.filter-container {
+    height: 32px;
+    width: 318px;
+    float: left;
+}
+
+.filter {
+    margin-right: 3px;
+    float: left;
+}
+
+input.filter {
+    width: 173px;
+}
+
+.filter-type {
+    width: 120px;
+    float: left;
+}
+
+.filter-status {
+    margin-top: 10px;
+    color: #775351;
+    font-family: Roboto;
+    font-size: 13px;
+    font-weight: 500;
+    margin-bottom: 5px;
+}
+
+/* buttons */
+
+button.fa {
+    color: #004849;
+    font-size: 16px;
+    cursor: pointer;
+}
+
+button.icon {
+    color: #004849;
+    font-size: 16px;
+}
+
+div.button {
+    height: 32px;
+    width: 90px;
+    padding: 0 8px;
+    text-transform: uppercase;
+    font-weight: 500;
+    font-size: 11px;
+    line-height: 33px;
+    text-align: center;
+    border: 0px;
+    float: right;
+    position: relative;
+    background: #728E9B;
+    color: #fff;
+    cursor: pointer;
+}
+
+div.button:hover {
+    background-color: #004849;
+}
+
+div.secondary-button {
+    height: 32px;
+    width: 90px;
+    padding: 0 8px;
+    text-transform: uppercase;
+    font-weight: 500;
+    font-size: 11px;
+    line-height: 33px;
+    text-align: center;
+    border: 0px;
+    float: right;
+    position: relative;
+    background: #E3E8EB;
+    color: #004849;
+}
+
+div.secondary-button:hover {
+    background-color: #C7D2D7;
+}
+
+/* tooltips */
+
+.qtip-nifi {
+    border: 0px !important;
+    border-radius: 2px;
+    background-color: rgba(0, 0, 0, 0.54) !important;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
+    font-family: Roboto;
+    font-weight: 500;
+    font-size: 13px;
+    color: #fff !important;
+}
+
+div.nifi-tooltip {
+    border: 0px !important;
+    border-radius: 2px;
+    background-color: rgba(0, 0, 0, 0.80) !important;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
+    font-family: Roboto;
+    font-weight: 500;
+    font-size: 13px;
+    color: #fff !important;
+    max-width: 500px;
+    word-wrap: break-word;
+}
+
+.scrollable {
+    border-bottom: 1px solid #d0dbe0;
+}
+
+/* progress bars */
+
+md-progress-linear > div {
+    background-color: #eaeef0 !important;
+}
+
+.setting {
+    margin-bottom: 15px;
+}
+
+.setting-name {
+    font-size: 12px;
+    font-weight: 500;
+    font-family: Roboto Slab;
+    padding-bottom: 4px;
+    color: #262626;
+}
+
+.setting-name .fa {
+    color: #004849;
+    margin-left: 5px;
+}
+
+.setting-field .fa {
+    color: #004849;
+    margin-left: 5px;
+}
+
+.setting-field {
+    line-height: normal;
+    width: 100%;
+    color: #775351;
+    font-size: 13px;
+}
+
+.setting-header{
+    color: #728e9b;
+    font-size: 12pt;
+    font-family: 'Roboto Slab';
+    font-style: normal;
+    font-weight: bold;
+    padding-bottom: 20px;
+    text-overflow: ellipsis;
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
index be5f71e..30487f9 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/connection-configuration.css
@@ -82,10 +82,8 @@ div.undefined {
     list-style-type: none;
     margin: 0px;
     background: #eaeef0;
-    width: 325px;
     min-height: 32px;
     margin-bottom: 5px;
-    width: 100%;
     padding: 2px;
 }
 

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
index 5d4f781..9ec7bc5 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/dialog.css
@@ -190,45 +190,6 @@ ul.result li {
     padding: 3px 0px;
 }
 
-.setting {
-    margin-bottom: 15px;
-}
-
-.setting-name {
-    font-size: 12px;
-    font-weight: 500;
-    font-family: Roboto Slab;
-    padding-bottom: 4px;
-    color: #262626;
-}
-
-.setting-name .fa {
-    color: #004849;
-    margin-left: 5px;
-}
-
-.setting-field .fa {
-    color: #004849;
-    margin-left: 5px;
-}
-
-.setting-field {
-    line-height: normal;
-    width: 100%;
-    color: #775351;
-    font-size: 13px;
-}
-
-.setting-header{
-    color: #728e9b;
-    font-size: 12pt;
-    font-family: 'Roboto Slab';
-    font-style: normal;
-    font-weight: bold;
-    padding-bottom: 20px;
-    text-overflow: ellipsis;
-}
-
 .dialog-content div.settings-left {
     float: left;
     width: 49%;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/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 024b497..0fa0177 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
@@ -14,99 +14,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-@font-face {
-    font-family: 'Roboto';
-    font-style: normal;
-    font-weight: 300;
-    src: local('Roboto Light'),
-    local('Roboto-Light'),
-    url('../fonts/Roboto/Roboto-Light.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    font-style: italic;
-    font-weight: 300;
-    src: local('Roboto LightItalic'),
-    local('Roboto-LightItalic'),
-    url('../fonts/Roboto/Roboto-LightItalic.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    font-style: normal;
-    font-weight: normal;
-    src: local('Roboto Regular'),
-    local('Roboto-Regular'),
-    url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    font-style: normal;
-    font-weight: 500;
-    src: local('Roboto Medium'),
-    local('Roboto-Medium'),
-    url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    font-style: normal;
-    font-weight: bold;
-    src: local('Roboto Bold'),
-    local('Roboto-Bold'),
-    url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto';
-    font-style: italic;
-    font-weight: normal;
-    src: local('Roboto Italic'),
-    local('Roboto-Italic'),
-    url('../fonts/Roboto/Roboto-Italic.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto Slab';
-    font-style: normal;
-    font-weight: normal;
-    src: local('RobotoSlab Regular'),
-    local('RobotoSlab-Regular'),
-    url('../fonts/Roboto_Slab/RobotoSlab-Regular.ttf') format('truetype');
-}
-
-@font-face {
-    font-family: 'Roboto Slab';
-    font-style: normal;
-    font-weight: bold;
-    src: local('RobotoSlab Bold'),
-    local('RobotoSlab-Bold'),
-    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: -2px;
-}
-
-.value-color {
-    color: #775351;
-}
-
-body {
-    display: block;
-    font-family: Roboto, sans-serif;
-    font-size: 62.5%;
-    overflow: hidden;
-    color: #262626;
-}
 
 #splash {
     position: absolute;
@@ -119,9 +26,12 @@ body {
 }
 
 #splash-img {
-    display: block;
-    padding-top: 250px;
-    margin: 0px auto;
+    position: absolute;
+    top: 10%;
+    bottom: 10%;
+    left: 10%;
+    right: 10%;
+    background: transparent url(../images/nifi-drop-splash.svg) no-repeat center center;
 }
 
 #context-menu {
@@ -187,74 +97,6 @@ div.context-menu-provenance {
     z-index: 1300;
 }
 
-ul.links li {
-    float: left;
-    display: block;
-    margin-left: 10px;
-    padding: 4px;
-    text-align: center;
-    font-size: 11px;
-    font-weight: normal;
-    text-decoration: none;
-}
-
-ul.links span.header-link-over {
-    color: #264c58;
-    text-decoration: underline;
-}
-
-/*
-    General Styles
-*/
-
-.unselectable {
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-}
-
-.clear {
-    clear: both;
-}
-
-.pointer {
-    cursor: pointer !important;
-}
-
-.delete td {
-    text-decoration: line-through;
-}
-
-.hidden {
-    display: none;
-}
-
-.blank, .unset, .sensitive {
-    font-style: italic;
-    font-weight: normal;
-    color: #aaa;
-}
-
-.required {
-    font-weight: bold !important;
-}
-
-div.nifi-tooltip {
-    border: 0px !important;
-    border-radius: 2px;
-    background-color: rgba(0, 0, 0, 0.80) !important;
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
-    font-family: Roboto;
-    font-weight: 500;
-    font-size: 13px;
-    color: #fff !important;
-    max-width: 500px;
-    word-wrap: break-word;
-}
-
 .ellipsis {
     white-space: nowrap;
     overflow: hidden;
@@ -264,18 +106,6 @@ div.nifi-tooltip {
     white-space: normal;
 }
 
-input.filter-list {
-    color: #888;
-}
-
-.table-cell {
-    overflow: hidden;
-    white-space: nowrap;
-    line-height: normal;
-    float: left;
-    margin-top: 4px;
-}
-
 .collapsed {
     background: transparent url(../images/iconTwistArrow.png) no-repeat scroll top left;
 }
@@ -284,49 +114,6 @@ input.filter-list {
     background: transparent url(../images/iconTwistArrow.png) no-repeat scroll top right;
 }
 
-label {
-    font-family: 'Roboto Slab', serif;
-    font-size: 12px;
-    color: #262626; /*base-font-color*/
-    letter-spacing: 0.05rem;
-    display: block;
-    margin-bottom: 2px;
-}
-
-input::placeholder {
-    color: #728e9b; /*base-color*/
-}
-
-input[type=text], input[type=password], textarea {
-    background-color: #eaeef0;
-    border: 1px solid #eaeef0;
-    font-family: Roboto, sans-serif;
-    font-size: 13px;
-    padding: 0px 0px 0px 10px;
-    resize: none;
-    height: 32px;
-    width: 100%;
-    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-    -moz-box-sizing: border-box; /* Firefox, other Gecko */
-    box-sizing: border-box;
-    color: #262626;
-}
-
-input:focus, textarea:focus {
-    background-color: #fff;
-    border: 1px solid #004849; /*link-color*/
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-    outline: none;
-}
-
-textarea {
-    overflow: hidden;
-    padding: 10px 10px;
-    resize: vertical;
-    color: #262626;
-    font-size: 13px !important;
-}
-
 #new-template-description {
     position: absolute;
     top: 81px;
@@ -335,53 +122,6 @@ textarea {
     min-height: 32px;
 }
 
-ul.property-info {
-    list-style-type: disc;
-    margin-left: 10px;
-}
-
-ul.property-info li {
-    padding: 0px 0px;
-    margin-left: 10px;
-}
-
-div.nf-checkbox {
-    cursor: default;
-    width: 12px;
-    height: 12px;
-    float: left;
-    margin-right: 4px;
-}
-
-div.checkbox-unchecked {
-    background: transparent url(../images/inputCheckbox.png) no-repeat scroll top left;
-}
-
-div.checkbox-checked {
-    background: transparent url(../images/inputCheckbox.png) no-repeat scroll top right;
-}
-
-div.ajax-loading {
-    background-image: url(../images/iconLoading.gif);
-}
-
-div.ajax-complete {
-    background-image: url(../images/iconCommit.png);
-}
-
-div.ajax-error {
-    /*margin-left: -2px;*/
-    background-image: url(../images/iconDelete.png);
-}
-
-.refresh-button {
-    float: left;
-}
-
-.ui-draggable .dialog-header {
-    cursor: move;
-}
-
 /* processor status styles */
 
 div.disabled {
@@ -446,25 +186,6 @@ tr.alt-row {
     background: #f5f5f5 none;
 }
 
-span.link {
-    cursor: pointer;
-    color: #004849; /*link-color*/
-    font-weight: normal;
-    display: inline-block;
-    border-bottom: 1px solid #CCDADB;
-    font-size: 13px;
-    font-family: Roboto;
-}
-
-span.link-over {
-    border-bottom: 1px solid #004849;
-}
-
-span.link-bold {
-    font-weight: bold;
-    border-bottom: none;
-}
-
 span.details-title {
     font-weight: bold;
     font-size: 12px;
@@ -489,158 +210,6 @@ span.details-title {
     font-size: 13px;
 }
 
-button {
-    height: 28px;
-    width: 28px;
-    border: 1px solid #CCDADB; /*tint link-color 80%*/
-    background-color: rgba(249, 250, 251, 0.97);
-    color: #004849;
-}
-
-button.refresh-button {
-    font-size: 16px;
-}
-
-button:hover {
-    border: 1px solid #004849; /*link-color*/
-}
-
-button:disabled {
-    color: #CCDADB !important; /*tint link-color 80%*/
-    cursor: not-allowed;
-    border: 1px solid #CCDADB; /*tint link-color 80%*/
-}
-
-/* angular material override */
-
-button:focus {
-    outline: none;
-}
-
-div:focus {
-    outline: none;
-}
-
-input:focus {
-    background-color: #fff;
-    border: 1px solid #004849; /*link-color*/
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-    outline: none;
-}
-
-/* filter controls */
-
-.filter-controls {
-    position: absolute;
-    top: 10px;
-}
-
-.filter-container {
-    height: 32px;
-    width: 318px;
-    float: left;
-}
-
-.filter {
-    margin-right: 3px;
-    float: left;
-}
-
-input.filter {
-    width: 173px;
-}
-
-.filter-type {
-    width: 120px;
-    float: left;
-}
-
-.filter-status {
-    margin-top: 10px;
-    color: #775351;
-    font-family: Roboto;
-    font-size: 13px;
-    font-weight: 500;
-    margin-bottom: 5px;
-}
-
-/* buttons */
-
-button.fa {
-    color: #004849;
-    font-size: 16px;
-    cursor: pointer;
-}
-
-button.icon {
-    color: #004849;
-    font-size: 16px;
-}
-
-div.button {
-    height: 32px;
-    width: 90px;
-    padding: 0 8px;
-    text-transform: uppercase;
-    font-weight: 500;
-    font-size: 11px;
-    line-height: 33px;
-    text-align: center;
-    border: 0px;
-    float: right;
-    position: relative;
-    background: #728E9B;
-    color: #fff;
-    cursor: pointer;
-}
-
-div.button:hover {
-    background-color: #004849;
-}
-
-div.secondary-button {
-    height: 32px;
-    width: 90px;
-    padding: 0 8px;
-    text-transform: uppercase;
-    font-weight: 500;
-    font-size: 11px;
-    line-height: 33px;
-    text-align: center;
-    border: 0px;
-    float: right;
-    position: relative;
-    background: #E3E8EB;
-    color: #004849;
-}
-
-div.secondary-button:hover {
-    background-color: #C7D2D7;
-}
-
-/* tooltips */
-
-.qtip-nifi {
-    border: 0px !important;
-    border-radius: 2px;
-    background-color: rgba(0, 0, 0, 0.54) !important;
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
-    font-family: Roboto;
-    font-weight: 500;
-    font-size: 13px;
-    color: #fff !important;
-}
-
-.scrollable {
-    border-bottom: 1px solid #d0dbe0;
-}
-
-/* progress bars */
-
-md-progress-linear > div {
-    background-color: #eaeef0 !important;
-}
-
 /* new template */
 
 #new-template-description {

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/images/nifi-drop-splash.svg
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/images/nifi-drop-splash.svg b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/images/nifi-drop-splash.svg
new file mode 100644
index 0000000..6b36215
--- /dev/null
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/images/nifi-drop-splash.svg
@@ -0,0 +1,17 @@
+<!--
+    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.
+-->
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="1364 -753 190 266.533"><defs><style>.a{opacity:0.2;}.b{fill:#fff;}.c{opacity:0.3;}</style></defs><g transform="translate(1364 -753.037)"><g class="a"><path class="b" d="M91.09,258.75A91.09,91.09,0,0,1,0,167.65c0-43.3,33.93-84.81,57.14-115.11A341,341,0,0,0,90.15.59,1.05,1.05,0,0,1,92,.59a340.909,340.909,0,0,0,33,51.95c23.2,30.29,57.15,71.81,57.15,115.12H126.61a2.14,2.14,0,0,0-2.14,2.14V201H93.23a2.14,2.14,0,0,0-2.14,2.14Z"/><path class="b" d="M126.7,236.63V206.89H99.09A2.14,2.14,0,0,0,96.95,209v27.61Z"/><path class="b" d="M96.95,266.35a88.83,88.83,0,0,0,29.75-5.72v-15H99.09a2.14,2.14,0,0,0-2.14,2.14Z"/><path class="b" d="M160.07,203.25V173.51H132.46a2.14,2.14,0,0,0-2.14,2.14v27.6Z"/><path class="b" d="M163.64,240.22h0a6.24,6.24,0,0,0,1.79-4.41V212.27H135.71V242h23.5A6.24,6.24,0,0,0,163.64,240.22Z"/><path class="b" d="M137.73,266.57a89,89,0,0,0,22-13.52h-22Z"/><path class="b" d="M184.06,203.25a88.58,88.58,0,0,0,5.73-29.74h-20.7v29.74Z"/
 ><path class="b" d="M176.49,236.28a88.78,88.78,0,0,0,13.51-22H176.49Z"/><path class="b" d="M176.49,236.28a88.78,88.78,0,0,0,13.51-22H176.49Z"/></g><g class="c"><path class="b" d="M71.05,44.12c-1.68,2.35-3.34,4.71-5,7-5.34,7.36-11,14.51-16.46,21.75q3.24.45,6.49,1c4.59-7.68,9.26-15.32,13.66-23.11,1.23-2.18,2.44-4.39,3.66-6.58C74.33,42.48,72.1,42.66,71.05,44.12Z"/><path class="b" d="M49.33,85.39C50.14,84,51,82.55,51.8,81.14q-3.69-.72-7.39-1.32h0a304.741,304.741,0,0,0-21.33,32.73c-11.45,20.76-19.4,44-15.75,67.92a85.22,85.22,0,0,0,28.4,51.28A83.78,83.78,0,0,0,46,239.38a1.09,1.09,0,0,0,1.34-1.72A91.36,91.36,0,0,1,22.7,196.11c-6.82-25.14-1.15-50.91,8.56-74.49A322.53,322.53,0,0,1,49.33,85.39Z"/></g></g></svg>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/combo/jquery.combo.js
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/combo/jquery.combo.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/combo/jquery.combo.js
index 232fe20..6372a16 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/combo/jquery.combo.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/combo/jquery.combo.js
@@ -231,13 +231,38 @@
                             }
 
                             if (!isBlank(option.description)) {
-                                $('<div style="float: right; line-height: 32px;" class="fa fa-question-circle"></div>').appendTo(optionElement).qtip($.extend({}, nf.Common.config.tooltipConfig, {
-                                    content: option.description,
-                                    position: {
-                                        at: 'top right',
-                                        my: 'bottom left'
+                                $('<div style="float: right; line-height: 32px;" class="fa fa-question-circle"></div>').appendTo(optionElement).qtip($.extend({},
+                                    {
+                                        style: {
+                                            classes: 'nifi-tooltip'
+                                        },
+                                        show: {
+                                            solo: true,
+                                            effect: function(offset) {
+                                                $(this).slideDown(100);
+                                            }
+                                        },
+                                        hide: {
+                                            effect: function(offset) {
+                                                $(this).slideUp(100);
+                                            }
+                                        },
+                                        position: {
+                                            at: 'bottom center',
+                                            my: 'top center',
+                                            adjust: {
+                                                y: 5
+                                            }
+                                        }
+                                    },
+                                    {
+                                        content: option.description,
+                                        position: {
+                                            at: 'top right',
+                                            my: 'bottom left'
+                                        }
                                     }
-                                }));
+                                ));
                             }
 
                             actualHeight += 16;

http://git-wip-us.apache.org/repos/asf/nifi/blob/8f23afde/nifi-nar-bundles/nifi-update-attribute-bundle/nifi-update-attribute-ui/src/main/webapp/WEB-INF/jsp/worksheet.jsp
----------------------------------------------------------------------
diff --git a/nifi-nar-bundles/nifi-update-attribute-bundle/nifi-update-attribute-ui/src/main/webapp/WEB-INF/jsp/worksheet.jsp b/nifi-nar-bundles/nifi-update-attribute-bundle/nifi-update-attribute-ui/src/main/webapp/WEB-INF/jsp/worksheet.jsp
index a92c4e0..544d706 100644
--- a/nifi-nar-bundles/nifi-update-attribute-bundle/nifi-update-attribute-ui/src/main/webapp/WEB-INF/jsp/worksheet.jsp
+++ b/nifi-nar-bundles/nifi-update-attribute-bundle/nifi-update-attribute-ui/src/main/webapp/WEB-INF/jsp/worksheet.jsp
@@ -29,8 +29,11 @@
         <link rel="stylesheet" href="../nifi/js/codemirror/addon/hint/show-hint.css" type="text/css" />
         <link rel="stylesheet" href="../nifi/js/jquery/nfeditor/jquery.nfeditor.css" type="text/css" />
         <link rel="stylesheet" href="../nifi/js/jquery/nfeditor/languages/nfel.css" type="text/css" />
+        <link rel="stylesheet" href="../nifi/fonts/flowfont/flowfont.css" type="text/css" />
+        <link rel="stylesheet" href="../nifi/assets/font-awesome/css/font-awesome.min.css" type="text/css" />
         <link rel="stylesheet" href="../nifi/css/reset.css" type="text/css" />
         <link rel="stylesheet" href="css/main.css" type="text/css" />
+        <link rel="stylesheet" href="../nifi/css/common-ui.css" type="text/css" />
         <script type="text/javascript" src="../nifi/js/jquery/jquery-2.1.1.min.js"></script>
         <script type="text/javascript" src="../nifi/js/jquery/jquery.center.js"></script>
         <script type="text/javascript" src="../nifi/js/jquery/jquery.each.js"></script>
@@ -53,7 +56,6 @@
         <script type="text/javascript" src="../nifi/js/jquery/slickgrid/slick.grid.js"></script>
         <script type="text/javascript" src="../nifi/js/codemirror/lib/codemirror-compressed.js"></script>
         <script type="text/javascript" src="../nifi/js/nf/nf-namespace.js"></script>
-        <script type="text/javascript" src="../nifi/js/nf/nf-common.js"></script>
         <script type="text/javascript" src="../nifi/js/nf/nf-storage.js"></script>
         <script type="text/javascript" src="../nifi/js/nf/nf-ajax-setup.js"></script>
         <script type="text/javascript" src="../nifi/js/nf/nf-universal-capture.js"></script>
@@ -72,14 +74,14 @@
                 <div id="flowfile-policy-container">
                     <span id="selected-flowfile-policy" class="hidden"></span>
                     <div id="flowfile-policy-label" class="large-label">FlowFile Policy</div>
-                    <img class="icon-info" src="images/iconInfo.png" alt="Info" title="Defines the behavior when multiple rules match. Use clone will ensure that each matching rule is executed with a copy of the original flowfile. Use original will execute all matching rules with the original flowfile in the order specified below."/>
+                    <div class="info fa fa-question-circle" title="Defines the behavior when multiple rules match. Use clone will ensure that each matching rule is executed with a copy of the original flowfile. Use original will execute all matching rules with the original flowfile in the order specified below."></div>
                     <div id="flowfile-policy"></div>
                     <div class="clear"></div>
                 </div>
                 <div id="rule-label-container">
                     <div id="rules-label" class="large-label">Rules</div>
-                    <img class="icon-info" src="images/iconInfo.png" alt="Info" title="Click and drag to change the order that rules are evaluated."/>
-                    <div id="new-rule" class="new-rule hidden"></div>
+                    <div class="info fa fa-question-circle" title="Click and drag to change the order that rules are evaluated."></div>
+                    <button id="new-rule" class="new-rule hidden fa fa-plus"></button>
                     <div class="clear"></div>
                 </div>
                 <div id="rule-list-container">
@@ -88,10 +90,10 @@
                 <div id="no-rules" class="unset">No rules found.</div>
                 <div id="rule-filter-controls" class="hidden">
                     <div id="rule-filter-container">
-                        <input type="text" id="rule-filter"/>
+                        <input type="text" placeholder="Filter" id="rule-filter"/>
                         <div id="rule-filter-type"></div>
                     </div>
-                    <div id="rule-filter-stats">
+                    <div id="rule-filter-stats" class="filter-status">
                         Displaying&nbsp;<span id="displayed-rules"></span>&nbsp;of&nbsp;<span id="total-rules"></span>
                     </div>
                 </div>
@@ -106,8 +108,8 @@
                 <div id="selected-rule-conditions-container" class="selected-rule-detail">
                     <div class="large-label-container">
                         <div id="conditions-label" class="large-label">Conditions</div>
-                        <img class="icon-info" src="images/iconInfo.png" alt="Info" title="All conditions must be met for this rule to match."/>
-                        <div id="new-condition" title="New Condition" class="new-condition hidden"></div>
+                        <div class="info fa fa-question-circle" title="All conditions must be met for this rule to match."></div>
+                        <button id="new-condition" title="New Condition" class="new-condition hidden fa fa-plus"></button>
                         <div class="clear"></div>
                     </div>
                     <div id="selected-rule-conditions"></div>
@@ -115,46 +117,46 @@
                 <div id="selected-rule-actions-container" class="selected-rule-detail">
                     <div class="large-label-container">
                         <div id="actions-label" class="large-label">Actions</div>
-                        <div id="new-action" title="New Action" class="new-action hidden"></div>
+                        <button id="new-action" title="New Action" class="new-action hidden fa fa-plus"></button>
                         <div class="clear"></div>
                     </div>
                     <div id="selected-rule-actions"></div>
                 </div>
-                <div style="margin-top: -10px;">
-                    <div id="message"></div>
-                    <div id="selected-rule-save" class="button hidden">Save</div>
-                    <div class="clear"></div>
-                </div>
+                <div class="clear"></div>
+            </div>
+            <div id="message-and-save-container">
+                <div id="selected-rule-save" class="button hidden">Save</div>
+                <div id="message"></div>
                 <div class="clear"></div>
             </div>
             <div class="clear"></div>
             <div id="glass-pane"></div>
-            <div id="ok-dialog">
+            <div id="ok-dialog" class="small-dialog">
                 <div id="ok-dialog-content" class="dialog-content"></div>
             </div>
-            <div id="yes-no-dialog">
+            <div id="yes-no-dialog" class="small-dialog">
                 <div id="yes-no-dialog-content" class="dialog-content"></div>
             </div>
-            <div id="new-rule-dialog">
+            <div id="new-rule-dialog" class="small-dialog">
                 <div class="dialog-content">
                     <div class="rule-setting">
-                        <div class="label">Rule name</div>
+                        <div class="setting-name">Rule name</div>
                         <div>
                             <input id="new-rule-name" type="text" />
                         </div>
                     </div>
                     <div class="rule-setting">
-                        <div class="label">Copy from existing rule (optional)</div>
+                        <div class="setting-name">Copy from existing rule (optional)</div>
                         <div>
-                            <input id="copy-from-rule-name" type="text" class="search" />
+                            <input id="copy-from-rule-name" placeholder="Search rule name" type="text" class="search" />
                         </div>
                     </div>
                 </div>
             </div>
             <div id="new-condition-dialog" class="dialog">
-                <div style="margin-bottom: 32px;">
+                <div>
                     <div class="rule-setting">
-                        <div class="label">Expression</div>
+                        <div class="setting-name">Expression</div>
                         <div>
                             <div id="new-condition-expression"></div>
                         </div>
@@ -162,20 +164,20 @@
                 </div>
                 <div id="new-condition-button-container">
                     <div id="new-condition-add" class="button button-normal">Add</div>
-                    <div id="new-condition-cancel" class="button button-normal">Cancel</div>
+                    <div id="new-condition-cancel" class="secondary-button button-normal">Cancel</div>
                     <div class="clear"></div>
                 </div>
             </div>
             <div id="new-action-dialog" class="dialog">
                 <div style="margin-bottom: 32px;">
                     <div class="rule-setting">
-                        <div class="label">Attribute</div>
+                        <div class="setting-name">Attribute</div>
                         <div id="new-action-attribute-container">
                             <input id="new-action-attribute" type="text"></input>
                         </div>
                     </div>
-                    <div class="rule-setting" style="margin-top: 36px;">
-                        <div class="label">Value</div>
+                    <div class="rule-setting">
+                        <div class="setting-name">Value</div>
                         <div>
                             <div id="new-action-value"></div>
                         </div>
@@ -183,7 +185,7 @@
                 </div>
                 <div id="new-action-button-container">
                     <div id="new-action-add" class="button button-normal">Add</div>
-                    <div id="new-action-cancel" class="button button-normal">Cancel</div>
+                    <div id="new-action-cancel" class="secondary-button button-normal">Cancel</div>
                     <div class="clear"></div>
                 </div>
             </div>