diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue | 13 |
1 files changed, 10 insertions, 3 deletions
diff --git a/app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue b/app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue index 58aaeef45f2..4271f6053ed 100644 --- a/app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue +++ b/app/assets/javascripts/vue_shared/components/rich_content_editor/toolbar_item.vue @@ -1,20 +1,27 @@ <script> -import { GlIcon } from '@gitlab/ui'; +import { GlIcon, GlTooltipDirective } from '@gitlab/ui'; export default { components: { GlIcon, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { icon: { type: String, required: true, }, + tooltip: { + type: String, + required: true, + }, }, }; </script> <template> - <button class="p-0 gl-display-flex toolbar-button"> - <gl-icon class="gl-mx-auto" :name="icon" /> + <button v-gl-tooltip="{ title: tooltip }" class="p-0 gl-display-flex toolbar-button"> + <gl-icon class="gl-mx-auto gl-align-self-center" :name="icon" /> </button> </template> |