LP#1837802: (follow-up) convert ngbTabset to ngbNav

Also add a bit of top margin for a couple of the tab's
contents.

Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>

diff --git a/Open-ILS/src/eg2/src/app/staff/share/buckets/bucket-dialog.component.html b/Open-ILS/src/eg2/src/app/staff/share/buckets/bucket-dialog.component.html
index 5c33108..e02520d 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/share/buckets/bucket-dialog.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/share/buckets/bucket-dialog.component.html
@@ -15,10 +15,11 @@
     </button>
   </div>
   <div class="modal-body">
-    <ngb-tabset>
-      <ngb-tab title="Existing bucket" i18n-title>
-        <ng-template ngbTabContent>
-          <div class="row">
+    <ul ngbNav #bucketDialogTabs="ngbNav" class="nav-tabs">
+      <li [ngbNavItem]="1">
+        <a ngbNavLink i18n>Existing bucket</a>
+        <ng-template ngbNavContent>
+          <div class="row mt-3">
             <div class="col-lg-3 font-weight-bold" i18n>Name of existing bucket</div>
             <div class="col-lg-5">
               <eg-combobox [entries]="formatBucketEntries()"
@@ -34,9 +35,10 @@
             </div>
           </div>
         </ng-template>
-      </ngb-tab>
-      <ngb-tab title="New bucket" i18n-title>
-        <ng-template ngbTabContent>
+      </li>
+      <li [ngbNavItem]="2">
+        <a ngbNavLink i18n>New bucket</a>
+        <ng-template ngbNavContent>
           <div class="row mt-3">
             <div class="col-lg-3 font-weight-bold" i18n>Name of new bucket</div>
             <div class="col-lg-5">
@@ -63,10 +65,11 @@
             </div>
           </div>
         </ng-template>
-      </ngb-tab>
-      <ngb-tab title="Shared bucket" i18n-title>
-        <ng-template ngbTabContent>
-          <div class="row">
+      </li>
+      <li [ngbNavItem]="3">
+        <a ngbNavLink i18n>Shared bucket</a>
+        <ng-template ngbNavContent>
+          <div class="row mt-3">
             <div class="col-lg-3 font-weight-bold" i18n>ID of shared bucket</div>
             <div class="col-lg-5">
               <input type="number" class="form-control"
@@ -80,8 +83,9 @@
             </div>
           </div>
         </ng-template>
-      </ngb-tab>
-    </ngb-tabset>
+      </li>
+    </ul>
+    <div [ngbNavOutlet]="bucketDialogTabs"></div>
   </div>
 </ng-template>
 <eg-confirm-dialog #confirmAddToShared