feat: dark style

Author: meta-d

libs/component-angular/property/calculation/calculation-editor/calculation-editor.component.html

@@ -1,4 +1,4 @@
-<div class="ngm-theme-dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
+<div class="ngm-theme-dark dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
     <div class="w-full flex justify-start items-center mb-2" cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
       <mat-icon displayDensity="cosy" class="-ml-2 opacity-0 group-hover:opacity-80">drag_indicator</mat-icon>
       <span class="text-lg pointer-events-none">

libs/component-angular/property/property-select/property-select.component.html

@@ -71,9 +71,9 @@
           (click)="$event.stopPropagation();$event.preventDefault();">
           <button mat-button color="primary" ngmAppearance="dashed" class="ngm-property-select__create-calculation w-full"
             (click)="$event.stopPropagation();onCreateCalculation($event)">
-            <div class="flex justify-center items-center">
+            <div class="flex justify-center items-center whitespace-nowrap text-ellipsis overflow-hidden">
               <mat-icon>add</mat-icon>
-              {{ 'COMPONENTS.PROPERTY.CREATE_CALCULATION' | translate: {Default: 'Create Calculation'} }}
+              <span>{{ 'COMPONENTS.PROPERTY.CREATE_CALCULATION' | translate: {Default: 'Create Calculation'} }}</span>
             </div>
           </button>
         </mat-option>

libs/story-angular/src/lib/settings/parameters/parameters.component.html

@@ -1,4 +1,4 @@
-<div class="ngm-theme-dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
+<div class="ngm-theme-dark dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
   <div class="w-full flex justify-start items-center my-2" cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-icon displayDensity="cosy" class="-ml-2 opacity-0 group-hover:opacity-80">drag_indicator</mat-icon>
     <span class="text-lg pointer-events-none">

libs/story-angular/src/lib/settings/preferences/preferences.component.html

@@ -1,4 +1,4 @@
-<div class="ngm-theme-dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
+<div class="ngm-theme-dark dark w-[300px] shrink-0 flex flex-col justify-start overflow-auto bg-bluegray-700 text-white p-4 group">
   <div class="w-full flex justify-start items-center my-2" cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-icon displayDensity="cosy" class="-ml-2 opacity-0 group-hover:opacity-80">drag_indicator</mat-icon>
     <span class="text-lg pointer-events-none">