Responsive Sidebar Navigation - Copy this Angular, Css Component to your project

Ho bisogno di creare una sidebar che abbia un design accattivante e moderno che si apra e si chiuda tramite un pulsante collegato ad essa, e che segua questi parametri qui (genera anche il typescript) : <div class="container mt 5"> <! Bottone per aprire la navbar verticale > <button class="btn btn primary mb 3" type="button" (click)="toggleSidebar()"> Apri Menu </button> <! Navbar Verticale (Sidebar) > <div [class.open]="isSidebarOpen" class="sidebar"> <div class="sidebar header"> <h5>Menu di Navigazione</h5> <button type="button" class="btn close" (click)="toggleSidebar()"></button> </div> <div class="sidebar body"> <ul class="nav flex column"> <li class="nav item" *ngFor="let item of menuItems"> <a class="nav link" [routerLink]="item.link" routerLinkActive="active" (click)="goToStep(item.step)"> {{ item.label }} </a> </li> </ul> </div> </div> <! Contenuto principale > <div class="form mt 4"> <router outlet></router outlet> </div> <! Pulsanti Avanti e Indietro > <div class="mt 4 d flex justify content between"> <! Pulsante Indietro > <button *ngIf="currentStep > 1" class="btn btn secondary" (click)="goToPreviousStep()"> Indietro </button> <! Pulsante Avanti > <button *ngIf="currentStep < menuItems.length" class="btn btn primary" (click)="goToNextStep()"> Avanti </button> </div> </div>