Fix styling of feedback page

src/main/java/nl/tudelft/queue/controller/HomeController.java

@@ -291,10 +291,10 @@ public class HomeController {
 		return "home/feedback";
 	}
 
-	@GetMapping("/feedback/{id}/report")
+	@GetMapping("/feedback/report")
 	@PreAuthorize("@permissionService.canViewFeedback(#id)")
 	public String reportFeedback(@RequestParam Long request, @RequestParam Long assistant,
-								 @RequestParam String callback, @PathVariable String id) {
+								 @RequestParam String callback) {
 		System.out.printf("Report for request %s for assistant %s", request,
 				assistant);
 		fs.reportFeedback(new Feedback.Id(request, assistant));

src/main/resources/templates/home/feedback.html

@@ -118,14 +118,21 @@
                                         th:if="${fb.feedback != null && !fb.feedback.isEmpty()}">
 
                                         <div class="flex space-between">
-                                                <div class="tooltip">
-                                                    <i class="fa-solid fa-circle-exclamation tooltip__control"></i>
+                                            <div class="flex" >
+                                                <div th:if="${fb.isReported() && @permissionService.canViewDeanonimisedFeedback()}" class="tooltip"
+                                                     style="justify-content:
+                                                space-evenly; margin: auto">
+                                                        <i class="tooltip__control"
+                                                           style="min-height: 1.1rem">!</i>
                                                         <p role="tooltip" style="width: 30rem; white-space: initial">
                                                             This feedback item has been reported and
                                                             will not be shown anymore to the TA.
                                                         </p>
                                                 </div>
-                                            <p th:text="${fb.feedback}"></p>
+                                                <p th:text="${fb.feedback}"
+                                                   style="justify-content: space-around; margin:
+                                                   auto; vertical-align: middle"></p>
+                                            </div>
                                             <div class="menu-wrapper">
                                                 <button aria-haspopup="menu"
                                                         class="fa-solid fa-ellipsis-vertical button"
@@ -134,7 +141,7 @@
                                                 <ul class="menu" th:id="|feedback-${fb.id}|" role="menu">
                                                     <li>
                                                         <form method="get"
-                                                              th:action="@{/feedback/{id}/report(id=${fb.id})}">
+                                                              th:action="@{/feedback/report}">
                                                             <input hidden
                                                                    th:value="${fb.id.requestId}"
                                                                    name="request">
@@ -147,10 +154,6 @@
                                                             <button role="menuitem">Report
                                                                 as inappropriate</button>
                                                         </form>
-<!--                                                        <a role="menuitem"-->
-<!--                                                           th:href="|/feedback/report?request=${fb.id.requestId}&assistant=${fb.id.assistantId}&callback=/${#httpServletRequest.requestURI}|"-->
-<!--                                                                >Report as-->
-<!--                                                            inappropriate</a>-->
                                                     </li>
                                                 </ul>
                                             </div>