Add a 'Jump to latest' button in mobile and desktop view and also adjust the style of merge topic and this new button to match the existing style, so it's clear these are actual buttons

Signed-off-by: Kai Wagner <kai.wagner@percona.com>

Author: ImTheKai

app/assets/stylesheets/components/messages.css

@@ -142,14 +142,10 @@
 
 .thread-actions {
   margin-bottom: var(--spacing-4);
-
-  & .button-secondary {
-    padding: var(--spacing-2) var(--spacing-4);
-    border: var(--border-width) solid var(--color-border);
-    background: var(--color-bg-card);
-    border-radius: var(--border-radius-sm);
-    cursor: pointer;
-  }
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--spacing-2);
 }
 
 .message-subject {

app/views/topics/show.html.slim

@@ -194,9 +194,12 @@
     = render "notes/note_stack", topic: @topic, message: nil, notes: thread_notes
 
 .messages-container.flat.asc
-  - if user_signed_in?
+  - last_message = @messages.last
+  - if last_message.present?
     .thread-actions data-controller="thread-actions" data-thread-actions-topic-id-value=@topic.id data-thread-actions-read-all-url-value=read_all_topic_path(@topic, format: :json)
-      button.button-secondary data-action="click->thread-actions#markAllRead" Mark all messages read
+      - if user_signed_in?
+        button.button.button-secondary.button-small data-action="click->thread-actions#markAllRead" Mark all messages read
+      = link_to "Jump to latest", "#message-#{last_message.id}", class: "button button-secondary button-small", title: "Jump to latest message", "aria-label": "Jump to latest message"
 
   - first_unread_found = false
   - @messages.each do |message|