frontend/src/app/layout/main-layout/layout.component.html

@@ -31,16 +31,14 @@
         <button (click)="toggleCompactMode()" class="btn btn-square btn-ghost">
           <svg
             xmlns="http://www.w3.org/2000/svg"
-            viewBox="0 0 24 24"
             fill="none"
-            stroke="currentColor"
+            viewBox="0 0 24 24"
-            stroke-width="2"
+            class="inline-block w-6 h-6 stroke-current">
-            stroke-linecap="round"
+            <path
-            stroke-linejoin="round"
+              stroke-linecap="round"
-            class="inline-block w-6 h-6">
+              stroke-linejoin="round"
-            <rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
+              stroke-width="2"
-            <line x1="9" y1="3" x2="9" y2="21" />
+              d="M3 3h18v18H3V3z"></path>
-            <path d="M13 8l3 3-3 3" />
           </svg>
         </button>
       </div>
@@ -50,15 +48,6 @@
     <div class="flex-1 flex overflow-hidden">
       <!-- Drawer -->
       <div
-        [@drawerAnimation]="
-          isDrawerOpen
-            ? isCompact
-              ? 'compact'
-              : 'open'
-            : isCompact
-              ? 'compact'
-              : 'closed'
-        "
         class="h-full transition-transform duration-300 ease-in-out bg-primary text-primary-content flex flex-col lg:translate-x-0"
         [ngClass]="{
           'w-16': isCompact && !isDrawerOpen,
@@ -178,18 +167,15 @@
         </aside>
       </div>
 
+      <!-- Backdrop -->
       <!-- Backdrop -->
       <div
-        [@backdropAnimation]="isDrawerOpen && !isCompact ? 'visible' : 'hidden'"
         *ngIf="isDrawerOpen && !isCompact && isMobile"
         class="fixed inset-0 bg-black bg-opacity-50 z-20"
         (click)="toggleDrawer()"></div>
 
       <!-- Hauptinhalt -->
       <div
-        [@mainContentAnimation]="
-          isCompact && !isDrawerOpen ? 'shifted' : 'normal'
-        "
         class="flex-1 overflow-y-auto p-4 bg-base-100"
         [ngClass]="{
           'lg:ml-16': isCompact && !isDrawerOpen,

frontend/src/app/layout/main-layout/layout.component.ts

@@ -76,49 +76,6 @@ interface BottomMenuItem {
       ),
       transition('closed <=> open', [animate('200ms ease-in-out')]),
     ]),
-    trigger('drawerAnimation', [
-      state(
-        'open',
-        style({
-          width: '16rem', // 256px
-        })
-      ),
-      state(
-        'compact',
-        style({
-          width: '4rem', // 64px
-        })
-      ),
-      state(
-        'closed',
-        style({
-          width: '0',
-        })
-      ),
-      transition('closed <=> open', [animate('300ms ease-in-out')]),
-      transition('open <=> compact', [animate('200ms ease-in-out')]),
-      transition('compact <=> closed', [animate('200ms ease-in-out')]),
-    ]),
-    trigger('backdropAnimation', [
-      state('visible', style({ opacity: 1 })),
-      state('hidden', style({ opacity: 0 })),
-      transition('hidden <=> visible', [animate('200ms ease-in-out')]),
-    ]),
-    trigger('mainContentAnimation', [
-      state(
-        'shifted',
-        style({
-          marginLeft: '4rem',
-        })
-      ),
-      state(
-        'normal',
-        style({
-          marginLeft: '0',
-        })
-      ),
-      transition('shifted <=> normal', [animate('200ms ease-in-out')]),
-    ]),
   ],
 })
 export class LayoutComponent implements OnInit, OnDestroy {