diff --git a/frontends/dnet-is-application/src/app/app.component.html b/frontends/dnet-is-application/src/app/app.component.html
index 699393a0..944ef7b1 100644
--- a/frontends/dnet-is-application/src/app/app.component.html
+++ b/frontends/dnet-is-application/src/app/app.component.html
@@ -4,7 +4,7 @@
         [mode]="(isHandset$ | async) ? 'over' : 'side'"
         [opened]="(isHandset$ | async) === false">
       <mat-toolbar>Menu</mat-toolbar>
-      <app-main-menu-tree></app-main-menu-tree>
+      <app-main-menu-panels></app-main-menu-panels>
     </mat-sidenav>
     <mat-sidenav-content>
       <mat-toolbar color="primary">
diff --git a/frontends/dnet-is-application/src/app/app.module.ts b/frontends/dnet-is-application/src/app/app.module.ts
index b8e42ec0..7b4deb15 100644
--- a/frontends/dnet-is-application/src/app/app.module.ts
+++ b/frontends/dnet-is-application/src/app/app.module.ts
@@ -22,6 +22,8 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input'
 import { MatTableModule } from '@angular/material/table';
 import { ProtocolsComponent } from './protocols/protocols.component';
+import { MainMenuPanelsComponent } from './main-menu-panels/main-menu-panels.component';
+import { MatExpansionModule } from '@angular/material/expansion';
 
 @NgModule({
   declarations: [
@@ -29,7 +31,8 @@ import { ProtocolsComponent } from './protocols/protocols.component';
     InfoComponent,
     DatafilterPipe,
     MainMenuTreeComponent,
-    ProtocolsComponent
+    ProtocolsComponent,
+    MainMenuPanelsComponent
   ],
   imports: [
     BrowserModule,
@@ -48,7 +51,8 @@ import { ProtocolsComponent } from './protocols/protocols.component';
     MatCardModule,
     MatFormFieldModule,
     MatInputModule,
-    MatTableModule
+    MatTableModule,
+    MatExpansionModule
   ],
   providers: [],
   bootstrap: [AppComponent]
diff --git a/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.css b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.css
new file mode 100644
index 00000000..92f09260
--- /dev/null
+++ b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.css
@@ -0,0 +1,13 @@
+.menu-count {
+    padding-top: 0.1em;
+    padding-bottom: 0.1em;
+    padding-left: 0.4em;
+    padding-right: 0.4em;
+    border-radius: 1em;
+    font-size: 0.7em;
+    color: #fff;
+    background-color:cornflowerblue;
+    width: 2em;
+    text-align: center;
+    float: right;
+}
diff --git a/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.html b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.html
new file mode 100644
index 00000000..c91f0cb0
--- /dev/null
+++ b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.html
@@ -0,0 +1,57 @@
+<mat-accordion>
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Home</mat-panel-title>
+        </mat-expansion-panel-header>
+        <p>...</p>
+    </mat-expansion-panel>
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Datasources</mat-panel-title>
+        </mat-expansion-panel-header>
+        <mat-nav-list>
+            <a mat-list-item [routerLink]="['ds/search']">Search</a>
+        </mat-nav-list>
+    </mat-expansion-panel>
+
+
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Simple Resources</mat-panel-title>
+        </mat-expansion-panel-header>
+        <mat-nav-list>
+            <ng-container *ngFor="let r of resTypes">
+                <a mat-list-item [routerLink]="['resources/' + r.id]" *ngIf="r.simple">{{r.name}} <span class="menu-count">{{r.count}}</span></a>
+            </ng-container>
+        </mat-nav-list>
+    </mat-expansion-panel>
+
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Advanced Resources</mat-panel-title>
+        </mat-expansion-panel-header>
+        <mat-nav-list>
+            <ng-container *ngFor="let r of resTypes">
+                <a mat-list-item [routerLink]="['adv_resources/' + r.id]" *ngIf="!r.simple">{{r.name}} <span class="menu-count">{{r.count}}</span></a>
+            </ng-container>
+        </mat-nav-list>
+    </mat-expansion-panel>
+
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Logs</mat-panel-title>
+        </mat-expansion-panel-header>
+        <mat-nav-list>
+            <a mat-list-item [routerLink]="['wf_history']">Workflow History</a>
+        </mat-nav-list>
+    </mat-expansion-panel>
+
+    <mat-expansion-panel>
+        <mat-expansion-panel-header>
+            <mat-panel-title>Info</mat-panel-title>
+        </mat-expansion-panel-header>
+        <mat-nav-list>
+            <a mat-list-item [routerLink]="['info']">Container Info</a>
+        </mat-nav-list>
+    </mat-expansion-panel>
+</mat-accordion>
\ No newline at end of file
diff --git a/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.spec.ts b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.spec.ts
new file mode 100644
index 00000000..a984d6a9
--- /dev/null
+++ b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MainMenuPanelsComponent } from './main-menu-panels.component';
+
+describe('MainMenuPanelsComponent', () => {
+  let component: MainMenuPanelsComponent;
+  let fixture: ComponentFixture<MainMenuPanelsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MainMenuPanelsComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(MainMenuPanelsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.ts b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.ts
new file mode 100644
index 00000000..21d7f30a
--- /dev/null
+++ b/frontends/dnet-is-application/src/app/main-menu-panels/main-menu-panels.component.ts
@@ -0,0 +1,17 @@
+import { Component } from '@angular/core';
+import { ResourceType } from '../model/controller.model';
+import { ISCommonService } from '../iscommon.service';
+
+@Component({
+  selector: 'app-main-menu-panels',
+  templateUrl: './main-menu-panels.component.html',
+  styleUrls: ['./main-menu-panels.component.css']
+})
+export class MainMenuPanelsComponent {
+  
+  resTypes:ResourceType[] = [];
+
+  constructor(public service:ISCommonService) {
+    this.service.loadResourceTypes().subscribe((data:ResourceType[]) => this.resTypes = data);
+  }
+}
diff --git a/frontends/dnet-is-application/src/app/protocols/protocols.component.html b/frontends/dnet-is-application/src/app/protocols/protocols.component.html
index c9b1046d..334d13f0 100644
--- a/frontends/dnet-is-application/src/app/protocols/protocols.component.html
+++ b/frontends/dnet-is-application/src/app/protocols/protocols.component.html
@@ -3,7 +3,7 @@
         <mat-card-title>Harvesting Protocols</mat-card-title>
     </mat-card-header>
     <mat-card-content>
-        <div style="margin-top: 20px;" *ngFor="let prot of protDatasources">
+        <div style="margin-top: 3em;" *ngFor="let prot of protDatasources">
             <h3>{{prot.protocol}}</h3>
 
             <table mat-table [dataSource]="prot.datasource" class="mat-elevation-z8">