diff options
author | Phil Hughes <me@iamphill.com> | 2018-05-04 17:26:55 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-05-04 17:26:55 +0300 |
commit | 8a21c31b8b2baf19b1433ab5175fbc8bd66d07c6 (patch) | |
tree | 9c22064915d04db3b43fe86bac78d205d26de0d4 /app/assets/javascripts/ide/components/ide_side_bar.vue | |
parent | 616c1c7294646e74706cb13be0517383a73b3c27 (diff) | |
parent | 9f2f8679bec1e2d4161c429c2e6db80a20e376c9 (diff) |
Merge branch '44846-improve-web-ide-left-panel-and-modes' into ide-sidebar-commit-box
Diffstat (limited to 'app/assets/javascripts/ide/components/ide_side_bar.vue')
-rw-r--r-- | app/assets/javascripts/ide/components/ide_side_bar.vue | 22 |
1 files changed, 22 insertions, 0 deletions
diff --git a/app/assets/javascripts/ide/components/ide_side_bar.vue b/app/assets/javascripts/ide/components/ide_side_bar.vue index 8015b245c2f..3f980203911 100644 --- a/app/assets/javascripts/ide/components/ide_side_bar.vue +++ b/app/assets/javascripts/ide/components/ide_side_bar.vue @@ -2,6 +2,7 @@ import { mapState, mapGetters } from 'vuex'; import ProjectAvatarImage from '~/vue_shared/components/project_avatar/image.vue'; import Icon from '~/vue_shared/components/icon.vue'; +import tooltip from '~/vue_shared/directives/tooltip'; import PanelResizer from '~/vue_shared/components/panel_resizer.vue'; import SkeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue'; import Identicon from '../../vue_shared/components/identicon.vue'; @@ -15,6 +16,9 @@ import SuccessMessage from './commit_sidebar/success_message.vue'; import { activityBarViews } from '../constants'; export default { + directives: { + tooltip, + }, components: { Icon, PanelResizer, @@ -29,6 +33,11 @@ export default { IdeReview, SuccessMessage, }, + data() { + return { + showTooltip: false, + }; + }, computed: { ...mapState([ 'loading', @@ -45,6 +54,16 @@ export default { (this.lastCommitMsg && !this.someUncommitedChanges) ); }, + branchTooltipTitle() { + return this.showTooltip ? this.currentBranchId : undefined; + }, + }, + watch: { + currentBranchId() { + this.$nextTick(() => { + this.showTooltip = this.$refs.branchId.scrollWidth > this.$refs.branchId.offsetWidth; + }); + }, }, }; </script> @@ -97,6 +116,9 @@ export default { </div> <div class="sidebar-context-title ide-sidebar-branch-title" + ref="branchId" + v-tooltip + :title="branchTooltipTitle" > <icon name="branch" |