Index: Sources/frontend/src/app/question-details/question-details.component.css
===================================================================
--- Sources/frontend/src/app/question-details/question-details.component.css	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
+++ Sources/frontend/src/app/question-details/question-details.component.css	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
@@ -0,0 +1,73 @@
+.title {
+  color: #3A98B9;
+}
+
+button {
+  border: none;
+  padding: 5px;
+  height: 50px;
+  border-radius: 5px;
+  background-color: #3A98B9;
+  cursor: pointer;
+  font-weight: normal;
+  font-size: large;
+  color: #FFF1DC;
+}
+
+small {
+  color: gray;
+}
+
+.container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  margin-left: 200px;
+  margin-right: 200px;
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+}
+
+.arrows {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 0;
+  padding-bottom: 0;
+  margin-right: 5px;
+  color: #3A98B9;
+}
+
+.answer-card {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.answer-card p {
+  background-color: #3A98B9;
+  padding: 10px;
+  width: 100%;
+  border-radius: 10px;
+  padding-top: 25px;
+  padding-bottom: 25px;
+  color: #FFF1DC;
+  font-weight: normal;
+  font-size: large;
+}
+
+.header {
+  margin-top: 10px;
+}
+
+.content {
+  background-color: #ffffff;
+  padding: 10px;
+  border-radius: 10px;
+}
+
+b {
+  color: rgba(51, 64, 136, 0.8);
+}
Index: Sources/frontend/src/app/question-details/question-details.component.html
===================================================================
--- Sources/frontend/src/app/question-details/question-details.component.html	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
+++ Sources/frontend/src/app/question-details/question-details.component.html	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
@@ -0,0 +1,29 @@
+<div class="container">
+  <div class="header">
+    <h1>Детали за прашањето</h1>
+    <button routerLink="/add-answer/{{question?.id}}">Одговори на прашањето</button>
+  </div>
+  <hr>
+  <hr>
+  <h2 class="title">{{question?.title}}</h2>
+  <p class="content">{{question?.content}}</p>
+  <small>Поставено на:&nbsp;{{question?.dateAsked?.slice(0, 10)}}
+    од:&nbsp;&nbsp;{{question?.student?.name}} {{question?.student?.lastName}}</small>
+  <hr>
+  <div class="answer-card" *ngFor="let ans of answers">
+    <div class="arrows">
+      <svg (click)="likeAnswer(ans!!.id)" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
+           class="bi bi-arrow-up" viewBox="0 0 16 16">
+        <path fill-rule="evenodd"
+              d="M8 15a.5.5 0 0 0 .5-.5V2.707l3.146 3.147a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 1 0 .708.708L7.5 2.707V14.5a.5.5 0 0 0 .5.5z"/>
+      </svg>
+      <b>{{answersLikes.get(ans!!.id)}}</b>
+      <svg (click)="unlikeAnswer(ans!!.id)" xmlns="http://www.w3.org/2000/svg" width="16" height="16"
+           fill="currentColor" class="bi bi-arrow-down" viewBox="0 0 16 16">
+        <path fill-rule="evenodd"
+              d="M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1z"/>
+      </svg>
+    </div>
+    <p>{{ans?.content}}</p>
+  </div>
+</div>
Index: Sources/frontend/src/app/question-details/question-details.component.spec.ts
===================================================================
--- Sources/frontend/src/app/question-details/question-details.component.spec.ts	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
+++ Sources/frontend/src/app/question-details/question-details.component.spec.ts	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { QuestionDetailsComponent } from './question-details.component';
+
+describe('QuestionDetailsComponent', () => {
+  let component: QuestionDetailsComponent;
+  let fixture: ComponentFixture<QuestionDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ QuestionDetailsComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(QuestionDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
Index: Sources/frontend/src/app/question-details/question-details.component.ts
===================================================================
--- Sources/frontend/src/app/question-details/question-details.component.ts	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
+++ Sources/frontend/src/app/question-details/question-details.component.ts	(revision 84234294abb1e8ce0876e888a7bec532eaeb6a14)
@@ -0,0 +1,72 @@
+import {Component, OnInit} from '@angular/core';
+import {QuestionService} from "../question.service";
+import {QuestionInterface} from "../QuestionInterface";
+import {ActivatedRoute, Router} from "@angular/router";
+import {AnswerInterface} from "../AnswerInterface";
+import {LoginService} from "../login.service";
+import {ActiveUserInterface} from "../ActiveUserInterface";
+
+@Component({
+  selector: 'app-question-details',
+  templateUrl: './question-details.component.html',
+  styleUrls: ['./question-details.component.css']
+})
+export class QuestionDetailsComponent implements OnInit {
+  question: QuestionInterface | undefined
+  answers: AnswerInterface[] = []
+  answersLikes = new Map<number, number>()
+  activeUser: ActiveUserInterface | undefined;
+
+  constructor(private questionService: QuestionService,
+              private route: ActivatedRoute,
+              private loginService: LoginService,
+              private router: Router) {
+  }
+
+  ngOnInit(): void {
+    const id = Number(this.route.snapshot.paramMap.get('id'));
+    this.findQuestionById(id);
+    this.activeUser = this.loginService.activeUser;
+    if (!this.activeUser) {
+      this.router.navigate(['/'])
+    }
+  }
+
+  findQuestionById(id: number) {
+    this.questionService.findQuestionById(id)
+      .subscribe(resp => {
+        this.question = resp;
+        this.questionService.findAnswersForQuestionWithId(id)
+          .subscribe(resp => {
+            this.answers = resp;
+            this.findLikesForAnswers()
+          })
+      });
+  }
+
+  findLikesForAnswers() {
+    this.answers.forEach(answer =>
+      this.questionService.findLikesForAnswer(answer.id)
+        .subscribe(number => this.answersLikes.set(answer.id, +number))
+    )
+  }
+
+  likeAnswer(id: number) {
+    // @ts-ignore
+    this.questionService.likeAnswer(id, this.activeUser!!.username, this.activeUser!!.userType)
+      .subscribe(number => {
+        this.answersLikes.delete(id);
+        this.answersLikes.set(id, +number);
+      })
+  }
+
+  unlikeAnswer(id: number) {
+    // @ts-ignore
+    this.questionService.unlikeAnswer(id, this.activeUser!!.username, this.activeUser!!.userType)
+      .subscribe(number => {
+        this.answersLikes.delete(id);
+        this.answersLikes.set(id, +number);
+      })
+  }
+
+}
