From 3361bbf058e0b9edb321a537e03cd196ae255873 Mon Sep 17 00:00:00 2001 From: delvh Date: Thu, 16 Feb 2023 06:57:25 +0100 Subject: [PATCH] Add `title` to PR file tree items (#22918) Previously, a file/directory name was simply cut when it was too long. Now, we display the browser-native tooltip (`title`) instead, so you can still see it when hovering over it. In this case, we don't use the normal `tippy` tooltips for three reasons: 1. Vue components are not included in the global tooltip initialization 2. Vue components would need to initialize their tooltips themselves whenever their content is changed 3. The tooltips are shown too long under the default configuration (the tooltip one element above is still shown when hovering on the element below) Fixes #22915 ## Appearance ![image](https://user-images.githubusercontent.com/51889757/219049642-43668a38-0e86-42bf-a1d0-3742c4dc7fd9.png) ## Room for future improvement We could think about displaying the whole file path in the title, not just its name. This is not done at the moment: ![image](https://user-images.githubusercontent.com/51889757/219050689-1e6e3d57-f2bf-48be-8553-415e744a6e10.png) --------- Co-authored-by: techknowlogick --- web_src/js/components/DiffFileTreeItem.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/web_src/js/components/DiffFileTreeItem.vue b/web_src/js/components/DiffFileTreeItem.vue index 245286dde..f0a3d909b 100644 --- a/web_src/js/components/DiffFileTreeItem.vue +++ b/web_src/js/components/DiffFileTreeItem.vue @@ -1,5 +1,6 @@