settings: Replace two pane header classnames with a generic one.

web/e2e-tests/message-basics.test.ts

@@ -475,7 +475,7 @@ async function test_narrow_public_streams(page: Page): Promise<void> {
             "sub_unsub_button",
         )} and normalize-space()="Subscribe"]`,
     );
-    await page.click(".subscriptions-header .exit-sign");
+    await page.click("#subscription_overlay .two-pane-settings-header .exit-sign");
     await page.waitForSelector("#subscription_overlay", {hidden: true});
     await page.goto(`http://zulip.zulipdev.com:9981/#narrow/channel/${stream_id}-Denmark`);
     let message_list_id = await common.get_current_msg_list_id(page, true);

web/src/stream_settings_ui.ts

@@ -924,7 +924,7 @@ export function switch_to_stream_row(stream_id: number): void {
 
 function show_right_section(): void {
     $(".right").addClass("show");
-    $(".subscriptions-header").addClass("slide-left");
+    $("#subscription_overlay .two-pane-settings-header").addClass("slide-left");
     resize.resize_stream_subscribers_list();
 }
 
@@ -1160,6 +1160,6 @@ export function initialize(): void {
 
     $("#channels_overlay_container").on("click", ".fa-chevron-left", () => {
         $(".right").removeClass("show");
-        $(".subscriptions-header").removeClass("slide-left");
+        $("#channels_overlay_container .two-pane-settings-header").removeClass("slide-left");
     });
 }

web/src/user_group_edit.ts

@@ -1344,7 +1344,7 @@ export function switch_to_group_row(group: UserGroup): void {
 
 function show_right_section(): void {
     $(".right").addClass("show");
-    $(".user-groups-header").addClass("slide-left");
+    $("#groups_overlay .two-pane-settings-header").addClass("slide-left");
 }
 
 export function add_group_to_table(group: UserGroup): void {
@@ -2017,7 +2017,7 @@ export function initialize(): void {
 
     $("#groups_overlay_container").on("click", ".fa-chevron-left", () => {
         $(".right").removeClass("show");
-        $(".user-groups-header").removeClass("slide-left");
+        $("#groups_overlay_container .two-pane-settings-header").removeClass("slide-left");
     });
 
     $("#groups_overlay_container").on("click", ".join_leave_button", function (this: HTMLElement) {

web/styles/app_variables.css

@@ -576,7 +576,7 @@
     --overlay-container-max-height: 1000px;
     /* The width of the settings sidebar. */
     --settings-sidebar-width: 18.2142em; /* 255px at 14px/em */
-    /* .subscriptions-header and .settings-header */
+    /* .two-pane-settings-header and .settings-header */
     --settings-overlay-header-height: 3.2143em; /* 45px at 14px/em */
     /* .display-type and .list-toggler-container
        in subscriptions and user group settings overlays */

web/styles/subscriptions.css

@@ -280,8 +280,7 @@ h4.user_group_setting_subsection_title {
     display: inline;
 }
 
-.two-pane-settings-container .subscriptions-header .fa-chevron-left,
-.two-pane-settings-container .user-groups-header .fa-chevron-left {
+.two-pane-settings-container .two-pane-settings-header .fa-chevron-left {
     position: relative;
     transform: translate(-50px, 0);
     opacity: 0;
@@ -297,8 +296,9 @@ h4.user_group_setting_subsection_title {
     transition-property: opacity, transform;
 }
 
-.two-pane-settings-container .user-groups-header.slide-left .fa-chevron-left,
-.two-pane-settings-container .subscriptions-header.slide-left .fa-chevron-left,
+.two-pane-settings-container
+    .two-pane-settings-header.slide-left
+    .fa-chevron-left,
 #settings_overlay_container
     .settings-header.mobile.slide-left
     .fa-chevron-left {
@@ -420,8 +420,7 @@ h4.user_group_setting_subsection_title {
         }
     }
 
-    .user-groups-header,
-    .subscriptions-header {
+    .two-pane-settings-header {
         height: var(--settings-overlay-header-height);
         display: flex;
         align-items: center;
@@ -1448,8 +1447,7 @@ div.settings-radio-input-parent {
             text-align: left;
         }
 
-        .user-groups-header .fa-chevron-left,
-        .subscriptions-header .fa-chevron-left {
+        .two-pane-settings-header .fa-chevron-left {
             visibility: visible;
         }
     }

web/templates/stream_settings/stream_settings_overlay.hbs

@@ -1,7 +1,7 @@
 <div id="subscription_overlay" class="overlay" data-overlay="subscriptions">
     <div class="flex overlay-content">
         <div class="two-pane-settings-container overlay-container">
-            <div class="subscriptions-header">
+            <div class="two-pane-settings-header">
                 <div class="fa fa-chevron-left"></div>
                 <span class="subscriptions-title">{{t 'Channels' }}</span>
                 <div class="exit">

web/templates/user_group_settings/user_group_settings_overlay.hbs

@@ -1,7 +1,7 @@
 <div id="groups_overlay" class="overlay" data-overlay="group_subscriptions">
     <div class="flex overlay-content">
         <div class="two-pane-settings-container overlay-container">
-            <div class="user-groups-header">
+            <div class="two-pane-settings-header">
                 <div class="fa fa-chevron-left"></div>
                 <span class="user-groups-title">{{t 'User groups' }}</span>
                 <div class="exit">