diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html
index e8d5e8bb88a3f09e12eebd80faa20fa2e60891b3..d354898592fe69fc14e0a901ba76bf6aaf2b7404 100644
--- a/src/app/components/shared/comment-list/comment-list.component.html
+++ b/src/app/components/shared/comment-list/comment-list.component.html
@@ -1,10 +1,4 @@
 <mat-toolbar >List of Questions</mat-toolbar>
 <mat-card class="outer-card">
-  <mat-card class="card-container" *ngFor="let comment of comments">
-    <mat-card-title>{{comment.subject}}</mat-card-title>
-    <mat-divider></mat-divider>
-    <mat-card-content>
-      <p>{{comment.body}}</p>
-    </mat-card-content>
-  </mat-card>
+    <app-comment *ngFor="let current of comments" [comment]="current"> </app-comment>
 </mat-card>
diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts
index f30897d8513d15bf34e5246fef3b70101edde015..d90260ac2c8fc4c243da687cecc8f11de237ad6f 100644
--- a/src/app/components/shared/comment-list/comment-list.component.ts
+++ b/src/app/components/shared/comment-list/comment-list.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { Location } from '@angular/common';
 import { Comment } from '../../../models/comment';
@@ -52,16 +52,4 @@ export class CommentListComponent implements OnInit {
           this.isLoading = false;
         });
   }
-
-  setRead(comment: Comment): void {
-    this.comments.find(c => c.id === comment.id).read = !comment.read;
-    this.commentService.updateComment(comment).subscribe();
-  }
-
-  delete(comment: Comment): void {
-    this.comments = this.comments.filter(c => c !== comment);
-    this.commentService.deleteComment(comment.id).subscribe(room => {
-      this.notification.show(`Comment '${comment.subject}' successfully deleted.`);
-    });
-  }
 }
diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..834776dfaa0ec0d4c5d13c17524ac853a8d67ec3
--- /dev/null
+++ b/src/app/components/shared/comment/comment.component.html
@@ -0,0 +1,7 @@
+<mat-card>
+  <mat-card-title>{{comment.subject}}</mat-card-title>
+  <mat-divider></mat-divider>
+  <mat-card-content>
+    <p>{{comment.body}}</p>
+  </mat-card-content>
+</mat-card>
diff --git a/src/app/components/shared/comment/comment.component.scss b/src/app/components/shared/comment/comment.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/app/components/shared/comment/comment.component.spec.ts b/src/app/components/shared/comment/comment.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..5d05159bb6d681d54e8586e27b3ccccf1fb82289
--- /dev/null
+++ b/src/app/components/shared/comment/comment.component.spec.ts
@@ -0,0 +1,26 @@
+/*import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommentComponent } from './comment.component';
+
+describe('CommentComponent', () => {
+  let component: CommentComponent;
+  let fixture: ComponentFixture<CommentComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CommentComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CommentComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
+*/
diff --git a/src/app/components/shared/comment/comment.component.ts b/src/app/components/shared/comment/comment.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..24a9ea824ff980a303370a4e37043d980f5b0ba8
--- /dev/null
+++ b/src/app/components/shared/comment/comment.component.ts
@@ -0,0 +1,54 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { Comment } from '../../../models/comment';
+import { UserRole } from '../../../models/user-roles.enum';
+import { User } from '../../../models/user';
+import { AuthenticationService } from '../../../services/http/authentication.service';
+import { ActivatedRoute } from '@angular/router';
+import { RoomService } from '../../../services/http/room.service';
+import { Location } from '@angular/common';
+import { CommentService } from '../../../services/http/comment.service';
+import { NotificationService } from '../../../services/util/notification.service';
+import { TranslateService } from '@ngx-translate/core';
+import { LanguageService } from '../../../services/util/language.service';
+
+@Component({
+  selector: 'app-comment',
+  templateUrl: './comment.component.html',
+  styleUrls: ['./comment.component.scss']
+})
+export class CommentComponent implements OnInit {
+  @Input() comment: Comment;
+  userRoleTemp: any = UserRole.CREATOR;
+  userRole: UserRole;
+  user: User;
+  isLoading = true;
+  roomId: string;
+  roomShortId: string;
+
+  constructor(protected authenticationService: AuthenticationService,
+              private route: ActivatedRoute,
+              private roomService: RoomService,
+              private location: Location,
+              private commentService: CommentService,
+              private notification: NotificationService,
+              private translateService: TranslateService,
+              protected langService: LanguageService) {
+    langService.langEmitter.subscribe(lang => translateService.use(lang)); }
+
+  ngOnInit() {
+    this.userRole = this.authenticationService.getRole();
+    this.user = this.authenticationService.getUser();
+    this.roomShortId = this.route.snapshot.paramMap.get('roomId');
+    this.roomId = localStorage.getItem(`roomId`);
+    this.translateService.use(localStorage.getItem('currentLang'));
+  }
+  setRead(comment: Comment): void {
+    this.commentService.updateComment(comment).subscribe();
+  }
+
+  delete(comment: Comment): void {
+    this.commentService.deleteComment(comment.id).subscribe(room => {
+      this.notification.show(`Comment '${comment.subject}' successfully deleted.`);
+    });
+  }
+}
diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts
index e10dbff2d52e6f3bbfcc9f0b2d12db1bfd8e9351..7370a65112733d2088832c348afd509a1aab15c6 100644
--- a/src/app/components/shared/shared.module.ts
+++ b/src/app/components/shared/shared.module.ts
@@ -21,6 +21,7 @@ import { RoomJoinComponent } from './room-join/room-join.component';
 import { RoomCreateComponent } from './_dialogs/room-create/room-create.component';
 import { LoginComponent } from './login/login.component';
 import { StatisticHelpComponent } from './_dialogs/statistic-help/statistic-help.component';
+import { CommentComponent } from './comment/comment.component';
 
 @NgModule({
   imports: [
@@ -48,7 +49,8 @@ import { StatisticHelpComponent } from './_dialogs/statistic-help/statistic-help
     StatisticComponent,
     RoomCreateComponent,
     LoginComponent,
-    StatisticHelpComponent
+    StatisticHelpComponent,
+    CommentComponent
   ],
   exports: [
     RoomJoinComponent,