2f4a232c41
Fix and improve tooltip logic - fx115: move main html-tooltip outside of the deck, otherwise it only shows up in the library tab. - Zotero_Tooltip is not required in the tabs bar and the button of the tag selector. Setting the tooltip attribute on the closest XUL parent and adding title attribute makes the tooltip properly appear. - Remove manual handling of the hover effect from tabs manu. The hover effect doesn't stick around after drag-drop with fx115 anymore, so it's not required. And then the usual title attribute works for the tooltip. - Set title instead of tooltiptext attribute in tagSelectorList so that the tooltip appears After zotero@8e2790e, the pointer effects don't fire on the actual cells of the table (only on the parent row), so the tooltips do not appear for the cells. This is a (hopefully) temporary solution to handle mousemove events over the row of the table, find the right cell that the mouse is over, and use Zotero_Tooltip to manually display the tooltip. Tweaked Zotero_Tooltip to create the fake tooltip and place it into the DOM. Zotero_Tooltip is also imported by virtualized-table as a module because one shouldn't have to load it in .xhtml file for every new window where the virtualized-table is used.
91 lines
1.7 KiB
SCSS
91 lines
1.7 KiB
SCSS
#zotero-tabs-menu-panel::part(content) {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
#zotero-tabs-menu-wrapper {
|
|
width: 350px;
|
|
background: var(--material-sidepane);
|
|
padding: 7px;
|
|
border-radius: 5px;
|
|
--width-focus-border: 2px;
|
|
}
|
|
|
|
#zotero-tabs-menu-filter {
|
|
margin: 0 0 7px 0;
|
|
border-radius: 5px;
|
|
border: 1px solid transparent;
|
|
padding-inline-start: 5px !important;
|
|
padding: 2px;
|
|
|
|
@media not (-moz-platform: windows) {
|
|
@include focus-ring;
|
|
}
|
|
}
|
|
|
|
#zotero-tabs-menu-list {
|
|
appearance: none;
|
|
margin: 0;
|
|
|
|
.row {
|
|
display: flex;
|
|
padding-inline-start: 4px;
|
|
}
|
|
|
|
.zotero-tabs-menu-entry {
|
|
@include focus-ring;
|
|
border-radius: 6px;
|
|
height: 22px;
|
|
margin: 0;
|
|
&.close {
|
|
width: 22px;
|
|
// Center the icon within the larger box
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
&[hidden] {
|
|
visibility: hidden;
|
|
}
|
|
}
|
|
&.title {
|
|
padding: 0;
|
|
padding-inline-start: 6px;
|
|
color: unset;
|
|
// Align label with the icon
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
&.selected {
|
|
font-weight: 600;
|
|
}
|
|
label {
|
|
overflow: hidden;
|
|
// override default description margins
|
|
margin-bottom: 0;
|
|
margin-block-start: 0;
|
|
// show as much of the description as possible
|
|
white-space: nowrap;
|
|
min-width: 280px;
|
|
text-overflow: ellipsis;
|
|
// Fx115: make label have the right width
|
|
max-width: 280px;
|
|
display: inline-block;
|
|
}
|
|
.tab-icon {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-inline-end: 4px;
|
|
}
|
|
}
|
|
|
|
&:hover {
|
|
background-color: var(--fill-quinary) !important;
|
|
}
|
|
&:active {
|
|
background-color: var(--fill-quarternary) !important;
|
|
}
|
|
}
|
|
#zotero-tabs-menu-dragged {
|
|
opacity: 0;
|
|
}
|
|
}
|