dynamic elements in antispam badge
This commit is contained in:
parent
487d4e33af
commit
584bc32ec5
1 changed files with 17 additions and 5 deletions
|
|
@ -980,24 +980,36 @@ switch (message.command) {
|
||||||
|
|
||||||
chevron.onclick = (e) => {
|
chevron.onclick = (e) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
badgeText.style.transition = 'max-height 0.3s ease';
|
|
||||||
badgeText.style.maxHeight = badgeText.scrollHeight + 'px';
|
|
||||||
badgeText.style.whiteSpace = 'normal';
|
badgeText.style.whiteSpace = 'normal';
|
||||||
badgeText.style.overflow = 'hidden';
|
badgeText.style.overflow = 'hidden';
|
||||||
badgeText.style.textOverflow = 'unset';
|
badgeText.style.textOverflow = 'unset';
|
||||||
badgeText.style.padding = 'padding: 0px 8px;';
|
|
||||||
topRow.style.alignItems = 'flex-start';
|
topRow.style.alignItems = 'flex-start';
|
||||||
spamMenu.style.display = '';
|
spamMenu.style.display = '';
|
||||||
branding.style.display = 'none';
|
chevron.style.display = 'none';
|
||||||
brandingRow.style.maxHeight = '2em';
|
brandingRow.style.maxHeight = '2em';
|
||||||
brandingRow.style.opacity = '1';
|
brandingRow.style.opacity = '1';
|
||||||
chevron.style.display = 'none';
|
|
||||||
};
|
};
|
||||||
badge.onmouseover = () => { badge.style.opacity = '0.8'; };
|
badge.onmouseover = () => { badge.style.opacity = '0.8'; };
|
||||||
badge.onmouseout = () => { badge.style.opacity = '1'; };
|
badge.onmouseout = () => { badge.style.opacity = '1'; };
|
||||||
|
|
||||||
_addToolbarItem('mzta-toolbar-spam', badge);
|
_addToolbarItem('mzta-toolbar-spam', badge);
|
||||||
|
|
||||||
|
// After render: if text fits, show branding+menu inline and hide chevron;
|
||||||
|
// if text is truncated, show chevron and keep branding+menu hidden.
|
||||||
|
requestAnimationFrame(() => {
|
||||||
|
if (badgeText.scrollWidth > badgeText.clientWidth) {
|
||||||
|
// Text is truncated: show chevron, keep branding+menu hidden
|
||||||
|
chevron.style.display = 'inline';
|
||||||
|
branding.style.display = 'none';
|
||||||
|
spamMenu.style.display = 'none';
|
||||||
|
} else {
|
||||||
|
// Text fits: show branding+menu inline, hide chevron
|
||||||
|
chevron.style.display = 'none';
|
||||||
|
branding.style.display = '';
|
||||||
|
spamMenu.style.display = '';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
return Promise.resolve(true);
|
return Promise.resolve(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue