>Форум Mozilla Россия http://forum.mozilla-russia.org/index.php >Сustom Buttons http://forum.mozilla-russia.org/viewforum.php?id=34 >PaleMoon, панель All-tabs - подсветить активную вкладку http://forum.mozilla-russia.org/viewtopic.php?id=73487 |
mokujin > 22-04-2018 21:04:57 |
Привет. Через CSS можно подсветить любой сайт(все вкладки этого сайта) вычислив его по адресу. Примерно так(я весь стиль панели alltabs приводить не буду, только кусок стилей для сайтов, подсветка тенями разных цветов): скрытый текст Выделить код Код:button.allTabs-preview[image*="vk.com"] > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #00A0FF !important; } button.allTabs-preview[image*="youtube.com"] > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #D24000 !important; } button.allTabs-preview[image*="forum.palemoon.org"]:not(:focus) > stack > .allTabs-preview-inner, button.allTabs-preview[image*="forum.mozilla-russia.org"]:not(:focus) > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #AE4FFF !important; } button.allTabs-preview[image*="addons.palemoon.org"]:not(:focus) > stack > .allTabs-preview-inner, button.allTabs-preview[image*="mozilla.net"]:not(:focus) > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #00CB33 !important; } button.allTabs-preview[image*="wikipedia.org"] > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #B4B4B4 !important; } /*button.allTabs-preview[image*="alternatio.org"] > stack > .allTabs-preview-inner > .tabPreview-canvas */ button.allTabs-preview[image*="alternatio.org"] > stack > .allTabs-preview-inner { box-shadow: 0px 0px 2px 5px #A9D083 !important; } там всё одно: canvas внутри div и все, никаких больше аттрибутов нет у ячеек. Скрин ![]() Вот такой вот вопросс: как\можно ли, из CB добавить в эту панель аттрибут "активная вкладка" чтоб его можно было подсветить из CSS ? или сразу, из CB вычислить и подсветить активную вкладку в этой панели. Прошу помощи у знатоков, собаку съевших. |
Dumby > 23-04-2018 00:11:20 |
скрытый текст Выделить код Код:((panel, attr = "selected-tab") => addEventListener("popupshowing", { style: ` #allTabs-panel button.allTabs-preview[${attr}] { outline: 8px solid red !important; outline-offset: -4px !important; } `, handleEvent(e) { var url = "data:text/css," + encodeURIComponent(this.style), type; var dwu = window.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils); dwu.loadSheetUsingURIString(url, type = dwu.USER_SHEET); addDestructor(() => { dwu.removeSheetUsingURIString(url, type); this.TabSelect(); }); delete this.style; (this.handleEvent = e => this[e.type](e))(e); }, popupshowing(e) { if (e.defaultPrevented) return; this.TabSelect(true); panel.addEventListener("popuphidden", this); gBrowser.tabContainer.addEventListener("TabSelect", this); }, popuphidden() { panel.removeEventListener("popuphidden", this); gBrowser.tabContainer.removeEventListener("TabSelect", this); }, TabSelect(e) { var btn = panel.querySelector(`button.allTabs-preview[${attr}]`); if (btn) btn.removeAttribute(attr); if (e) for(var btn of panel.querySelectorAll("button.allTabs-preview")) if (btn._tab.selected) { btn.setAttribute(attr, true); break; } } }, false, panel))(document.getElementById("allTabs-panel") || 1); |