From 0e152a128fc4e58a6479f15b8c606972b8057f19 Mon Sep 17 00:00:00 2001
From: evykassirer <evy@zulip.com>
Date: Mon, 10 Mar 2025 15:00:56 -0700
Subject: [PATCH] message_edit: Scale resolve topic spinner with font size.

This commit also changes the width of the spinner so that the
resolve icon and spinner take up the same width.
---
 web/src/message_edit.ts         |  2 +-
 web/styles/zulip.css            | 11 +++++++----
 web/templates/recipient_row.hbs |  2 +-
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/web/src/message_edit.ts b/web/src/message_edit.ts
index 65160da0fe..38504d046d 100644
--- a/web/src/message_edit.ts
+++ b/web/src/message_edit.ts
@@ -735,7 +735,7 @@ export function start($row: JQuery, edit_box_open_callback?: () => void): void {
 function show_toggle_resolve_topic_spinner($row: JQuery): void {
     const $spinner = $row.find(".toggle_resolve_topic_spinner");
     loading.make_indicator($spinner);
-    $spinner.css({width: "18px"});
+    $spinner.css({width: "1em"});
     $row.find(".on_hover_topic_resolve, .on_hover_topic_unresolve").hide();
     $row.find(".toggle_resolve_topic_spinner").show();
 }
diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index 710ac9ce65..5930cb78da 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -1229,16 +1229,19 @@ nav {
     text-align: center;
 }
 
-div.topic_edit_spinner {
+div.topic_edit_spinner,
+div.toggle_resolve_topic_spinner {
     display: flex;
     align-items: center;
     width: 1.2em; /* 18px at 15px/em  (from font size set in .message-header-contents) */
     height: 1.2em; /* 18px at 15px/em */
 }
 
-div.toggle_resolve_topic_spinner {
-    margin-top: -12px;
-    padding-left: 9px;
+.on_hover_topic_unresolve,
+.on_hover_topic_resolve {
+    /* Matches the width set in `show_toggle_resolve_topic_spinner`,
+       to ensure spinner and resolve icon are the same width */
+    width: 1em;
 }
 
 div.topic_edit_spinner .loading_indicator_spinner,
diff --git a/web/templates/recipient_row.hbs b/web/templates/recipient_row.hbs
index 1d7210287d..57e112ab5a 100644
--- a/web/templates/recipient_row.hbs
+++ b/web/templates/recipient_row.hbs
@@ -56,7 +56,7 @@
                 {{else}}
                     <i class="fa fa-check on_hover_topic_resolve recipient-bar-control recipient_bar_icon hidden-for-spectators" data-topic-name="{{topic}}" data-tippy-content="{{t 'Mark as resolved' }}" role="button" tabindex="0" aria-label="{{t 'Mark as resolved' }}"></i>
                 {{/if}}
-                <div class="toggle_resolve_topic_spinner" style="display: none"></div>
+                <div class="toggle_resolve_topic_spinner recipient_bar_icon" style="display: none"></div>
             {{/if}}
 
             {{#if (and is_subscribed (not is_archived))}}