fix: center the update action tooltip

Remove the duplicate native title tooltip and center the single custom update hint directly below the available-update action.
This commit is contained in:
Sucukdeluxe
2026-08-21 00:21:33 +02:00
parent e09cbcad8d
commit e73143e2b7
5 changed files with 8 additions and 7 deletions
-1
View File
@@ -820,7 +820,6 @@ function _syncHeaderUpdateState() {
button.tabIndex = available ? 0 : -1;
button.setAttribute('aria-busy', _updateCheckBusy ? 'true' : 'false');
button.setAttribute('aria-label', hint);
button.title = hint;
button.dataset.tooltip = hint;
_setHeaderUpdateLabel(_updateCheckBusy ? 'Prüfen…' : (available ? 'Update verfügbar' : 'Update'));
}
+1 -1
View File
@@ -55,7 +55,7 @@
<div class="header-spacer" aria-hidden="true"></div>
<div class="header-cluster header-utilities">
<div class="header-update-slot" id="headerUpdateSlot" aria-hidden="true">
<button class="header-update-button" id="headerUpdateBtn" title="Nach Aktualisierungen suchen" aria-label="Nach Aktualisierungen suchen" data-tooltip="Nach Aktualisierungen suchen" tabindex="-1" disabled>
<button class="header-update-button" id="headerUpdateBtn" aria-label="Nach Aktualisierungen suchen" data-tooltip="Nach Aktualisierungen suchen" tabindex="-1" disabled>
<svg class="header-action-icon" aria-hidden="true"><use href="#icon-download"></use></svg>
<span class="header-update-label">Update</span>
</button>
+4 -3
View File
@@ -2172,7 +2172,8 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
content: attr(data-tooltip);
position: absolute;
top: calc(100% + 10px);
right: 0;
left: 50%;
right: auto;
width: max-content;
max-width: min(240px, calc(100vw - 24px));
padding: 8px 10px;
@@ -2188,7 +2189,7 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
white-space: normal;
opacity: 0;
pointer-events: none;
transform: translateY(-3px);
transform: translate(-50%, -3px);
transition: opacity .14s, transform .14s;
z-index: 80;
}
@@ -2196,7 +2197,7 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; }
.header-update-button:hover::after,
.header-update-button:focus-visible::after {
opacity: 1;
transform: translateY(0);
transform: translate(-50%, 0);
}
.header-update-button:hover {