Tooltip for long name file/directory

[nbao]

Is it possible to add a tooltip to the file name? Because the file and folder names are too long, I use CSS so that they can display properly.

.browser-widget .content ul:not(.ui-menu) li span{
  overflow: hidden;
  max-height: 4.3em;
  display: block;
}

But if there is a tooltip displaying the full file name, it would be better

[jcubic]

It should not be that hard, you only need to add the title attribute.

Do you want to contribute?

[nbao]

sure it's so easy line 828 add hide class const $li = $(<li class="file"><span>${file}</span><span class="hide">${file}</span></li>).appendTo($ul).attr('draggable', true);

and add css in the end

.browser-widget .content ul:not(.ui-menu) li > span:first-of-type {
  display: inline-block;
  overflow: hidden;
  max-height: 4.5em;
  text-overflow: ellipsis;
}

.browser-widget .content ul:not(.ui-menu) li span.hide {
  position: absolute;
  z-index: 10;
  top: 3em;
  left: 0;
  display: none;
  padding: 5px;
  white-space: nowrap;
  border: 1px solid #ccc;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.browser-widget .content ul:not(.ui-menu) li {
  position: relative;
  cursor: pointer;
}

.browser-widget .content ul:not(.ui-menu) li:hover > span.hide {
  display: block;
}

[jcubic]

Do you want to create a PR?

[nbao]

No i can't commit. could you do it.pls