fix comments

libs/ui/src/lib/value/value.component.html

@@ -11,8 +11,13 @@
   </ng-template>
   <ng-template #copyIcon>
     @if (enableCopyToClipboardButton) {
-      <a class="cursor-pointer mdc-copy" (click)="onCopyValueToClipboard()">
+      <a
-        <ion-icon class="ml-1 icon-small" name="copy-outline" role="img" />
+        class="bg-transparent no-min-width"
+        mat-icon-button
+        type="button"
+        (click)="onCopyValueToClipboard()"
+      >
+        <ion-icon class="ml-1 icon-small" name="copy-outline" />
       </a>
     }
   </ng-template>

libs/ui/src/lib/value/value.component.scss

@@ -7,8 +7,4 @@
     font-variant-numeric: initial;
     line-height: 1;
   }
-  .mdc-copy {
-    display: inline-flex;
-    vertical-align: middle;
-  }
 }

libs/ui/src/lib/value/value.component.ts

@@ -80,15 +80,6 @@ export class GfValueComponent implements AfterViewInit, OnChanges {
     return precision !== undefined && precision >= 0;
   }
 
-  private initializeVariables() {
-    this.absoluteValue = 0;
-    this.formattedValue = '';
-    this.isNumber = false;
-    this.isString = false;
-    this.locale = this.locale || getLocale();
-    this.useAbsoluteValue = false;
-  }
-
   public ngAfterViewInit() {
     const el = this.labelContent.nativeElement;
     this.hasLabel = el.textContent.trim().length > 0 || el.children.length > 0;
@@ -173,19 +164,22 @@ export class GfValueComponent implements AfterViewInit, OnChanges {
   }
 
   public onCopyValueToClipboard() {
-    if (this.value || this.value === 0) {
+    this.clipboard.copy(this.formattedValue);
-      this.clipboard.copy(this.formattedValue);
+    this.snackBar.open(
-      this.snackBar.open(
+      '✅ ' + $localize`Value has been copied to the clipboard`,
-        '✅ ' + $localize`Value has been copied to the clipboard`,
+      undefined,
-        undefined,
+      {
-        {
-          duration: ms('3 seconds')
-        }
-      );
-    } else {
-      this.snackBar.open($localize`Value is empty`, undefined, {
         duration: ms('3 seconds')
-      });
+      }
-    }
+    );
+  }
+
+  private initializeVariables() {
+    this.absoluteValue = 0;
+    this.formattedValue = '';
+    this.isNumber = false;
+    this.isString = false;
+    this.locale = this.locale || getLocale();
+    this.useAbsoluteValue = false;
   }
 }