diff --git a/src/css/popup.css b/src/css/popup.css index 5f45f10..4234157 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -583,6 +583,10 @@ span ~ .panel-header-text { padding-inline-start: 4px; } +.container-panel-row .container-name.hidden-tabs { + opacity: var(--inactive-opacity); +} + .edit-containers-panel .userContext-wrapper { max-inline-size: calc(var(--overflow-size) + 203px); } diff --git a/src/img/container-focus.svg b/src/img/container-focus.svg new file mode 100644 index 0000000..4c9ac0b --- /dev/null +++ b/src/img/container-focus.svg @@ -0,0 +1,8 @@ + + diff --git a/src/js/popup.js b/src/js/popup.js index 433db3c..174be69 100644 --- a/src/js/popup.js +++ b/src/js/popup.js @@ -666,11 +666,15 @@ Logic.registerPanel(P_CONTAINERS_LIST, { const hasTabs = (identity.hasHiddenTabs || identity.hasOpenTabs); const tr = document.createElement("tr"); const context = document.createElement("td"); + const focus = document.createElement("td"); const manage = document.createElement("td"); + const openIdentities = Logic.identities().filter(i => i.hasOpenTabs); + const focusingOn = openIdentities.length === 1 ? openIdentities[0] : null; tr.classList.add("container-panel-row"); context.classList.add("userContext-wrapper", "open-newtab", "clickable", "firstTabindex"); + focus.classList.add("focus-container", "pop-button"); manage.classList.add("show-tabs", "pop-button"); manage.setAttribute("title", `View ${identity.name} container`); context.setAttribute("tabindex", "0"); @@ -683,7 +687,10 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
`; - context.querySelector(".container-name").textContent = identity.name; + const containerName = context.querySelector(".container-name"); + containerName.textContent = identity.name; + focus.title = escaped`Focus on ${identity.name} container`; + focus.innerHTML = "