Clean up conditional `col-` classes in `nav_dropdown_button.vue`

Description

In the nav_dropdown_button.vue we are using old school bootstrap col classes and conditionally applying them. There's probably a flexbox solution that allows us to remove the conditional applying of utility classes.

Context

The following discussion from !24508 (merged) should be addressed:

• @mishunov started a discussion: (+1 comment)

  nitpick: we do not need to hardcode col-7 here as long as the Merge Request part that follows after, has a defined width (in the form of .col-5). We can make this part simpler:

  <span class="col-auto text-truncate flex-fill">...

  This will work for both scenarios.

  Unfortunately, it looks like this doesn't work 😞

  Before with col-7	With col-auto flex-fill

  I agree that there's probably a more flexy way to do this (without using row and col)... I'll create a follow up ~"Accepting merge requests" issue 😄