1 files changed, 8 insertions, 17 deletions
diff --git a/app/assets/javascripts/issue_show/components/header_actions.vue b/app/assets/javascripts/issue_show/components/header_actions.vue
index 2f2c4c6e341..2bddbe4faa0 100644
--- a/app/assets/javascripts/issue_show/components/header_actions.vue
+++ b/app/assets/javascripts/issue_show/components/header_actions.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlButton, GlDropdown, GlDropdownItem, GlIcon, GlLink, GlModal } from '@gitlab/ui';
+import { GlButton, GlDropdown, GlDropdownItem, GlLink, GlModal } from '@gitlab/ui';
 import { mapActions, mapGetters, mapState } from 'vuex';
 import createFlash, { FLASH_TYPES } from '~/flash';
 import { EVENT_ISSUABLE_VUE_APP_CHANGE } from '~/issuable/constants';
@@ -17,7 +17,6 @@ export default {
     GlButton,
     GlDropdown,
     GlDropdownItem,
-    GlIcon,
     GlLink,
     GlModal,
   },
@@ -26,7 +25,6 @@ export default {
   },
   actionPrimary: {
     text: __('Yes, close issue'),
-    attributes: [{ variant: 'warning' }],
   },
   i18n: {
     promoteErrorMessage: __(
@@ -88,9 +86,6 @@ export default {
     qaSelector() {
       return this.isClosed ? 'reopen_issue_button' : 'close_issue_button';
     },
-    buttonVariant() {
-      return this.isClosed ? 'default' : 'warning';
-    },
     dropdownText() {
       return sprintf(__('%{issueType} actions'), {
         issueType: capitalizeFirstCharacter(this.issueType),
@@ -192,9 +187,9 @@ export default {
 </script>
 
 <template>
-  <div class="detail-page-header-actions">
+  <div class="detail-page-header-actions gl-display-flex">
     <gl-dropdown
-      class="gl-display-block gl-sm-display-none!"
+      class="gl-sm-display-none! w-100"
       block
       :text="dropdownText"
       :loading="isToggleStateButtonLoading"
@@ -224,26 +219,22 @@ export default {
     <gl-button
       v-if="showToggleIssueStateButton"
       class="gl-display-none gl-sm-display-inline-flex!"
-      category="secondary"
       :data-qa-selector="qaSelector"
       :loading="isToggleStateButtonLoading"
-      :variant="buttonVariant"
       @click="toggleIssueState"
     >
       {{ buttonText }}
     </gl-button>
 
     <gl-dropdown
-      class="gl-display-none gl-sm-display-inline-flex!"
-      toggle-class="gl-border-0! gl-shadow-none!"
+      class="gl-display-none gl-sm-display-inline-flex! gl-ml-3"
+      icon="ellipsis_v"
+      category="tertiary"
+      :text="dropdownText"
+      :text-sr-only="true"
       no-caret
       right
     >
-      <template #button-content>
-        <gl-icon name="ellipsis_v" />
-        <span class="gl-sr-only">{{ dropdownText }}</span>
-      </template>
-
       <gl-dropdown-item v-if="canCreateIssue" :href="newIssuePath">
         {{ newIssueTypeText }}
       </gl-dropdown-item>