From 5b2ce2d34f2abbd22508b2aa7bb5c153366889ca Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 20 May 2024 08:56:02 -0700
Subject: [PATCH] Make remove tag interactive element

---
 .../app/components/common/input/tags/tags.component.html    | 6 +++---
 .../app/components/common/input/tags/tags.component.scss    | 4 ----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/src-ui/src/app/components/common/input/tags/tags.component.html b/src-ui/src/app/components/common/input/tags/tags.component.html
index cb8d616b3..9ab4e1ec9 100644
--- a/src-ui/src/app/components/common/input/tags/tags.component.html
+++ b/src-ui/src/app/components/common/input/tags/tags.component.html
@@ -17,12 +17,12 @@
           (change)="onChange(value)">
 
           <ng-template ng-label-tmp let-item="item">
-            <span class="tag-wrap tag-wrap-delete" (mousedown)="removeTag($event, item.id)">
-              <i-bs name="x"></i-bs>
+            <button class="tag-wrap btn p-0" (click)="removeTag($event, item.id)">
+              <i-bs name="x" style="margin-inline-end: 1px;"></i-bs>
               @if (item.id && tags) {
                 <pngx-tag style="background-color: none;" [tag]="getTag(item.id)"></pngx-tag>
               }
-            </span>
+            </button>
           </ng-template>
           <ng-template ng-option-tmp let-item="item" let-index="index" let-search="searchTerm">
             <div class="tag-wrap">
diff --git a/src-ui/src/app/components/common/input/tags/tags.component.scss b/src-ui/src/app/components/common/input/tags/tags.component.scss
index a1d88a3a9..65b8603e0 100644
--- a/src-ui/src/app/components/common/input/tags/tags.component.scss
+++ b/src-ui/src/app/components/common/input/tags/tags.component.scss
@@ -7,10 +7,6 @@
   font-size: 1rem;
 }
 
-.tag-wrap-delete {
-  cursor: pointer;
-}
-
 .paperless-input-select.disabled {
   .input-group {
       cursor: not-allowed;