From 6c7892559f9553f974e14c5da201c0400312c98a Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 16 Jan 2024 17:00:26 -0800
Subject: [PATCH] More cleanup

---
 src-ui/src/app/app.module.ts                  |  4 +
 .../filterable-dropdown.component.scss        |  4 -
 .../common/input/check/check.component.html   |  2 +-
 .../common/input/date/date.component.html     |  2 +-
 .../document-link.component.html              | 82 +++++++++----------
 .../common/input/file/file.component.html     |  4 +-
 .../common/input/number/number.component.html |  2 +-
 .../common/input/switch/switch.component.html |  2 +-
 .../common/input/text/text.component.html     |  2 +-
 .../common/input/url/url.component.html       | 32 ++++----
 .../preview-popup.component.html              |  2 +-
 .../share-links-dropdown.component.html       |  2 +-
 .../common/toasts/toasts.component.html       |  8 +-
 13 files changed, 74 insertions(+), 74 deletions(-)

diff --git a/src-ui/src/app/app.module.ts b/src-ui/src/app/app.module.ts
index d9a2ea28f..6d39bfecf 100644
--- a/src-ui/src/app/app.module.ts
+++ b/src-ui/src/app/app.module.ts
@@ -136,6 +136,7 @@ import {
   checkLg,
   chevronDoubleLeft,
   chevronDoubleRight,
+  clipboard,
   clipboardCheckFill,
   clipboardFill,
   dash,
@@ -149,6 +150,7 @@ import {
   fileEarmark,
   fileEarmarkCheck,
   fileEarmarkFill,
+  fileEarmarkLock,
   files,
   fileText,
   filter,
@@ -218,6 +220,7 @@ const icons = {
   checkLg,
   chevronDoubleLeft,
   chevronDoubleRight,
+  clipboard,
   clipboardCheckFill,
   clipboardFill,
   dash,
@@ -231,6 +234,7 @@ const icons = {
   fileEarmark,
   fileEarmarkCheck,
   fileEarmarkFill,
+  fileEarmarkLock,
   files,
   fileText,
   filter,
diff --git a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.scss b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.scss
index 9db366f96..f993e7edf 100644
--- a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.scss
+++ b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.scss
@@ -25,10 +25,6 @@
   }
 }
 
-small > i-bs {
-  margin-top: -2px;
-}
-
 .list-group-item-note {
   line-height: 1;
 
diff --git a/src-ui/src/app/components/common/input/check/check.component.html b/src-ui/src/app/components/common/input/check/check.component.html
index 889f2ee1e..3ad6d8133 100644
--- a/src-ui/src/app/components/common/input/check/check.component.html
+++ b/src-ui/src/app/components/common/input/check/check.component.html
@@ -5,7 +5,7 @@
         <label class="form-label" [class.mb-md-0]="horizontal" [for]="inputId">{{title}}</label>
         @if (removable) {
           <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-            <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+            <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
             </button>
           }
         </div>
diff --git a/src-ui/src/app/components/common/input/date/date.component.html b/src-ui/src/app/components/common/input/date/date.component.html
index 2d88b2861..8f386e2c8 100644
--- a/src-ui/src/app/components/common/input/date/date.component.html
+++ b/src-ui/src/app/components/common/input/date/date.component.html
@@ -4,7 +4,7 @@
       <label class="form-label" [class.mb-md-0]="horizontal" [for]="inputId">{{title}}</label>
       @if (removable) {
         <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-          <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+          <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
           </button>
         }
       </div>
diff --git a/src-ui/src/app/components/common/input/document-link/document-link.component.html b/src-ui/src/app/components/common/input/document-link/document-link.component.html
index 1c4b5fdde..fc4726a55 100644
--- a/src-ui/src/app/components/common/input/document-link/document-link.component.html
+++ b/src-ui/src/app/components/common/input/document-link/document-link.component.html
@@ -6,45 +6,45 @@
       }
       @if (removable) {
         <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-          <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
-          </button>
-        }
-      </div>
-      <div [class.col-md-9]="horizontal">
-        <div>
-          <ng-select name="inputId" [(ngModel)]="selectedDocuments"
-            [disabled]="disabled"
-            [items]="foundDocuments$ | async"
-            placeholder="Search for documents"
-            [notFoundText]="notFoundText"
-            [multiple]="true"
-            bindValue="id"
-            [compareWith]="compareDocuments"
-            [trackByFn]="trackByFn"
-            [minTermLength]="2"
-            [loading]="loading"
-            [typeahead]="documentsInput$"
-            (change)="onChange(selectedDocuments)">
-            <ng-template ng-label-tmp let-document="item">
-              <div class="d-flex align-items-center">
-                <i-bs  (click)="unselect(document)" name="x"></i-bs>
-                <a routerLink="/documents/{{document.id}}" class="badge bg-light text-primary" (mousedown)="$event.stopImmediatePropagation();">
-                  <i-bs width="0.9em" height="0.9em" name="file-text"></i-bs><span>{{document.title}}</span>
-                  </a>
-                </div>
-              </ng-template>
-              <ng-template ng-loadingspinner-tmp>
-                <div class="spinner-border spinner-border-sm fw-normal ms-2 me-auto" role="status"></div>
-                <div class="visually-hidden" i18n>Loading...</div>
-              </ng-template>
-              <ng-template ng-option-tmp let-document="item" let-index="index" let-search="searchTerm">
-                <div>{{document.title}} <small class="text-muted">({{document.created | customDate:'shortDate'}})</small></div>
-              </ng-template>
-            </ng-select>
-          </div>
-          @if (hint) {
-            <small class="form-text text-muted">{{hint}}</small>
-          }
-        </div>
-      </div>
+          <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+        </button>
+      }
     </div>
+    <div [class.col-md-9]="horizontal">
+      <div>
+        <ng-select name="inputId" [(ngModel)]="selectedDocuments"
+          [disabled]="disabled"
+          [items]="foundDocuments$ | async"
+          placeholder="Search for documents"
+          [notFoundText]="notFoundText"
+          [multiple]="true"
+          bindValue="id"
+          [compareWith]="compareDocuments"
+          [trackByFn]="trackByFn"
+          [minTermLength]="2"
+          [loading]="loading"
+          [typeahead]="documentsInput$"
+          (change)="onChange(selectedDocuments)">
+          <ng-template ng-label-tmp let-document="item">
+            <div class="d-flex align-items-center">
+              <i-bs (click)="unselect(document)" name="x"></i-bs>
+              <a routerLink="/documents/{{document.id}}" class="badge bg-light text-primary" (mousedown)="$event.stopImmediatePropagation();">
+                <i-bs width="0.9em" height="0.9em" name="file-text"></i-bs>&nbsp;<span>{{document.title}}</span>
+              </a>
+            </div>
+          </ng-template>
+          <ng-template ng-loadingspinner-tmp>
+            <div class="spinner-border spinner-border-sm fw-normal ms-2 me-auto" role="status"></div>
+            <div class="visually-hidden" i18n>Loading...</div>
+          </ng-template>
+          <ng-template ng-option-tmp let-document="item" let-index="index" let-search="searchTerm">
+            <div>{{document.title}} <small class="text-muted">({{document.created | customDate:'shortDate'}})</small></div>
+          </ng-template>
+        </ng-select>
+      </div>
+      @if (hint) {
+        <small class="form-text text-muted">{{hint}}</small>
+      }
+    </div>
+  </div>
+</div>
diff --git a/src-ui/src/app/components/common/input/file/file.component.html b/src-ui/src/app/components/common/input/file/file.component.html
index 85ee062ef..4e780781c 100644
--- a/src-ui/src/app/components/common/input/file/file.component.html
+++ b/src-ui/src/app/components/common/input/file/file.component.html
@@ -6,7 +6,7 @@
         }
         @if (removable) {
           <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-            <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+            <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
             </button>
           }
         </div>
