Update ci-cd settings buttons to conform to pajamas

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/59695

app/assets/javascripts/ci_variable_list/components/ci_variable_table.vue

@@ -162,23 +162,26 @@ export default {
         </p>
       </template>
     </gl-table>
-    <div class="ci-variable-actions" :class="{ 'justify-content-center': !tableIsNotEmpty }">
+    <div
+      class="ci-variable-actions gl-display-flex"
+      :class="{ 'justify-content-center': !tableIsNotEmpty }"
+    >
+      <gl-button
+        ref="add-ci-variable"
+        v-gl-modal-directive="$options.modalId"
+        class="gl-mr-3"
+        data-qa-selector="add_ci_variable_button"
+        variant="confirm"
+        category="primary"
+        >{{ __('Add variable') }}</gl-button
+      >
       <gl-button
         v-if="tableIsNotEmpty"
         ref="secret-value-reveal-button"
         data-qa-selector="reveal_ci_variable_value_button"
-        class="gl-mr-3"
         @click="toggleValues(!valuesHidden)"
         >{{ valuesButtonText }}</gl-button
       >
-      <gl-button
-        ref="add-ci-variable"
-        v-gl-modal-directive="$options.modalId"
-        data-qa-selector="add_ci_variable_button"
-        variant="success"
-        category="primary"
-        >{{ __('Add Variable') }}</gl-button
-      >
     </div>
   </div>
 </template>

app/assets/stylesheets/pages/settings_ci_cd.scss

@@ -11,10 +11,6 @@
 
 .trigger-actions {
   white-space: nowrap;
-
-  .btn {
-    margin-left: 10px;
-  }
 }
 
 .auto-devops-card {

app/views/projects/runners/_group_runners.html.haml

@@ -13,7 +13,7 @@
     %br
     %br
     - if @project.group_runners_enabled?
-      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn gl-button btn-warning-secondary', method: :post do
+      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn gl-button btn-default', method: :post do
         = _('Disable group runners')
     - else
       = link_to toggle_group_runners_project_runners_path(@project), class: 'btn gl-button btn-confirm-secondary', method: :post do

app/views/projects/runners/_shared_runners.html.haml

@@ -9,10 +9,10 @@
         = _('Shared runners disabled on group level')
     - else
       - if @project.shared_runners_enabled?
-        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-warning-secondary', method: :post do
+        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-default', method: :post do
           = _('Disable shared runners')
       - else
-        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-confirm', method: :post do
+        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-confirm-secondary', method: :post do
           = _('Enable shared runners')
         for this project
 

app/views/projects/triggers/_trigger.html.haml

@@ -30,8 +30,8 @@
   %td.text-right.trigger-actions
     - revoke_trigger_confirmation = "By revoking a trigger you will break any processes making use of it. Are you sure?"
     - if can?(current_user, :admin_trigger, trigger)
-      = link_to edit_project_trigger_path(@project, trigger), method: :get, title: "Edit", class: "gl-button btn btn-default btn-sm" do
+      = link_to edit_project_trigger_path(@project, trigger), method: :get, title: "Edit", class: "gl-button btn btn-default btn-icon" do
         = sprite_icon('pencil')
     - if can?(current_user, :manage_trigger, trigger)
-      = link_to project_trigger_path(@project, trigger), data: { confirm: revoke_trigger_confirmation, testid: 'trigger_revoke_button' }, method: :delete, title: "Revoke", class: "gl-button btn btn-default btn-sm btn-trigger-revoke" do
+      = link_to project_trigger_path(@project, trigger), data: { confirm: revoke_trigger_confirmation, testid: 'trigger_revoke_button' }, method: :delete, title: "Revoke", class: "gl-button btn btn-default btn-icon btn-trigger-revoke gl-ml-3" do
         = sprite_icon('remove')

ee/app/views/projects/protected_environments/_form.html.haml

@@ -19,4 +19,4 @@
         = render partial: 'projects/protected_environments/deploy_access_levels_dropdown', locals: { f: f }
 
     .card-footer
-      = f.submit s_('ProtectedEnvironment|Protect'), class: 'btn-success btn', disabled: true
+      = f.submit s_('ProtectedEnvironment|Protect'), class: 'gl-button btn btn-confirm', disabled: true

ee/changelogs/unreleased/273318-update-cicd-settings-buttons.yml

+---
+title: Update ci-cd settings buttons to conform to pajamas
+merge_request: 59695
+author:
+type: changed

locale/gitlab.pot

@@ -1868,9 +1868,6 @@ msgstr ""
 msgid "Add README"
 msgstr ""
 
-msgid "Add Variable"
-msgstr ""
-
 msgid "Add Zoom meeting"
 msgstr ""
 

spec/features/project_variables_spec.rb

@@ -18,7 +18,7 @@ RSpec.describe 'Project variables', :js do
   it_behaves_like 'variable list'
 
   it 'adds a new variable with an environment scope' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     page.within('#add-ci-variable') do
       find('[data-qa-selector="ci_variable_key_field"] input').set('akey')

spec/support/shared_examples/features/variable_list_shared_examples.rb

@@ -8,7 +8,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'adds a new CI variable' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('key', 'key_value') do
       click_button('Add variable')
@@ -22,7 +22,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'adds a new protected variable' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('key', 'key_value') do
       click_button('Add variable')
@@ -37,7 +37,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'defaults to unmasked' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('key', 'key_value') do
       click_button('Add variable')
@@ -149,7 +149,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'shows a validation error box about duplicate keys' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('key', 'key_value') do
       click_button('Add variable')
@@ -157,7 +157,7 @@ RSpec.shared_examples 'variable list' do
 
     wait_for_requests
 
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('key', 'key_value') do
       click_button('Add variable')
@@ -170,7 +170,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'prevents a variable to be added if no values are provided when a variable is set to masked' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     page.within('#add-ci-variable') do
       find('[data-qa-selector="ci_variable_key_field"] input').set('empty_mask_key')
@@ -182,7 +182,7 @@ RSpec.shared_examples 'variable list' do
   end
 
   it 'shows validation error box about unmaskable values' do
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('empty_mask_key', '???', protected: true, masked: true) do
       expect(page).to have_content('This variable can not be masked')
@@ -192,7 +192,7 @@ RSpec.shared_examples 'variable list' do
 
   it 'handles multiple edits and a deletion' do
     # Create two variables
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('akey', 'akeyvalue') do
       click_button('Add variable')
@@ -200,7 +200,7 @@ RSpec.shared_examples 'variable list' do
 
     wait_for_requests
 
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('zkey', 'zkeyvalue') do
       click_button('Add variable')
@@ -224,7 +224,7 @@ RSpec.shared_examples 'variable list' do
     wait_for_requests
 
     # Add another variable
-    click_button('Add Variable')
+    click_button('Add variable')
 
     fill_variable('ckey', 'ckeyvalue') do
       click_button('Add variable')
@@ -249,7 +249,7 @@ RSpec.shared_examples 'variable list' do
       end
 
       it 'defaults to protected' do
-        click_button('Add Variable')
+        click_button('Add variable')
 
         page.within('#add-ci-variable') do
           expect(find('[data-testid="ci-variable-protected-checkbox"]')).to be_checked
@@ -269,7 +269,7 @@ RSpec.shared_examples 'variable list' do
       end
 
       it 'defaults to unprotected' do
-        click_button('Add Variable')
+        click_button('Add variable')
 
         page.within('#add-ci-variable') do
           expect(find('[data-testid="ci-variable-protected-checkbox"]')).not_to be_checked