feat: Highlight the targeted suggestion when browsing to it

Author: florentc

src/website/webview/static/style.css

@@ -361,6 +361,7 @@
   --error-suggestion: #ffabab;
   --affected: #ffabab;
   --unaffected: #bfb;
+  --highlighted: #fcf9c4;
 }
 
 body {
@@ -489,6 +490,18 @@ article .suggestion {
   flex-grow: 1;
 }
 
+@keyframes suggestion-quick-highlight {
+  0% {
+    background: var(--highlighted);
+  }
+  100% {
+  }
+}
+
+article .suggestion:target {
+  animation: suggestion-quick-highlight 3s;
+}
+
 article .row1 {
   display: flex;
   flex-direction: row;

src/website/webview/templates/components/suggestion.html

@@ -1,6 +1,6 @@
 {% load viewutils %}
 
-<article class="suggestion" hx-target="this">
+<article class="suggestion" hx-target="this" id="suggestion-{{ cached_suggestion.pk }}">
   <form
     method="post"
     action=""

src/website/webview/views.py

@@ -684,9 +684,7 @@ def suggestion_view_context() -> dict:
                         "title": cached_suggestion.payload["title"],
                         "status": suggestion.status,
                         "old_status": self.status_filter,
-                        "changed_suggestion_link": self.status_route_dict[
-                            suggestion.status
-                        ],
+                        "changed_suggestion_link": f"{self.status_route_dict[suggestion.status]}#suggestion-{suggestion.pk}",
                         "gh_issue_link": gh_issue_link,
                         "csrf_token": get_token(request),
                     },