From: Sarah Abouzainah <sabouzainah.ext@orange.com>
Date: Fri, 10 Jul 2020 01:07:45 +0000 (+0200)
Subject: Manual Enrichment.
X-Git-Tag: 1.0.0~78^2
X-Git-Url: https://gerrit.onap.org/r/gitweb?a=commitdiff_plain;h=56ce1449eaf4fdd78f2cccf33f6d2d604a819fb4;p=ccsdk%2Fcds.git

Manual Enrichment.

Issue-ID: CCSDK-2542

Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com>
Change-Id: I44cc4266324d5722364c8643cdc75cff49391a63
---

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
index 8e2ae5dbb..ba5eca973 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
@@ -106,16 +106,17 @@
                                 </div>
                             </div>
                         </div>
-                        <div class="col-2 package-view-button pt-3">
+                        <div class="col-2 package-view-button">
                             <!-- <button class="btn btn-sm btn-primary mb-2" (click)="goToDesignerMode()">Designer
                                 Mode
                             </button> -->
                             <!-- Button trigger modal - 1st Action -->
+
                             <button type="button" class="btn btn-sm btn-primary mb-2" data-toggle="modal"
                                 data-target="#exampleModalLong">
-                                Designer Mode
+                                <i class="icon-topologyView-active"></i> Designer Mode
                             </button>
-                            <!-- Modal -->
+                            <!-- Designer Modal -->
                             <div class="modal fade createActionModal" id="exampleModalLong" tabindex="-1" role="dialog"
                                 aria-labelledby="exampleModalLongTitle" aria-hidden="true">
                                 <div class="modal-dialog" role="document">
@@ -658,7 +659,13 @@
                                     </div>
                                 </div>
                             </div>
-                            <button class="btn btn-sm btn-outline-secondary" (click)="deployCurrentPackage()"><i
+                            <button type="button" class="btn btn-sm mb-2 btn-enrich" data-toggle="modal"
+                                data-target="#enrichModal">
+                                <i class="icon-enrich" aria-hidden="true"></i> Manual Enrich
+                            </button>
+
+
+                            <button class="btn btn-sm btn-deploy" (click)="deployCurrentPackage()"><i
                                     class="fa fa-play-circle"></i> Deploy
                             </button>
                         </div>
@@ -722,7 +729,35 @@
     </div>
 </div>
 
-
+<!-- Enrich Modal -->
+<div class="modal fade enrichModal" id="enrichModal" tabindex="-1" role="dialog" aria-labelledby="enrichModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="enrichModalLabel">Manual Enrich</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <img src="assets/img/icon-close.svg" />
+                </button>
+            </div>
+            <div class="modal-body">
+                <ul class="defintionsNote">
+                    <li><b>To do manual enrichment: </b></li>
+                    <li>1. Copy and paste "workflows" and "node_templates"</li>
+                    <li>2. Press <b>Enrich</b> button</li>
+                </ul>
+                <ace-editor [(text)]="dslDefinition.content" [mode]="'javascript'" [autoUpdateContent]="true"
+                    [durationBeforeCallback]="1000" (textChanged)="textChanged($event)" [theme]="'eclipse'" #editor
+                    style="height:300px;">
+                </ace-editor>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+                <button type="button" data-dismiss="modal" class="btn btn-primary btn-enrich">Enrich</button>
+            </div>
+        </div>
+    </div>
+</div>
 <!-- Delete Modal -->
 <div class="modal fade" id="removePackageModal" tabindex="-1" role="dialog" aria-labelledby="removePackageModalLabel"
     aria-hidden="true">
@@ -731,7 +766,7 @@
             <div class="modal-header">
                 <h5 class="modal-title" id="removePackageModalLabel">Delete Script</h5>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
+                    <i class="icon-action-close"></i>
                 </button>
             </div>
             <div class="modal-body">
