Use utility classes instead of more CSS in collapsible_sidebar.vue and related components

References: !21010 (closed)

Use utility classes instead of more CSS in collapsible_sidebar.vue and related components (e.g. left.vue and right.vue).

• See this comment: "We strongly suggest using utility classes over introducing new arbitrary CSS. A lot of the rules being added to ide.scss can be implemented using bootstrap utility classes.

• Specific examples:

  1. In app/assets/stylesheets/page_bundles/ide.scss, for .ide-sidebar-link, remove all three flexy rules display: flex, align-items: center, justify-content: center, and adding d-flex-center to all references of .ide-sidebar-link.
  2. With the ide-left-sidebar, try to remove that if possible and let the client handle any overloads... <collapsible-sidebar class="pr-0" :extension-tabs="leftExtensionTabs" :side="'left'" :width="340"> And you could then remove the rule: &.multi-file-commit-panel { padding-right: 0; }