From 4b137c86e392e67359df96f92a3f04c04cde5dc9 Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sat, 2 May 2026 18:19:59 +0200
Subject: [PATCH] Harmonize unit styling

---
 libs/ui/src/lib/value/value.component.html | 52 +++++++---------------
 1 file changed, 15 insertions(+), 37 deletions(-)

diff --git a/libs/ui/src/lib/value/value.component.html b/libs/ui/src/lib/value/value.component.html
index c4d6532a7..48e9c02e7 100644
--- a/libs/ui/src/lib/value/value.component.html
+++ b/libs/ui/src/lib/value/value.component.html
@@ -38,45 +38,23 @@
             <div class="mr-1 text-danger">-</div>
           }
         }
-        @if (isPercent) {
-          <div
-            class="mb-0 value"
-            [ngClass]="{
-              'font-weight-bold h2': size === 'large',
-              h4: size === 'medium'
-            }"
-          >
-            @if (value === null) {
-              <span class="text-monospace text-muted">*****</span>%
-            } @else {
-              {{ formattedValue }}%
-            }
-          </div>
-        } @else {
-          <div
-            class="mb-0 value"
-            [ngClass]="{
-              'font-weight-bold h2': size === 'large',
-              h4: size === 'medium'
-            }"
-          >
-            @if (value === null) {
-              <span class="text-monospace text-muted">*****</span>
-            } @else {
-              {{ formattedValue }}
-            }
-          </div>
-        }
-        @if (unit) {
-          @if (size === 'medium') {
-            <small class="ml-1">
-              {{ unit }}
-            </small>
+        <div
+          class="mb-0 value"
+          [ngClass]="{
+            'font-weight-bold h2': size === 'large',
+            h4: size === 'medium'
+          }"
+        >
+          @if (value === null) {
+            <span class="text-monospace text-muted">*****</span>
           } @else {
-            <div class="ml-1">
-              {{ unit }}
-            </div>
+            {{ formattedValue }}
           }
+        </div>
+        @if (isPercent || unit) {
+          <div class="ml-1">
+            {{ isPercent ? '%' : unit }}
+          </div>
         }
       }
       @if (isString) {