From bd1ccfbf6dff72999d8d0d663e3e3266c6717a47 Mon Sep 17 00:00:00 2001
From: Sayam Samal <sayam@zulip.com>
Date: Thu, 27 Feb 2025 00:48:05 +0530
Subject: [PATCH] inline_topic_edit: Update styling for confirm and cancel
 buttons.

---
 web/styles/zulip.css                       | 9 ++++++++-
 web/templates/components/action_button.hbs | 4 +++-
 web/templates/topic_edit_form.hbs          | 4 ++--
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index 6b0d223e4f..7e2745aa59 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -920,7 +920,7 @@ div.focused-message-list.is-conversation-view .recipient_row {
 .topic_edit_form {
     display: flex;
     align-items: center;
-    gap: 3px;
+    gap: 5px;
     margin: 0;
     padding-right: 5px;
 }
@@ -949,6 +949,13 @@ div.focused-message-list.is-conversation-view .recipient_row {
     }
 }
 
+.topic_edit_save {
+    border-color: light-dark(hsla(0deg 0% 0% / 10%), hsla(0deg 0% 0% / 60%));
+    border-width: 1px;
+    border-style: solid;
+    background-clip: padding-box;
+}
+
 .information-settings .user-profile-picture,
 .user_sidebar_entry.with_avatar .user-profile-picture,
 .inline_profile_picture {
diff --git a/web/templates/components/action_button.hbs b/web/templates/components/action_button.hbs
index 79014e68ba..b9b6438d0c 100644
--- a/web/templates/components/action_button.hbs
+++ b/web/templates/components/action_button.hbs
@@ -1,6 +1,8 @@
-<button type="button" class="{{#if custom_classes}}{{custom_classes}} {{/if}}action-button action-button-{{type}}-{{intent}}" tabindex="0">
+<button type="button" class="{{#if custom_classes}}{{custom_classes}} {{/if}}action-button action-button-{{type}}-{{intent}}" {{#if data-tooltip-template-id}}data-tooltip-template-id="{{data-tooltip-template-id}}"{{/if}} tabindex="0">
     {{#if icon}}
     <i class="zulip-icon zulip-icon-{{icon}}"></i>
     {{/if}}
+    {{#if label}}
     <span class="action-button-label">{{label}}</span>
+    {{/if}}
 </button>
diff --git a/web/templates/topic_edit_form.hbs b/web/templates/topic_edit_form.hbs
index 6f96b7c926..a1553be81f 100644
--- a/web/templates/topic_edit_form.hbs
+++ b/web/templates/topic_edit_form.hbs
@@ -4,7 +4,7 @@
     <input type="text" value="" autocomplete="off" maxlength="{{ max_topic_length }}"
       class="inline_topic_edit header-v {{#unless realm_mandatory_topics}}empty-topic-placeholder-display{{/unless}}"
       {{#unless realm_mandatory_topics}}placeholder="{{empty_string_topic_display_name}}"{{/unless}} />
-    {{> components/icon_button squared=true custom_classes="topic_edit_save tippy-zulip-delayed-tooltip" icon="check" intent="brand" data-tooltip-template-id="save-button-tooltip-template" }}
-    {{> components/icon_button squared=true custom_classes="topic_edit_cancel tippy-zulip-delayed-tooltip" icon="circle-x" intent="neutral" data-tooltip-template-id="cancel-button-tooltip-template" }}
+    {{> components/action_button custom_classes="topic_edit_save tippy-zulip-delayed-tooltip" icon="check" type="primary" intent="brand" data-tooltip-template-id="save-button-tooltip-template" }}
+    {{> components/action_button custom_classes="topic_edit_cancel tippy-zulip-delayed-tooltip" icon="circle-x" type="borderless" intent="neutral" data-tooltip-template-id="cancel-button-tooltip-template" }}
     <div class="topic_edit_spinner"></div>
 </form>