Project Settings Operations h4 Expand/Collapse 5/5

Project Settings General Headers (h4 elements) expand/collapse on
mouse-click / tap, like using the Expand/Collapse button. Other h4
headers in other Project Settings pages do not expande/collapse on
mouse-click / tap, but only using the Expand/Collapse button. This may
seem inconsistent to the user.

The h4 headers of Project Settings General get the expand/collapse
behavior through classes settings-title, js-settings-toggle and
js-settings-toggle-trigger-only.

This MR adds classes settings-title, js-settings-toggle and
js-settings-toggle-trigger-only to the h4 headers in Project Settings
Operations Status page. This enables the expand/collapse behavior on
on-click / on-tap for the h4 headers.

ee/app/assets/javascripts/status_page_settings/components/settings_form.vue

@@ -79,7 +79,10 @@ export default {
 <template>
   <section id="status-page" class="settings no-animate js-status-page-settings">
     <div class="settings-header">
-      <h4 ref="sectionHeader">
+      <h4
+        ref="sectionHeader"
+        class="settings-title js-settings-toggle js-settings-toggle-trigger-only"
+      >
         {{ $options.i18n.headerText }}
       </h4>
       <gl-button ref="toggleBtn" class="js-settings-toggle">{{

ee/changelogs/unreleased/205484-prj-set-ops-5-status.yml

+---
+title: Project Settings Operations header Status page expand/collapse on-click/on-tap
+merge_request: 56275
+author: Daniel Schömer
+type: changed

ee/spec/frontend/status_page_settings/__snapshots__/settings_form_spec.js.snap

@@ -8,7 +8,9 @@ exports[`Status Page settings form default state should match the default snapsh
   <div
     class="settings-header"
   >
-    <h4>
+    <h4
+      class="settings-title js-settings-toggle js-settings-toggle-trigger-only"
+    >
       
       Status page