diff --git a/package-lock.json b/package-lock.json
index 711c57e8c015386373841d584435c95ecfbba301..881bbd7d22250d24f4cdf5c3671970fb53146521 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4,6 +4,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "verona-modules-aspect",
       "dependencies": {
         "@angular/animations": "~12.2.7",
         "@angular/cdk": "^12.2.6",
diff --git a/projects/common/element-components/slider.component.ts b/projects/common/element-components/slider.component.ts
index b40926916f3266b7117699ad1359d60c7c1b1126..75f78022f9e03c40f212f6acc50882494ab0513f 100644
--- a/projects/common/element-components/slider.component.ts
+++ b/projects/common/element-components/slider.component.ts
@@ -1,8 +1,7 @@
-import {Component, ElementRef, EventEmitter, OnInit, Output, ViewChild} from '@angular/core';
-import { ElementComponent } from '../element-component.directive';
+import { Component } from '@angular/core';
+import { ValidatorFn, Validators } from '@angular/forms';
 import { SliderElement } from '../models/slider-element';
 import { FormElementComponent } from '../form-element-component.directive';
-import {ValidatorFn, Validators} from "@angular/forms";
 
 @Component({
   selector: 'app-slider',
@@ -19,7 +18,9 @@ import {ValidatorFn, Validators} from "@angular/forms";
            [style.line-height.%]="elementModel.lineHeight"
            [style.font-weight]="elementModel.bold ? 'bold' : ''"
            [style.font-style]="elementModel.italic ? 'italic' : ''"
-           [style.text-decoration]="elementModel.underline ? 'underline' : ''">{{elementModel.minValue | number:'.0'}}</div>
+           [style.text-decoration]="elementModel.underline ? 'underline' : ''">
+        {{elementModel.minValue | number:'.0'}}
+      </div>
       <div [style.display]="'flex'"
            [style.flex-direction]="'column'"
            [style.width.%]="100"
@@ -55,7 +56,6 @@ import {ValidatorFn, Validators} from "@angular/forms";
 export class SliderComponent extends FormElementComponent {
   elementModel!: SliderElement;
   // todo: ?? setting disabled attribute of slider may cause 'changed after checked' error
-  // todo: localize 'number' pipe to show '.' instead of ',' by values greater then 999
 
   get validators(): ValidatorFn[] {
     const validators: ValidatorFn[] = [];
diff --git a/projects/common/models/slider-element.ts b/projects/common/models/slider-element.ts
index 554e7dfca4e8dc0ba5d218a28fed30944c184f56..728f9bb5375f73b12fdc731676d0a680dfdbbc70 100644
--- a/projects/common/models/slider-element.ts
+++ b/projects/common/models/slider-element.ts
@@ -1,6 +1,8 @@
-import {FontElement, SurfaceUIElement} from '../interfaces/UIElementInterfaces';
-import { InputElement, UIElement} from './uI-element';
-import {initFontElement, initSurfaceElement} from '../util/unit-interface-initializer';
+import localeDe from '@angular/common/locales/de';
+import { registerLocaleData } from '@angular/common';
+import { FontElement, SurfaceUIElement } from '../interfaces/UIElementInterfaces';
+import { InputElement, UIElement } from './uI-element';
+import { initFontElement, initSurfaceElement } from '../util/unit-interface-initializer';
 
 export class SliderElement extends InputElement implements FontElement, SurfaceUIElement {
   minValue: number = 0;
@@ -19,6 +21,7 @@ export class SliderElement extends InputElement implements FontElement, SurfaceU
 
   constructor(serializedElement: UIElement) {
     super(serializedElement);
+    registerLocaleData(localeDe);
     Object.assign(this, serializedElement);
     Object.assign(this, initFontElement(serializedElement));
     if (!serializedElement.backgroundColor) {
@@ -27,5 +30,4 @@ export class SliderElement extends InputElement implements FontElement, SurfaceU
     Object.assign(this, initSurfaceElement(serializedElement));
     // todo: delete this.label --> label must be declared as optional
   }
-
 }
diff --git a/projects/common/shared.module.ts b/projects/common/shared.module.ts
index a5c2d985c0f25b2337ff73153bd024186c663a62..b89b63e4481b90b1d2913d867dca7bff3c1a35cf 100644
--- a/projects/common/shared.module.ts
+++ b/projects/common/shared.module.ts
@@ -1,4 +1,4 @@
-import { NgModule } from '@angular/core';
+import { LOCALE_ID, NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 import { MatButtonModule } from '@angular/material/button';
@@ -40,11 +40,11 @@ import { SafeResourceHTMLPipe } from './element-components/pipes/safe-resource-h
 import { ControlBarComponent } from './element-components/control-bar/control-bar.component';
 import { PlayerTimeFormatPipe } from './element-components/control-bar/player-time-format.pipe';
 import { LikertComponent } from './element-components/compound-elements/likert.component';
-import { LikertRadioButtonGroupComponent } from './element-components/compound-elements/likert-radio-button-group.component';
+import { LikertRadioButtonGroupComponent }
+  from './element-components/compound-elements/likert-radio-button-group.component';
 import { Magnifier } from './element-components/magnifier.component';
 import { RadioGroupImagesComponent } from './element-components/compound-elements/radio-group-images.component';
 import { DropListComponent } from './element-components/compound-elements/drop-list.component';
-import { MAT_DATE_LOCALE } from '@angular/material/core';
 
 @NgModule({
   imports: [
@@ -89,7 +89,6 @@ import { MAT_DATE_LOCALE } from '@angular/material/core';
     DropListComponent
   ],
   exports: [
-    CommonModule,
     FlexLayoutModule,
     MatToolbarModule,
     MatIconModule,
@@ -125,7 +124,7 @@ import { MAT_DATE_LOCALE } from '@angular/material/core';
   ],
   providers:
     [
-      { provide: MAT_DATE_LOCALE, useValue: 'de-DE' }
+      { provide: LOCALE_ID, useValue: 'de-DE' }
     ]
 })
 export class SharedModule { }