styles

src/app/shared/components/overlays/dialog/dialog.component.html

@@ -1 +1,20 @@
-<p>dialog works!</p>
+<div class="dialog-backdrop" *ngIf="isOpen" (click)="onClose()" @fade>
+  <div class="dialog-container card" (click)="$event.stopPropagation()" @slideIn>
+    
+    <div class="dialog-header">
+      <h3 class="dialog-title">{{ title }}</h3>
+      <app-button color="icon" (click)="onClose()" tooltip="Schließen">&times;</app-button>
+    </div>
+
+    <div class="dialog-content">
+      <!-- Der Hauptinhalt des Dialogs wird von außen projiziert -->
+      <ng-content select="[dialog-content]"></ng-content>
+    </div>
+
+    <div class="dialog-actions">
+      <!-- Die Aktions-Buttons werden ebenfalls von außen projiziert -->
+      <ng-content select="[dialog-actions]"></ng-content>
+    </div>
+
+  </div>
+</div>