From 77ebdfac7717fed35935a84d56ae5868fdeeb911 Mon Sep 17 00:00:00 2001
From: Shubham Padia <shubham@zulip.com>
Date: Tue, 3 Sep 2024 07:23:41 +0000
Subject: [PATCH] css: Use classname for show_my_user_profile_modal icon
 styles.

Having the selector there affects the performance. See
https://chat.zulip.org/#narrow/stream/6-frontend/topic/CSS.20selector.20performance/near/1845719
for more details.
---
 web/styles/settings.css                     | 8 ++++----
 web/templates/settings/profile_settings.hbs | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/web/styles/settings.css b/web/styles/settings.css
index c7e00ba2ba..b93a30d632 100644
--- a/web/styles/settings.css
+++ b/web/styles/settings.css
@@ -1569,11 +1569,11 @@ $option_title_width: 180px;
         width: 100%;
         top: 20px;
         position: sticky;
-    }
 
-    #show_my_user_profile_modal i {
-        padding-left: 2px;
-        vertical-align: middle;
+        .show-user-profile-icon {
+            padding-left: 2px;
+            vertical-align: middle;
+        }
     }
 }
 
diff --git a/web/templates/settings/profile_settings.hbs b/web/templates/settings/profile_settings.hbs
index bcb6866b2c..110c9ac297 100644
--- a/web/templates/settings/profile_settings.hbs
+++ b/web/templates/settings/profile_settings.hbs
@@ -64,7 +64,7 @@
             </div>
             <button class="button rounded sea-green" id="show_my_user_profile_modal">
                 {{t 'Preview profile' }}
-                <i class="fa fa-external-link" aria-hidden="true"></i>
+                <i class="show-user-profile-icon fa fa-external-link" aria-hidden="true"></i>
             </button>
         </div>
     </div>