Refactor value component

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

@@ -43,12 +43,14 @@
       </div>
     </ng-container>
   </div>
-  <div *ngIf="label && size === 'large'">
+  <ng-container *ngIf="label">
-    {{ label }}
+    <div *ngIf="size === 'large'">
-  </div>
+      {{ label }}
-  <small *ngIf="label && size !== 'large'">
+    </div>
-    {{ label }}
+    <small *ngIf="size !== 'large'">
-  </small>
+      {{ label }}
+    </small>
+  </ng-container>
 </ng-container>
 
 <ngx-skeleton-loader

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

@@ -4,7 +4,7 @@ import {
   Input,
   OnChanges
 } from '@angular/core';
-import { DEFAULT_DATE_FORMAT } from '@ghostfolio/common/config';
+import { DEFAULT_DATE_FORMAT, locale } from '@ghostfolio/common/config';
 import { format, isDate, parseISO } from 'date-fns';
 import { isNumber } from 'lodash';
 
@@ -21,7 +21,7 @@ export class ValueComponent implements OnChanges {
   @Input() isCurrency = false;
   @Input() isPercent = false;
   @Input() label = '';
-  @Input() locale = 'en-US';
+  @Input() locale = locale;
   @Input() position = '';
   @Input() precision: number | undefined;
   @Input() size: 'large' | 'medium' | 'small' = 'small';