@@ -18,7 +18,7 @@
             <div class="form-text d-flex align-items-center">
               <span class="text-muted">{{filename}}</span>
               <button type="button" class="btn btn-link btn-sm text-danger ms-2" (click)="clear()">
-                <i-bs  name="x"></i-bs><small class="ms-1" i18n>Remove</small>
+                <i-bs name="x"></i-bs><small i18n>Remove</small>
               </button>
             </div>
         }
diff --git a/src-ui/src/app/components/common/input/number/number.component.html b/src-ui/src/app/components/common/input/number/number.component.html
index 2c775fafa..c3d435ffa 100644
--- a/src-ui/src/app/components/common/input/number/number.component.html
+++ b/src-ui/src/app/components/common/input/number/number.component.html
@@ -6,7 +6,7 @@
       }
       @if (removable) {
         <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-          <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+          <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
           </button>
         }
       </div>
diff --git a/src-ui/src/app/components/common/input/switch/switch.component.html b/src-ui/src/app/components/common/input/switch/switch.component.html
index ca3bd5939..489106fcb 100644
--- a/src-ui/src/app/components/common/input/switch/switch.component.html
+++ b/src-ui/src/app/components/common/input/switch/switch.component.html
@@ -22,7 +22,7 @@
           <label class="form-check-label" [class.text-muted]="showUnsetNote && isUnset" [for]="inputId" [ngbTooltip]="showUnsetNote && isUnset ? tipContent: null" placement="end">
             {{title}}
             @if (showUnsetNote && isUnset) {
-              <i-bs width="0.9em" height="0.9em" name="exclamation-triangle"></i-bs>
+              &nbsp;<i-bs width="0.9em" height="0.9em" name="exclamation-triangle"></i-bs>
             }
           </label>
         }
diff --git a/src-ui/src/app/components/common/input/text/text.component.html b/src-ui/src/app/components/common/input/text/text.component.html
index 0b9177ced..b46ab23b7 100644
--- a/src-ui/src/app/components/common/input/text/text.component.html
+++ b/src-ui/src/app/components/common/input/text/text.component.html
@@ -6,7 +6,7 @@
       }
       @if (removable) {
         <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-          <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+          <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
           </button>
         }
       </div>
