From c8e345bdd14cfdb8b676b61db9122ea03dfecf5b Mon Sep 17 00:00:00 2001
From: Sarah Abouzainah <sarah.abouzainah@Sarahs-MacBook-Pro.local>
Date: Fri, 10 Apr 2020 14:54:02 +0200
Subject: Merge live repo with design changes ccsdk-2309

Issue-ID: CCSDK-2309
Change-Id: Iba91eebc5880a930842e66fa97d20441c52e347b
Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com>
---
 .../imports-tab/imports-tab.component.html         | 53 ++++++++++++++++------
 1 file changed, 40 insertions(+), 13 deletions(-)

(limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.html')

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 bf86c46ea..ac02c50e2 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
@@ -1,20 +1,20 @@
 <div class="import-container-all">
     <div class="import-container">
         <div class="import-container-input">
-            <input placeholder="Enter file URL" type="input" class="ng-pristine ng-valid ng-touched">
-            <a class="enter-link" href="#"><i class="icon-enter"></i></a>
+            <input placeholder="Enter file URL then ENTER" type="input" class="ng-pristine ng-valid ng-touched">
+            <a class="enter-link" href="#"><i class="icon-enter-link"></i></a>
         </div>
         <span class="import-container-span">Or you can also <a href="#" data-toggle="modal"
-                (click)="resetTheUploadedFiles()" data-target="#importModal">Import File</a></span>
+                (click)="resetTheUploadedFiles()" data-target="#importModal"><b>Import File</b></a></span>
 
     </div>
 
     <div class="accordion">
-        <div class="card creat-card">
+        <!-- <div class="card creat-card">
             <div class="single-line">
                 <label class="label-name">File</label>
             </div>
-        </div>
+        </div> -->
         <div id="accordion" *ngFor="let file of definitionFiles | keyvalue; let mapIndex = index">
             <!-- <div class="card">
                 <div class="card-header" [id]="file.key">
@@ -23,7 +23,7 @@
                             aria-expanded="true" aria-controls="collapseOne">
                             <i class="icon-file-code"></i> Definitions/{{file.key}}
                         </button>
-                        <a class="accordion-delete" href="#"><i class="icon-delete"></i></a>
+                        <a class="accordion-delete" href="#"><i class="icon-delete-sm"></i></a>
                     </h5>
                 </div>
 
@@ -41,7 +41,33 @@
                             (click)="changeDivShow(mapIndex)" >
                             <i class="icon-file-code"></i> {{file.key}}
                         </button>
-                        <a class="accordion-delete" (click)="removeFile(mapIndex)"><i class="icon-delete"></i></a>
+                        
+                        <a data-toggle="modal" data-target="#exampleModal" class="accordion-delete"><i
+                            class="icon-delete-sm"></i></a>
+    
+                    <!-- <a class="accordion-delete" (click)="removeFile(mapIndex)"><i class="icon-delete-sm"></i></a> -->
+                    <!-- Delete Modal -->
+                    <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog"
+                        aria-labelledby="exampleModalLabel" aria-hidden="true">
+                        <div class="modal-dialog" role="document">
+                            <div class="modal-content">
+                                <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>
+                                    </button>
+                                </div>
+                                <div class="modal-body">
+                                    <p>Are you sure you want to delete file <span>artifact_types.json</span>?</p>
+                                </div>
+                                <div class="modal-footer">
+                                    <button type="button" class="btn btn-secondary"
+                                        data-dismiss="modal">Cancel</button>
+                                    <button type="button" class="btn btn-primary">Delete</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                     </h5>
                 </div>
                 <div [id]="'id-'+mapIndex" class="collapse" [attr.aria-labelledby]="'head-'+mapIndex"
@@ -54,7 +80,6 @@
                     </div>
                 </div>
             </div>
-
             <!--
                <div class="card">
                    <div class="card-header" id="headingThree">
@@ -78,7 +103,6 @@
                    </div>
                </div>
            -->
-
         </div>
     </div>
 
@@ -91,7 +115,8 @@
             <div class="modal-header">
                 <h5 class="modal-title" id="importModalLabel">Import File</h5>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
+                    <!-- <span aria-hidden="true">&times;</span> -->
+                    <img src="assets/img/icon-close.svg" />
                 </button>
             </div>
             <div class="modal-body">
@@ -112,11 +137,13 @@
                         <div class="folder-upload-type">Allowed file type: json</div>
                     </ng-template>
                 </ngx-file-drop>
-                <div class="upload-table" *ngFor="let item of uploadedFiles; let i=index">
+                <div class="upload-table">
                     <table class="table">
                         <thead>
-                            <tr>
-                                <th>Name : {{ item.name }}</th>
+                            <tr *ngFor="let item of uploadedFiles; let i=index">
+                                <th width="40"><img src="assets/img/icon-file-code.svg" /></th>
+                                <th>{{ item.name }}</th>
+                                <th width="40" class="text-right"><img src="assets/img/icon-remove-file.svg" /></th>
                             </tr>
                         </thead>
                     </table>
-- 
cgit 1.2.3-korg