Merge pull request #4976 from archesproject/4969_workflow_ui_improvem…

…ents re: #4969 workflow ui improvements
archesproject · Jul 8, 2019 · d6a85d5 · d6a85d5
2 parents d2ab500 + ad36d15
commit d6a85d5
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 11 deletions.
diff --git a/arches/app/media/css/arches.css b/arches/app/media/css/arches.css
@@ -531,7 +531,7 @@ input[type="checkbox"] {
 .workflow-step-body {
     background-color: #eee;
     height: 100%;
-    padding: 20px 35px 200px 40px;
+    padding: 20px 35px 300px 40px;
     overflow-y: auto;
 }
 
@@ -3264,6 +3264,17 @@ ul.nav.nav-tabs.nav-justified {
     min-width: 468px;
 }
 
+.function-node-alert {
+    background: #0ab1fc;
+    padding: 15px 10px;
+    margin-top: -15px;
+    margin-left: -5px;
+    margin-bottom: 15px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #fff;
+}
+
 .edtf-input {
     padding-bottom: 15px;
 }
@@ -6911,12 +6922,12 @@ ul div .card-tree-list span .card-tree-list-item .card-tree-list-icon {
     cursor: default;
     padding: 3px 5px 5px 5px;
     margin-right: 10px;
-    background: #F5BB25;
+    background: #FFB700;
     color: #fff;
 }
 
 .has-provisional-edits {
-    color: #F5BB25;
+    color: #FFD15B;
 }
 
 .provisional-edits-list {
@@ -6930,9 +6941,10 @@ ul div .card-tree-list span .card-tree-list-item .card-tree-list-icon {
 }
 
 .edit-message-container {
-    background: #F799B9;
+    background: #FFD15B;
     color: #fff;
-    border-bottom: 1px solid #DF2E6A;
+    font-weight: 700;
+    border-bottom: 1px solid #FFB700;
     height: 50px;
     margin-top: -15px;
     margin-bottom: 15px;
@@ -6943,7 +6955,8 @@ ul div .card-tree-list span .card-tree-list-item .card-tree-list-icon {
 
 .edit-message-container .reset-authoritative {
     float: right;
-    color: white;
+    color: #fff;
+    font-weight: 600;
 }
 
 
@@ -12363,6 +12376,7 @@ a.filter-tools:hover {
     background: white;
     width: 100%;
     overflow-y: auto;
+    height: 100vh;
 }
 
 .editor-report .rp-report-section {
@@ -13351,6 +13365,17 @@ ul.select2-choices:after {
     margin-top: 5px;
 }
 
+.card-component-panel .card-component .is-function-node {
+    /*background: #0ab1fc;
+    color: #fff;
+    padding: 15px 10px;
+    margin-bottom: 15px;*/
+    font-size: 13px;
+    font-weight: 600;
+    margin-top: -5px;
+    margin-bottom: 15px;
+}
+
 .card-component-panel hr {
     border-color: #e9e9e9;
 }

diff --git a/arches/app/media/css/tree/tree.css b/arches/app/media/css/tree/tree.css
@@ -205,7 +205,7 @@ a.filtered > span:hover {
 }
 
 .jstree-default .func-node {
-    background: #3acaa1;
+    background: #0ab1fc;
     color: #fff;
     border-width: 2px;
 }

diff --git a/arches/app/media/js/viewmodels/card.js b/arches/app/media/js/viewmodels/card.js
@@ -356,9 +356,9 @@ define([
                         }
                         nodegroupId = params.card.nodegroup_id;
                         if(nodegroupId === appFuncDesc) {
-                            return "* This card data will show as the resource description.";
+                            return "(This card data will define the resource description.)";
                         } else if(nodegroupId === appFuncName) {
-                            return "* This card data will show as the resource name.";
+                            return "(This card data will define the resource name.)";
                         }
                     }
                 }

diff --git a/arches/app/templates/views/components/cards/default.htm b/arches/app/templates/views/components/cards/default.htm
@@ -267,7 +267,7 @@
             {% block form_header %}
             <h4 data-bind="text: card.model.name"></h4>
             <!-- ko if: card.isFuncNode && card.isFuncNode()  -->
-            <h4 data-bind="text: card.isFuncNode()"></h4>
+            <h4 class="is-function-node" data-bind="text: card.isFuncNode()"></h4>
             <!-- /ko -->
             <!-- ko if: card.model.helpenabled -->
             <span>

diff --git a/arches/app/templates/views/graph/graph-designer/node-form.htm b/arches/app/templates/views/graph/graph-designer/node-form.htm
@@ -30,7 +30,7 @@
                             <div class="form-group">
                                 <div class="relative">
                                     <!-- ko if: isFuncNode() -->
-                                    <h4 data-bind="text: isFuncNode()"></h4>
+                                    <h4 class="function-node-alert" data-bind="text: isFuncNode()"></h4>
                                     <!-- /ko -->
                                     <label class="col-xs-12 control-label widget-input-label">
                                         {% trans "Node Name" %}