@@ -744,4 +779,4 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
index 0e1d4cd11..fa127290c 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
@@ -39,6 +39,7 @@ export class ConfigurationDashboardComponent implements OnInit {
     id: any;
 
     currentBlob = new Blob();
+    dslDefinition: DslDefinition = new DslDefinition();
 
     constructor(
         private route: ActivatedRoute,
@@ -248,4 +249,8 @@ export class ConfigurationDashboardComponent implements OnInit {
     public fileLeave(event) {
         console.log(event);
     }
+
+    textChanged($event: {}) {
+
+    }
 }
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
index 940177e6a..9ac7a058a 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html
@@ -53,7 +53,7 @@
                                     <div class="modal-header">
                                         <h5 class="modal-title" id="exampleModalLabel">Delete File</h5>
                                         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                            <span aria-hidden="true">&times;</span>
+                                            <img src="assets/img/icon-close.svg" />
                                         </button>
                                     </div>
                                     <div class="modal-body">
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
index e859062be..bd501c163 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
@@ -36,7 +36,7 @@
                                     <div class="modal-header">
                                         <h5 class="modal-title" id="exampleModalLabel">Delete Script</h5>
                                         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                                            <span aria-hidden="true">&times;</span>
+                                            <img src="assets/img/icon-close.svg" />
                                         </button>
                                     </div>
                                     <div class="modal-body">
@@ -122,4 +122,4 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
index e1b0f83d6..f517cb108 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
@@ -5,14 +5,11 @@
                 class="fa fa-chevron-left mr-2"></i>Template List</button>
     </div>
     <div class="col text-right">
-
         <button data-toggle="modal" [hidden]="!edit" data-target="#templateDeletionModal2"
             class="btn btn-outline-danger" title="Delete Template">Delete</button>
-
-
         <button (click)="cancel()" [hidden]="fileName?.length <=0 || edit"
             class="btn btn-outline-secondary">Clear</button>
-        <button (click)="saveToStore()" [disabled]="fileName?.length <=0" class="btn btn-primary">Finish</button>
+        <button (click)="saveToStore()" [disabled]="fileName?.length <=0" title="Submit template and close" class="btn btn-primary">Finish</button>
     </div>
 </div>
 <div class="card creat-card">
@@ -74,7 +71,9 @@
                     <div class="create-template-import">Use the editor to add parameters or you can also
                         <a href="#" data-toggle="modal" (click)="allowedExt=[getFileExtension()]"
                             data-target="#templateModal"><b>Import
-                                File</b></a></div>
+                                File</b></a>. <br /> <span class="templateNote"><i class="icon-info"
+                                aria-hidden="true"></i> When you import new file, the new attributes will replace
+                            current attributes.</span></div>
                     <div class="editor-container mb-4">
                         <app-source-editor [lang]="'velocity'" (textChange)="textChanges($event,templateInfo.fileName)"
                             [(text)]="templateFileContent"></app-source-editor>
@@ -259,7 +258,7 @@
                                 <th width="40"><img src="assets/img/icon-file-code.svg" /></th>
                                 <th>{{ item.name }}</th>
                                 <th (click)="removeFile(i)" width="40" class="text-right"><img
-                                        src="assets/img/icon-remove-file.svg" /></th>
+                                        src="assets/img/icon-remove-file.svg" class="btn-modal-remove-file" /></th>
                             </tr>
                         </thead>
                     </table>
@@ -287,7 +286,7 @@
             <div class="modal-header">
                 <h5 class="modal-title" id="templateDeletionModal2Label">Delete Script</h5>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
+                    <img src="assets/img/icon-close.svg" />
                 </button>
             </div>
             <div class="modal-body">
@@ -301,4 +300,4 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
index 3e377981e..bc87ae2c0 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component.html
@@ -48,7 +48,7 @@
             <div class="modal-header">
                 <h5 class="modal-title" id="templateDeletionModalLabel">Delete Script</h5>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
+                    <img src="assets/img/icon-close.svg" />
                 </button>
             </div>
             <div class="modal-body">
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html
index 48a503321..48fd4806a 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/template-mapping.component.html
@@ -6,4 +6,4 @@
 <div [hidden]="creationView">
     <app-templ-mapp-creation (showListView)="openListView()" (showCreationView)="openCreationView()">
     </app-templ-mapp-creation>
-</div>
\ No newline at end of file
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
index 1e6959fdc..f5588bc43 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
@@ -78,7 +78,7 @@
                        <p class="mb-2">By {{bluePrint.updatedBy.split('<')[0]}}</p>
                         <p class="package-desc" [delay]="300"
                             tooltip="{{bluePrint.artifactDescription}}"
-                            placement="auto">{{bluePrint.artifactDescription}}</p>
+                            placement="bottom left">{{bluePrint.artifactDescription}}</p>
                         <ul class="package-contributers">
                             <li>
                                 <button type="button" class="border-fade" data-toggle="tooltip" data-placement="bottom"
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot
index 70a4e600f..7c88462a2 100755
Binary files a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot and b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.eot differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
index 3441e50a9..cb635c143 100755
--- a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
+++ b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.svg
@@ -14,6 +14,7 @@
 <glyph unicode="&#xe904;" glyph-name="icon-action-back" horiz-adv-x="1422" d="M479.778 915.244c19.067 19.733 50.8 19.733 70.533 0 19.067-19.067 19.067-50.8 0-69.822l-357.644-357.644h1180.178c27.511-0.044 49.378-21.911 49.378-49.422s-21.867-50.089-49.378-50.089h-1180.178l357.644-356.978c19.067-19.733 19.067-51.511 0-70.533-19.733-19.733-51.511-19.733-70.533 0l-442.311 442.311c-19.733 19.067-19.733 50.8 0 69.822l442.311 442.356z" />
 <glyph unicode="&#xe905;" glyph-name="icon-file" horiz-adv-x="751" d="M731.195 731.764l-208.496 208.494c-12.729 12.731-29.652 19.742-47.655 19.742h-407.653c-37.16 0-67.391-30.232-67.391-67.391v-851.058c0-37.16 30.232-67.391 67.391-67.391h616.15c37.16 0 67.391 30.232 67.391 67.391v642.56c0 17.997-7.009 34.92-19.738 47.653zM652.324 728.944h-122.82c-5.309 0-9.627 4.319-9.627 9.627v122.818l132.447-132.445zM683.542 31.923h-616.15c-5.309 0-9.627 4.319-9.627 9.627v851.058c0 5.309 4.319 9.627 9.627 9.627h394.721v-163.665c0-37.16 30.232-67.391 67.391-67.391h163.665v-629.629c0-5.309-4.319-9.627-9.627-9.627z" />
 <glyph unicode="&#xe906;" glyph-name="icon-rectangle" d="M0 960h1024v-1024h-1024v1024z" />
+<glyph unicode="&#xe907;" glyph-name="icon-enrich" horiz-adv-x="723" d="M643.818 562.272h-240.316l20.882 363.431c1.945 33.821-43.138 47.578-60.352 18.306l-312.986-532.253c-12.694-21.586 2.893-48.888 27.965-48.888h240.317l-20.884-363.431c-1.945-33.823 43.14-47.574 60.352-18.306l312.986 532.251c12.692 21.589-2.895 48.89-27.965 48.89zM370.919 129.754l15.154 263.697c1.069 18.617-13.757 34.301-32.389 34.301h-217.964l216.186 367.635-15.152-263.698c-1.069-18.617 13.757-34.301 32.389-34.301h217.962l-216.186-367.633zM67.885 180.705l-56.849-56.849c-12.669-12.669-12.669-33.209 0-45.878 12.667-12.669 33.209-12.671 45.878 0l56.849 56.849c12.669 12.669 12.669 33.209 0 45.878-12.667 12.671-33.209 12.671-45.878 0zM67.885 714.493c12.667-12.669 33.209-12.671 45.878 0 12.669 12.669 12.669 33.209 0 45.878l-56.849 56.849c-12.667 12.669-33.209 12.669-45.878 0s-12.669-33.209 0-45.878l56.849-56.849zM654.942 180.705c-12.667 12.669-33.209 12.669-45.878 0s-12.669-33.209 0-45.878l56.849-56.849c12.667-12.669 33.209-12.671 45.878 0 12.669 12.669 12.669 33.209 0 45.878l-56.849 56.849zM654.942 714.493l56.849 56.849c12.669 12.669 12.669 33.209 0 45.878-12.667 12.669-33.209 12.669-45.878 0l-56.849-56.849c-12.669-12.669-12.669-33.209 0-45.878 12.665-12.667 33.209-12.669 45.878 0z" />
 <glyph unicode="&#xe915;" glyph-name="icon-add" d="M512 960c-282.785 0-512-229.215-512-512s229.215-512 512-512c282.785 0 512 229.249 512 512s-229.215 512-512 512zM512 0c-247.425 0-448 200.575-448 448s200.575 448 448 448c247.425 0 448-200.575 448-448s-200.575-448-448-448zM704 480h-160v160c0 17.664-14.336 32-32 32s-32-14.336-32-32v-160h-160c-17.664 0-32-14.336-32-32s14.336-32 32-32h160v-160c0-17.664 14.336-32 32-32s32 14.336 32 32v160h160c17.664 0 32 14.336 32 32s-14.336 32-32 32z" />
 <glyph unicode="&#xe952;" glyph-name="icon-archive-sm" d="M943.405 684.258h-864.783c-10.653 0-19.867-3.887-27.644-11.668-7.781-7.777-11.668-16.991-11.668-27.637v-589.626c0-10.644 3.887-19.863 11.668-27.637 7.777-7.781 16.991-11.677 27.644-11.677h864.783c10.647 0 19.854 3.896 27.637 11.677 7.775 7.773 11.662 16.991 11.662 27.637v589.626c0 10.653-3.872 19.858-11.662 27.637-7.775 7.781-16.991 11.668-27.637 11.668zM617.255 499.387c-7.773-7.779-16.991-11.668-27.637-11.668h-157.233c-10.64 0-19.854 3.892-27.637 11.668-7.777 7.781-11.668 16.991-11.668 27.644 0 10.644 3.892 19.858 11.668 27.637 7.781 7.781 16.995 11.673 27.637 11.673h157.249c10.638 0 19.85-3.892 27.637-11.673 7.775-7.777 11.662-16.991 11.662-27.637 0-10.651-3.896-19.863-11.677-27.644zM1010.357 947.749c-7.783 7.781-16.991 11.668-27.639 11.668h-943.409c-10.644 0-19.858-3.887-27.637-11.668-7.779-7.777-11.671-16.991-11.671-27.637v-157.233c0-10.644 3.892-19.854 11.673-27.637 7.779-7.781 16.991-11.668 27.637-11.668h943.394c10.644 0 19.863 3.887 27.652 11.668 7.773 7.781 11.66 16.991 11.66 27.637v157.233c0 10.653-3.887 19.86-11.66 27.637z" />
 <glyph unicode="&#xe953;" glyph-name="icon-btn-card-config" d="M971.283 561.778h-95.801c-15.398 0-28.084 8.476-33.982 22.699s-2.901 29.203 7.964 40.088l67.736 67.717c9.956 9.956 15.436 23.211 15.436 37.281 0 14.089-5.48 27.326-15.436 37.3l-86.338 86.338c-19.911 19.911-54.632 19.949-74.581 0l-67.717-67.717c-10.885-10.866-25.903-13.9-40.088-7.983-14.222 5.897-22.699 18.584-22.699 33.982v95.801c0 29.070-23.647 52.717-52.717 52.717h-122.121c-29.070 0-52.717-23.647-52.717-52.717v-95.801c0-15.398-8.476-28.084-22.699-33.982-14.184-5.935-29.203-2.882-40.088 7.983l-67.717 67.717c-19.949 19.949-54.67 19.911-74.581 0l-86.338-86.338c-9.956-9.956-15.436-23.211-15.436-37.3 0-14.071 5.48-27.307 15.436-37.281l67.736-67.717c10.866-10.885 13.843-25.865 7.964-40.088s-18.584-22.699-33.982-22.699h-95.801c-29.070 0-52.717-23.647-52.717-52.717v-122.103c0-29.089 23.647-52.736 52.717-52.736h95.801c15.398 0 28.084-8.476 33.982-22.699s2.901-29.203-7.964-40.088l-67.736-67.717c-9.956-9.956-15.436-23.211-15.436-37.281 0-14.089 5.48-27.326 15.436-37.3l86.338-86.338c19.93-19.93 54.632-19.968 74.581 0l67.717 67.736c10.885 10.866 25.847 13.862 40.088 7.964 14.222-5.897 22.699-18.584 22.699-33.982v-95.801c0-29.070 23.647-52.717 52.717-52.717h122.103c29.070 0 52.717 23.647 52.717 52.717v95.801c0 15.398 8.476 28.084 22.699 33.982 14.241 5.916 29.203 2.901 40.088-7.964l67.717-67.736c19.949-19.949 54.67-19.911 74.581 0l86.338 86.338c9.956 9.956 15.436 23.211 15.436 37.3 0 14.071-5.48 27.307-15.436 37.281l-67.736 67.717c-10.866 10.885-13.843 25.865-7.964 40.088s18.603 22.699 34.001 22.699h95.801c29.070 0 52.717 23.647 52.717 52.717v122.121c0 29.070-23.647 52.717-52.717 52.717zM986.074 386.939c0-8.154-6.637-14.791-14.791-14.791h-95.801c-30.796 0-57.249-17.673-69.025-46.118-11.795-28.444-5.594-59.657 16.194-81.427l67.736-67.717c5.784-5.784 5.784-15.17 0-20.935l-86.338-86.338c-5.765-5.765-15.151-5.803-20.935 0l-67.717 67.736c-21.788 21.788-52.983 27.951-81.427 16.194-28.444-11.776-46.118-38.229-46.118-69.025v-95.801c0-8.154-6.637-14.791-14.791-14.791h-122.121c-8.154 0-14.791 6.637-14.791 14.791v95.801c0 30.796-17.673 57.249-46.118 69.025-9.538 3.963-19.361 5.897-29.070 5.897-19.228 0-37.869-7.585-52.357-22.073l-67.717-67.736c-5.803-5.803-15.189-5.765-20.935 0l-86.338 86.338c-5.784 5.784-5.784 15.17 0 20.935l67.736 67.717c21.769 21.769 27.989 52.983 16.194 81.427-11.776 28.425-38.229 46.099-69.025 46.099h-95.801c-8.154 0-14.791 6.637-14.791 14.791v122.121c0 8.154 6.637 14.791 14.791 14.791h95.801c30.796 0 57.249 17.673 69.025 46.118 11.795 28.444 5.594 59.657-16.194 81.427l-67.736 67.717c-5.784 5.784-5.784 15.17 0 20.935l86.338 86.338c5.765 5.784 15.151 5.784 20.935 0l67.717-67.717c21.751-21.751 52.945-27.989 81.427-16.194 28.444 11.757 46.118 38.21 46.118 69.006v95.801c0 8.154 6.637 14.791 14.791 14.791h122.103c8.173 0 14.81-6.637 14.81-14.791v-95.801c0-30.796 17.673-57.249 46.118-69.025 28.482-11.795 59.657-5.575 81.427 16.194l67.717 67.717c5.803 5.784 15.189 5.784 20.935 0l86.338-86.338c5.784-5.784 5.784-15.17 0-20.935l-67.736-67.717c-21.769-21.769-27.989-52.983-16.194-81.427 11.776-28.444 38.229-46.118 69.025-46.118h95.801c8.154 0.019 14.791-6.618 14.791-14.772v-122.121zM512 618.667c-94.113 0-170.667-76.553-170.667-170.667s76.553-170.667 170.667-170.667c94.113 0 170.667 76.553 170.667 170.667s-76.553 170.667-170.667 170.667zM512 315.259c-73.178 0-132.741 59.563-132.741 132.741s59.563 132.741 132.741 132.741c73.178 0 132.741-59.563 132.741-132.741s-59.563-132.741-132.741-132.741z" />
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf
index 94a4d73c3..ab6b20e04 100755
Binary files a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf and b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.ttf differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff
index b989b33e2..cabebb884 100755
Binary files a/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff and b/cds-ui/designer-client/src/assets/icomoon/fonts/icomoon.woff differ
diff --git a/cds-ui/designer-client/src/assets/icomoon/style.css b/cds-ui/designer-client/src/assets/icomoon/style.css
index 5b11e4c76..874f94a9b 100755
--- a/cds-ui/designer-client/src/assets/icomoon/style.css
+++ b/cds-ui/designer-client/src/assets/icomoon/style.css
@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icomoon';
-  src:  url('fonts/icomoon.eot?mwwfrv');
-  src:  url('fonts/icomoon.eot?mwwfrv#iefix') format('embedded-opentype'),
-    url('fonts/icomoon.ttf?mwwfrv') format('truetype'),
-    url('fonts/icomoon.woff?mwwfrv') format('woff'),
-    url('fonts/icomoon.svg?mwwfrv#icomoon') format('svg');
+  src:  url('fonts/icomoon.eot?r3i568');
+  src:  url('fonts/icomoon.eot?r3i568#iefix') format('embedded-opentype'),
+    url('fonts/icomoon.ttf?r3i568') format('truetype'),
+    url('fonts/icomoon.woff?r3i568') format('woff'),
+    url('fonts/icomoon.svg?r3i568#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -35,8 +35,12 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-enrich:before {
+  content: "\e907";
+}
 .icon-rectangle:before {
   content: "\e906";
+  color: #ff6b6b;
 }
 .icon-file:before {
   content: "\e905";
diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index a3c4b2b10..320ae139e 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -18,6 +18,11 @@ body{
   transition: 0.3s !important;
 }
 /*Bootstrap*/
+.btn-outline-danger{
+  background: #fff !important;
+  border: solid 1px #ECEDF2 !important;
+  color: #FF6469 !important;
+}
 .btn:disabled:hover{
   cursor: default;
 }
@@ -1770,15 +1775,14 @@ ul.package-contributers{
 .tooltip:after,
 [data-tooltip]:after {
   z-index: 1000;
-  padding: 8px;
+  padding: 8px 20px !important;
   width: auto;
-  background-color: #fff;
-  background-color: rgba(255, 255, 255, 1.0);
+  background-color: #fff !important;
   color: #1B3E6F;
   content: attr(data-tooltip);
-  font-size: 10px;
+  font-size: 12px;
   line-height: 1.2;
-  border-radius: 2px;
+  border-radius: 3px;
 }
 
 /* Directions */
@@ -1916,36 +1920,39 @@ ul.package-contributers{
 }
 
 /*TooltipModule - Shady*/
+.tooltip.in {
+  opacity: 1.0 !important;
+  filter:alpha(opacity=100) !important;
+}
 .tooltip:before,
 .tooltip:after{
   width: 100% !important;
 }
 .tooltip .tooltip-inner{
+  width: auto !important;
   max-width: 280px !important;
-  width: 100% !important;
   text-align: left!important;
   color:#1B3E6F;
-  background-color: #fff;
+  background-color: #fff !important;
   border: solid 1px #E6EDF5;
   border-radius: 3px !important;
-  font-size: 11px;
+  border-top-left-radius: 0 !important;
+  font-size: 12px;
   opacity: 1.0 !important;
-}  
-.bs-tooltip-bottom .arrow::before{
-  border-bottom-color:  #E6EDF5  !important;
-}
 
-.bs-tooltip-top .arrow::before{
-  border-top-color:  #E6EDF5  !important;
-}

-.bs-tooltip-left .arrow::before{
-  border-left-color:  #E6EDF5  !important;
-}
 
-.bs-tooltip-right .arrow::before{
-  border-right-color:  #E6EDF5  !important;
-}

-	
-
+} 
 
+.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
+  border-top-color: #E6EDF5 !important;
+}
+.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before {
+  border-right-color: #E6EDF5 !important;
+}
+.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before {
+  border-bottom-color: #E6EDF5 !important;
+}
+.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before {
+  border-left-color: #E6EDF5 !important;
+}
 
 .btn{
 padding-right: 20px !important;
@@ -1965,17 +1972,18 @@ padding-left: 20px !important;
 }
 .btn + .btn{
   margin-left: 10px;
-  }
-  .package-view-button button{
-    width: 150px; 
-    float: right;
-  }
+}
+.package-view-button button{
+  width: 150px; 
+  float: right;
+}
 .package-view-button{
   margin-top: 6px;
 }
 .package-view-button .btn{
   padding: 6px 21px;
   border-radius: 18px;
+  font-size: 13px !important;
 }
 .package-view-button .btn:hover{
   opacity: .9;
@@ -1983,13 +1991,22 @@ padding-left: 20px !important;
 .package-view-button .btn-primary{
   background-color: #1B3E6F !important;
   border-color: #1B3E6F !important;
- 
-  /* margin-bottom: 10px; */
 }
-.package-view-button .btn-outline-secondary{
-  background-color: #fff !important;
+.package-view-button .btn-enrich,
+.package-view-button .btn-enrich:focus,
+.modal-footer .btn-primary.btn-enrich{
+  background: #EB9A34 !important;
+  border-color: #EB9A34 !important;
+  color: #fff;
+  outline: none !important;
+}
+.package-view-button .btn-deploy{
+  background-color: #1273EB !important;
+  border-color: #1273EB !important;
+  color: #fff !important;
+  /* background-color: #fff !important;
   border-color: #D0DFF1 !important;
-  color: #1B3E6F !important;
+  color: #1B3E6F !important; */
 }
 .package-view-title {
   font-size: 11px;
@@ -2264,12 +2281,20 @@ hr{
   text-align: center;
 }
 .action-button{
+  display: inline-block;
+  width: 70px;
   margin-bottom: 12px;
-  padding: 3px 30px;
   color: #BABBC3 !important;
   font-size: 10px;
   font-weight: bold;
-  display: inline-block;
+  background: transparent;
+  border: 0;
+  padding: 0;
+}
+.action-button:disabled,
+.action-button:disabled:hover{
+  cursor: unset;
+  opacity: .5 !important;
 }
 .action-button:hover{
   text-decoration: none;
@@ -2335,6 +2360,9 @@ hr{
 .modal-body{
   padding: 1.5rem 1.5rem 1rem !important;
 }
+.enrichModal .modal-dialog{
+  max-width: 60% !important;
+}
 .modal-body p{
   font-size: 14px;
 }
@@ -2371,6 +2399,9 @@ hr{
   background-color: #E7F1FC !important;
   color: #1B3E6F !important;
 }
+.btn-modal-remove-file:hover{
+  cursor: pointer;
+}
 .action-button span{
   width: 100%;
   display: inline-block;
@@ -2567,6 +2598,10 @@ hr{
 .template-mapping-accordion{
   width: 100%;
 }
+.templateNote{
+  font-size: 12px;
+  color: #C1CDDD;
+}
 .card-header .btn.regularTitle{
   padding-left: 0 !important;
   padding-right: 0 !important;
@@ -2683,31 +2718,29 @@ hr{
   background: #eee !important;
 }
 .ace_content{
-  width: 100%;
+  width: 100% !important;
 }
 .ace_editor{
   height: 55vh !important;
   line-height: 25px;
   border: 1px solid #ECEDF2;
   background-color: #fff;
-  color: #1B3E6F;
+  color: #1B3E6F !important;
 }
-.ace-tomorrow-night-bright .ace_gutter,
-.ace-eclipse .ace_gutter{
+.ace_gutter{
   background: #E0E8F2 !important;
   border-right: 0px !important;
   color: #1B3E6F !important;
 }
-.ace-tomorrow-night-bright .ace_gutter-active-line,
-.ace-eclipse .ace_gutter-active-line{
-  background-color: #265699;
+.ace-tm .ace_gutter-active-line{
+  background-color: #265699 !important;
   color: #fff;
 }
-.ace-tomorrow-night-bright .ace_cursor{
-  color: #265699;
+.ace_cursor{
+  color: #265699 !important;
 }
-.ace-tomorrow-night-bright .ace_marker-layer .ace_active-line {
-  background: #eee;
+.ace-tm .ace_marker-layer .ace_active-line{
+  background: #F4F9FE !important;
 }
 .breadcrumb-header{
   padding: 0px;
@@ -2961,6 +2994,9 @@ margin-right: 5px;
   border-color:#ECEDF2 !important ;
   color: #C3CDDB !important ;
 }
+.template-mapping-action .btn-outline-secondary:hover{
+  color: #1B3E6F !important;
+}
 .table-container{
   width: 100%;
 }