Fix: fix long tag visual wrapping (#8833)

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 d5d5c4a7d57fac840d526e9c8028a0e1bb129dd4..23c680dd0b0324f1e96b7cc8fd115aab5ec388aa 100644 (file)
--- 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,7 +17,7 @@
           (change)="onChange(value)">
 
           <ng-template ng-label-tmp let-item="item">
-            <button class="tag-wrap btn p-0" (click)="removeTag($event, item.id)" title="Remove tag" i18n-title>
+            <button class="tag-wrap btn p-0 d-flex align-items-center" (click)="removeTag($event, item.id)" title="Remove tag" i18n-title>
               <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>

diff --git a/src-ui/src/app/components/common/tag/tag.component.scss b/src-ui/src/app/components/common/tag/tag.component.scss
index 3de7e7f13ceb3f72de42104fe57a2fb6f8d2504c..5dc28b65f2603b7787602844573cb4a222f3de01 100644 (file)
--- a/src-ui/src/app/components/common/tag/tag.component.scss
+++ b/src-ui/src/app/components/common/tag/tag.component.scss
@@ -1,8 +1,8 @@
-a {
+a, span {
     cursor: pointer;
     white-space: normal;
     word-break: break-word;
-    text-align: end;
+    text-align: start;
 }
 
 .private {