add ellipsis at the end of name

Author: LanThuyNguyen

packages/uui-card-user/lib/uui-card-user.element.ts

@@ -76,7 +76,7 @@ export class UUICardUserElement extends UUICardElement {
         name="avatar"
         class="avatar"
         @slotchange=${this._avatarSlotChanged}></slot>
-      <span>${this.name}</span>
+      <span title="${this.name}">${this.name}</span>
       <slot></slot>
     </div>`;
   }
@@ -163,6 +163,11 @@ export class UUICardUserElement extends UUICardElement {
       }
 
       #content > span {
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        text-overflow: ellipsis;
         vertical-align: center;
         margin-top: 3px;
         font-weight: 700;