Fix action wrapper in deisgner

Issue-ID: CCSDK-2286

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

6 files changed, 29 insertions, 11 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
index 0e27c1838..1b8826fe3 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.css
@@ -174,7 +174,7 @@ header{
   box-shadow: 0 2px 6px rgba(47, 83, 151, .15)
 }
 .topology-actions .dropdown-content a{
-  padding: 0 20px;
+  padding: 0 20px 0 15px;
   color: #1B3E6F;
   font-size: 13px;
 }
@@ -211,6 +211,13 @@ header{
   font-size: 11px;
   line-height: 20px;
 }
+.save-blueprint i{
+  margin-right: 7px;
+  font-size: 14px;
+}
+.save-blueprint i.icon-save-sm{
+  font-size: 10px;
+}
 .save-blueprint li:hover{
   cursor: pointer;
 }
@@ -543,6 +550,7 @@ p.compType-4{
   margin-top: 14px;
 }
 .controllerSidebar .custom-control label{
+  width: 100%;
   margin-bottom: 0;
 }
 .controllerSidebar .custom-control i{
@@ -681,7 +689,7 @@ p.compType-4{
   margin-top: 45px;
 }
 .attributesSideBar .attributesContainer{
-  height: 85.9vh;
+  height: calc(100vh - 106px) /*85.9vh*/;
   overflow-y: hidden;
   padding-bottom: 20px;
   background: #fff;
@@ -859,6 +867,7 @@ p.compType-4{
 .icon-required-star{
   margin-left: 2px;
   font-size: 10px;
+  color: #FF6469;
 }
 .optional-attribute::before{
   color: #CAD3E0;
@@ -1725,6 +1734,7 @@ ul.editor{
 }
 .tooltiptext h5{
   margin-bottom: 5px;
+  font-size: 15px;
 }
 .tooltipGetAtt h5{
   margin-bottom: 0;
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
index e725a52c5..87ef61c27 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.html
@@ -90,13 +90,13 @@
                         <div class="dropdown-text">Save</div>
                         <ul class="dropdown-content save-blueprint">
                             <li>
-                                <a (click)="saveBluePrint()">Save</a>
+                                <a (click)="saveBluePrint()"><i class="icon-save-sm" aria-hidden="true"></i> Save</a>
                             </li>
                             <li>
-                                <a (click)="enrichBluePrint()">Enrich</a>
+                                <a (click)="enrichBluePrint()"><i class="icon-enrich" aria-hidden="true"></i> Enrich</a>
                             </li>
                             <li>
-                                <a (click)="publishBluePrint()">Deploy</a>
+                                <a (click)="publishBluePrint()"><i class="fa fa-play-circle" aria-hidden="true"></i> Deploy</a>
                             </li>
                         </ul>
                     </div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
index b73231b00..3347aa3ac 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/designer.component.ts
@@ -288,8 +288,8 @@ export class DesignerComponent implements OnInit, OnDestroy {
             this.boardPaper = new joint.dia.Paper({
                 el: $('#board-paper'),
                 model: this.boardGraph,
-                height: 720,
-                width: 1300,
+                height: '100%',
+                width: '100%',
                 // origin: { x: 80, y: 70 },
                 gridSize: 10, // background line sizes
                 drawGrid: true,
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
index b8a79c3c8..762f1e2b6 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
@@ -206,7 +206,7 @@
             </div>
         </div>
     </div>
-    <button class="btn btn-info  btn-select-template m-auto" (click)="saveFunctionData()">Save</button>
+    <button class="btn btn-select-template m-auto" (click)="saveFunctionData()">Save</button>
 </div>
 
 <!--function - Select Template - Modal-->
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
index 322acb92f..1042024f3 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.html
@@ -88,10 +88,10 @@
                         <div class="dropdown-text">Save</div>
                         <ul class="dropdown-content">
                             <li>
-                                <a href="">Save</a>
+                                <a href=""><i class="icon-save-sm" aria-hidden="true"></i> Save</a>
                             </li>
                             <li>
-                                <a href="">Save &amp; Deploy</a>
+                                <a href=""><i class="fa fa-play-circle" aria-hidden="true"></i> Save &amp; Deploy</a>
                             </li>
                         </ul>
                     </div>
diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index c9ebd56f6..f24b5f9ec 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -21,6 +21,11 @@ button:focus{
   outline: 0 !important;
 }
 /*Bootstrap*/
+.form-control[readonly]{
+  background-color: inherit !important;
+  opacity: .85 !important;
+  font-weight: bold;
+}
 .custom-control-input:checked ~ .custom-control-label::before{
   border-color: transparent !important;
 }
@@ -2439,6 +2444,9 @@ padding-left: 20px !important;
 .single-custom-key{
   width: 100%;
 }
+.single-custom-key:last-child{
+  margin-bottom: 20px;
+}
 .single-line-custom-key{
   width: 45%;
   display: inline-block;
@@ -2534,7 +2542,7 @@ hr{
 }
 .action-button i.icon-discard-sm{
   font-size: 11px;
-  color: #C3CDDB;
+  color: #BABBC3;
 }
 /* .action-button.save{
   color: #1273EB !important;