diff options
Diffstat (limited to 'app/assets/javascripts/nav/components/top_nav_app.vue')
-rw-r--r-- | app/assets/javascripts/nav/components/top_nav_app.vue | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/app/assets/javascripts/nav/components/top_nav_app.vue b/app/assets/javascripts/nav/components/top_nav_app.vue index 08a2c6952c8..ca6e6567f74 100644 --- a/app/assets/javascripts/nav/components/top_nav_app.vue +++ b/app/assets/javascripts/nav/components/top_nav_app.vue @@ -1,14 +1,18 @@ <script> -import { GlNav, GlNavItemDropdown, GlDropdownForm } from '@gitlab/ui'; +import { GlNav, GlIcon, GlNavItemDropdown, GlDropdownForm, GlTooltipDirective } from '@gitlab/ui'; import TopNavDropdownMenu from './top_nav_dropdown_menu.vue'; export default { components: { + GlIcon, GlNav, GlNavItemDropdown, GlDropdownForm, TopNavDropdownMenu, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { navData: { type: Object, @@ -21,15 +25,20 @@ export default { <template> <gl-nav class="navbar-sub-nav"> <gl-nav-item-dropdown - :text="navData.activeTitle" + v-gl-tooltip.bottom="navData.menuTooltip" data-qa-selector="navbar_dropdown" - :data-qa-title="navData.activeTitle" - icon="hamburger" + data-qa-title="Menu" menu-class="gl-mt-3! gl-max-w-none! gl-max-h-none! gl-sm-w-auto! js-top-nav-dropdown-menu" toggle-class="top-nav-toggle js-top-nav-dropdown-toggle gl-px-3!" no-flip no-caret > + <template #button-content> + <gl-icon name="hamburger" /> + <span v-if="navData.menuTitle" class="gl-ml-3"> + {{ navData.menuTitle }} + </span> + </template> <gl-dropdown-form> <top-nav-dropdown-menu :primary="navData.primary" |