Audit and update buttons on Groups::BoardsController#index

app/assets/javascripts/boards/components/board_add_new_column_trigger.vue

@@ -13,9 +13,9 @@ export default {
 </script>
 
 <template>
-  <span class="gl-ml-3 gl-display-flex gl-align-items-center" data-testid="boards-create-list">
+  <div class="gl-ml-3 gl-display-flex gl-align-items-center" data-testid="boards-create-list">
     <gl-button variant="confirm" @click="setAddColumnFormVisibility(true)"
       >{{ __('Create list') }}
     </gl-button>
-  </span>
+  </div>
 </template>

app/assets/javascripts/boards/components/toggle_focus.vue

@@ -38,10 +38,11 @@ export default {
 </script>
 
 <template>
-  <div class="board-extra-actions gl-ml-3 gl-display-flex gl-align-items-center">
+  <div class="board-extra-actions gl-ml-3 gl-display-none gl-md-display-flex gl-align-items-center">
     <gl-button
       ref="toggleFocusModeButton"
       v-gl-tooltip
+      category="tertiary"
       :icon="isFullscreen ? 'minimize' : 'maximize'"
       class="js-focus-mode-btn"
       data-qa-selector="focus_mode_button"

changelogs/unreleased/273325-fy21q4-foundations-kr2-audit-and-update-buttons-on-groups-boardsco.yml

+---
+title: Only display focus mode button at md+ breakpoint and make it the tertiary style
+merge_request: 57139
+author:
+type: other