diff --git a/src-ui/src/app/components/common/input/url/url.component.html b/src-ui/src/app/components/common/input/url/url.component.html
index 0af47bb69..0885b3786 100644
--- a/src-ui/src/app/components/common/input/url/url.component.html
+++ b/src-ui/src/app/components/common/input/url/url.component.html
@@ -4,23 +4,23 @@
       <label class="form-label" [class.mb-md-0]="horizontal" [for]="inputId">{{title}}</label>
       @if (removable) {
         <button type="button" class="btn btn-sm btn-danger position-absolute left-0" (click)="removed.emit(this)">
-          <i-bs  name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
-          </button>
-        }
-      </div>
-      <div [class.col-md-9]="horizontal">
-        <div class="input-group" [class.is-invalid]="error">
-          <input #inputField type="url" class="form-control" [class.is-invalid]="error" placeholder="https://" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)" [disabled]="disabled">
-          <a class="btn btn-outline-secondary rounded-end" title="Open link" i18n-title [href]="value" target="_blank">
-            <i-bs width="1.2em" height="1.2em" name="box-arrow-up-right"></i-bs>
-          </a>
-          <div class="invalid-feedback position-absolute top-100">
-            {{error}}
-          </div>
+          <i-bs name="x"></i-bs>&nbsp;<ng-container i18n>Remove</ng-container>
+        </button>
+      }
+    </div>
+    <div [class.col-md-9]="horizontal">
+      <div class="input-group" [class.is-invalid]="error">
+        <input #inputField type="url" class="form-control" [class.is-invalid]="error" placeholder="https://" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)" [disabled]="disabled">
+        <a class="btn btn-outline-secondary rounded-end" title="Open link" i18n-title [href]="value" target="_blank">
+          <i-bs width="1.2em" height="1.2em" name="box-arrow-up-right"></i-bs>
+        </a>
+        <div class="invalid-feedback position-absolute top-100">
+          {{error}}
         </div>
-        @if (hint) {
-          <small class="form-text text-muted" [innerHTML]="hint | safeHtml"></small>
-        }
       </div>
+      @if (hint) {
+        <small class="form-text text-muted" [innerHTML]="hint | safeHtml"></small>
+      }
     </div>
   </div>
+</div>
diff --git a/src-ui/src/app/components/common/preview-popup/preview-popup.component.html b/src-ui/src/app/components/common/preview-popup/preview-popup.component.html
index 4f6b2b720..124d13af8 100644
--- a/src-ui/src/app/components/common/preview-popup/preview-popup.component.html
+++ b/src-ui/src/app/components/common/preview-popup/preview-popup.component.html
@@ -9,7 +9,7 @@
     } @else {
       @if (requiresPassword) {
         <div class="w-100 h-100 position-relative">
-          <i-bs name="file-earmark-lock"></i-bs>
+          <i-bs width="2em" height="2em" class="position-absolute top-50 start-50 translate-middle" name="file-earmark-lock"></i-bs>
         </div>
       }
       @if (!requiresPassword) {
diff --git a/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.html b/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.html
index 9d3b01d74..08298abc7 100644
--- a/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.html
+++ b/src-ui/src/app/components/common/share-links-dropdown/share-links-dropdown.component.html
@@ -59,7 +59,7 @@
                     <div class="spinner-border spinner-border-sm me-2" role="status"></div>
                   }
                   @if (!loading) {
-                    <i-bs width="1.2em" height="1.2em" name="plus"></i-bs>
+                    <i-bs name="plus"></i-bs>
                   }
                   <ng-container i18n>Create</ng-container>
                 </button>
diff --git a/src-ui/src/app/components/common/toasts/toasts.component.html b/src-ui/src/app/components/common/toasts/toasts.component.html
index 90c39646b..6ec19f0d9 100644
--- a/src-ui/src/app/components/common/toasts/toasts.component.html
+++ b/src-ui/src/app/components/common/toasts/toasts.component.html
@@ -15,7 +15,7 @@
         <i-bs width="0.9em" height="0.9em" name="exclamation-triangle"></i-bs>
       }
       <div>
-        <p class="mb-0">{{toast.content}}</p>
+        <p class="ms-2 mb-0">{{toast.content}}</p>
         @if (toast.error) {
           <details>
             <div class="mt-2">
@@ -33,12 +33,12 @@
                 <div class="col offset-sm-3">
                   <button class="btn btn-sm btn-outline-dark" (click)="copyError(toast.error)">
                     @if (!copied) {
-                      <i-bs  name="clipboard"></i-bs>
+                      <i-bs name="clipboard"></i-bs>&nbsp;
                     }
                     @if (copied) {
-                      <i-bs  name="clipboard-check"></i-bs>
+                      <i-bs name="clipboard-check"></i-bs>&nbsp;
                     }
-                    >&nbsp;<ng-container i18n>Copy Raw Error</ng-container>
+                    <ng-container i18n>Copy Raw Error</ng-container>
                   </button>
                 </div>
               </div>