style(Webfinger): list item

Fraunhofer-AISEC · Sep 27, 2024 · aea4f3d · aea4f3d
1 parent 23e2818
commit aea4f3d
Showing 1 changed file with 14 additions and 14 deletions.
diff --git a/src/app/components/webfinger/webfinger.component.html b/src/app/components/webfinger/webfinger.component.html
@@ -1,31 +1,31 @@
-<div *ngIf="webfingerConfig">
-    <div class="card mb-2" *ngFor="let mail of getMailKeys()">
+<div *ngIf="webfingerConfig" class="page-content-detail px-0">
+    <div class="card custom-card-client-detail my-2 px-0" *ngFor="let mail of getMailKeys()">
         <div class="card-header">
             {{mail}}
-            <button class="btn btn-delete-complex-attribute float-end" (click)="deleteEntry(mail)">
-                <span class="fa fa-trash"></span>
+            <button class="btn btn-delete-complex-attribute float-end btn-trash-circle" (click)="deleteEntry(mail)">
+                <img alt="trash" src="assets/img/trash-icon.svg" />
             </button>
         </div>
         <div class="card-body">
             <div class="input-group" *ngFor="let detail of getDetailKeys(mail)">
                 <span class="input-group-text" id="client_id">{{detail}}</span>
                 <input type="text" class="form-control" placeholder="value" name="detail-value"
                     [(ngModel)]="webfingerConfig[mail][detail]">
-                <button class="btn btn-outline-secondary" type="button" (click)="deleteDetail(mail, detail)">
-                    <span class="fa fa-trash"></span>
+                <button class="btn btn-outline-secondary btn-trash-circle" type="button" (click)="deleteDetail(mail, detail)">
+                    <img alt="trash" src="assets/img/trash-icon.svg" />
                 </button>
             </div>
             <div class="input-group mt-2">
-                <span class="input-group-text" id="client_id">Add detail</span>
+                <!-- <span class="input-group-text" id="client_id">Add detail</span> -->
                 <input type="text" class="form-control" placeholder="value" name="detail-value" [(ngModel)]="newDetail[mail]">
-                <button class="btn btn-outline-secondary" type="button" (click)="addDetail(mail)">
-                    <span class="fa fa-plus"></span>
-                </button>
+                    <button class="btn btn-link" style="text-decoration: none; text-align: right; padding-right: 0px; min-width: 70px" type="button" (click)="addDetail(mail)">
+                        + Add
+                    </button>
             </div>
         </div>
     </div>
 </div>
-<div class="card mb-2">
+<div class="card custom-card-client-detail bg-surface-secondary">
     <div class="card-header">
         <i>New Entry</i>
     </div>
@@ -34,7 +34,7 @@
     </div>
 </div>
 
-<div class="clearfix mt-5">
-    <button type="submit" class="btn btn-primary btn-save-and-cancel float-left me-5" (click)="saveChanges()">Save</button>
-    <a href="./#" class="btn btn-primary btn-save-and-cancel float-left">Cancel</a>
+<div class="clearfix mt-5  d-flex justify-content-end pr-0">
+    <a href="./#" class="btn btn-outline-primary border-0 btn-save-and-cancel float-right btn-lg d-flex justify-content-center align-items-center">Cancel</a>
+    <button type="submit" class="btn btn-primary btn-save-and-cancel float-left btn-lg" (click)="saveChanges()">Save</button>
 </div>