Was in der Nightly gut aussieht, ist in der aktuellen Final 109 leicht verrückt.
Das kann ich auch sagen, musste schon einiges nachbessern.
Beiträge von FuchsFan
-
-
Das würde dann alle Popup betreffen, und es müsste dann zusätzlich wieder an vielen Stellen nachgearbeitet werden.
CSSmenupopup > menuitem{ padding-left: 40px !important; } -
Mit meinem Code aus #4 ist der Haken auch bei deaktivierten Plugins weg - es braucht also diesen zweiten Code eigentlich nicht...
Habe ich nicht probiert, spreche sie einzeln an, dann weiß ich wenigsten was gemeint ist.
-
Der "Haken" erscheint auch im 3-Punkte-Menü der Plugins.
Habe ich geändert, danke.
Bei deaktivierten Plugins ist dann auch der Haken da, lässt sich dann damit ausblenden.
CSSplugin-options > panel-list > panel-item[action="never-activate"]::part(button) { background-image: none !important; } -
Im 3-Punkte-Menü der Addons taucht seit Firefox 110 ein Mülltonnen-Icon auf.
Danke für den Hinweis. Die Icons hatte ich hier immer noch im Original (also auch die Mülltonne), hast Du das abgeändert?
-
Probiers mal damit:
Ich danke dir, das funktioniert prima. In der Zwischenzeit habe ich auch noch diesen Weg gefunden, nur etwas abgeänderte Version.
CSS#page-options > panel-list > panel-item[action="set-update-automatically"]::part(button) { background-image: none !important; }Damit ist das Thema erledigt.
-
Im Code wird das Icon damit ausgegeben:
Code:host([checked]) button { background-image: url("chrome://global/skin/icons/check.svg"); }sieht damit dann so aus:
Was muss ich machen, um den dort weg zu bekommen?
-
Kann und darf ja jede(r) machen, wie er/sie will.
Genau!
-
Seit einiger Zeit nervte es mich, dass es unter "Extra" Browser-Werkzeuge
und im "Hamburgermenü" Weitere-Werkzeuge hieß.
Im Hamburger auch "Browser-Werkzeuge".
-
Der sorgt für den Aufruf zur Nutzung von Shadow Dateien.
Ahhhhhhh, und der zweite dann nur um die Datei aufzurufen. Wieder was gelernt, es wird genutzt, funktioniert, und dann fragt man auch nicht. Erst wenn gebastelt wird, dann wacht man auf.
Danke, Andreas!
-
Und die Datei darin rufe ich dann damit auf:
Das funktioniert auch, nur was macht dann der erste Code (ist in meinem Script ja auch enthalten)?
Teste bitte mal:
Auch das hast Du wieder sehr gut gemacht, danke.
-
Das ist doch nur zum Aufruf der Dateien, und hat kein eigenes Icon.
Doch, Button mit Icon.
Code
Alles anzeigen// userChromeShadow.uc.js by aborix // 28.07.2022 FF104+ Fix: using PathUtils.join (Sören Hentzschel) // https://www.camp-firefox.de/forum/thema/132865-shadowroot-neue-aufruf-methode-f%C3%BCr-css-regeln-wichtiges-update-28-07-2022/?postID=1175307#post1175307 (async function() { if (location != 'chrome://browser/content/browser.xhtml') return; try { let path = PathUtils.join(PathUtils.profileDir, 'chrome', 'userChromeShadow.css'); let cssIn = await IOUtils.readUTF8(path); let sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService); let uri = makeURI('data:text/css;charset=UTF=8,' + encodeURIComponent(cssIn)); sss.loadAndRegisterSheet(uri, sss.AUTHOR_SHEET); } catch(e) { console.log("UserChromeShadow-Error: " + e.name + ': ' + e.message ); }; })(); // legt einen Button für userShadow.css (im Ordner chrome) an, und ruft die Datei direkt auf (function() { if (location != AppConstants.BROWSER_CHROME_URL) return; try { Components.utils.import("resource:///modules/CustomizableUI.jsm"); CustomizableUI.createWidget({ id: "OpenCSSShadowbutton", defaultArea: CustomizableUI.AREA_NAVBAR, removable: true, label: "OpenCSSShadowbutton", tooltiptext: "userChromeShadow.css", onClick: function() { var dir = Services.dirsvc.get('UChrm', Ci.nsIFile); dir.append('userChromeShadow.css'); // dir.append('Test.css'); dir.launch(); }, onCreated: function(aNode) { aNode.style.listStyleImage = 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAABqUlEQVQokWP89OkTAymABc76+fb99YnzXuw7xsrP67RpLiMzMz4NXx8/2+eV8OXhE05JMW45KQYGRgI2nM6r//r4qemEeuX4ELjZf7//+PX+I6eUOLIGJgYGhm9PXrzYf1wuyEslKRyu+sW+Yxs0HDdqO3958ARDw9Pn///9EzbRRZY4XdjIwMCgXZbJKSmGroFdSJCBgeHL/ccI4f//v9x/LOFgqVuZzczOxvD//49Xb/7//QvVwKMkJ6Ctdm/xurdnLqF4kImRgYHh9+cv+3yTNqg53Ji8AKqBkZnJdEI9AwPDHvfYQ+HZ13pn/f//H67r5tRFLw+dlPFxFnewhGpgYGAQMTd03r5QxNzgxb6jN6ct/v/nL1zD5zsPmNjYzGe0CRloMSBHnJChjvO2hb8/f2VkYvzz5SsDAwMTKwsDA8N/BgZGRgZGRiaEp5EBKy/3wzXbNht6MjAwSDrbMGAAFixCXJx86koKod4KYT5EaZAP9ZYP9YZzf3/6wsDIyMjMhFMDHHx79vJQaOaHKzfF7S2YOdix+wEF/P/PyMoiH+JlOacTLgYAnMqRpg2c0p8AAAAASUVORK5CYII=)'; return aNode; } }); } catch (e) { Components.utils.reportError(e); }; })(); -
Wie immer...gern geschehen
Hast Du das userChromeShadow.uc.js by aborix bei Dir auch geändert? Schaffe ich auch nicht.
-
Teste bitte mal:
Perfekt, Andreas, danke!
-
Bekomme es in diesem Script nicht eingebaut.
Bitte helfen!JavaScript
Alles anzeigen// buttonCloseTab.uc.js - Button > Firefox Tabs schliessen (function() { if (location != 'chrome://browser/content/browser.xhtml') return; try { Components.utils.import("resource:///modules/CustomizableUI.jsm"); CustomizableUI.createWidget({ id: "fp-closetabs", defaultArea: CustomizableUI.AREA_NAVBAR, removable: true, label: "Aktuellen Tab schließen", tooltiptext: "Aktuellen Tab schließen", onClick: function() { BrowserCloseTabOrWindow(); }, onCreated: function(aNode) { aNode.style.listStyleImage = 'url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" color="brown" width="12" height="12" viewBox="0 0 16 16"><path fill="currentColor" fill-opacity="context-fill-opacity" d="M9.414 8l5.293-5.293a1 1 0 0 0-1.414-1.414L8 6.586 2.707 1.293a1 1 0 0 0-1.414 1.414L6.586 8l-5.293 5.293a1 1 0 1 0 1.414 1.414L8 9.414l5.293 5.293a1 1 0 0 0 1.414-1.414z"></path></svg>\')'; return aNode; } }); CustomizableUI.registerToolbarNode(tb); } catch (e) { Components.utils.reportError(e); }; })(); -
Das Ding braucht bald eine zweibändige Ausgabe, wenn die Änderungen weiter so reinfluten .
Nun ist aber genug Material da, können alle basteln wie sie möchten.
-
Und wenn er dann zu schwer ist, dann startet er nicht mehr
Dann gibt es noch den Turbo-Lader.
-
Mir ist das aktuell zu viel Aufwand, den Button oder den Inhalt anzupassen. Wie schon geschrieben, wird sich da zukünftig noch einiges ändern. Und so schlimm finde ich den Button nicht. Hab mich schon daran gewöhnt.
Und es werden sich alle daran gewöhnen, ist nur der erste Schreck, wieder umgewöhnen.
Weil es für Dich zu viel Aufwand ist, so mache ich Dir ein Geschenk (für alle Anderen natürlich auch), hier die zweite Bastelvorlage.
CSS
Alles anzeigen@-moz-document url-prefix(chrome://browser/content/browser.xhtml) { /* Eigenes Icon für Button in der Symbolleiste */ #unified-extensions-button > .toolbarbutton-icon { list-style-image: url("..//icons/0502.png") !important; opacity: 0.8 !important; } /* Popup-Menü HG und Border */ #unified-extensions-view.cui-widget-panelview{ background-color: gainsboro !important; border: 4px solid royalblue !important; padding: 0 10px 0 10px !important; width: 1000px !important; } /* grid */ #unified-extensions-area, .unified-extensions-list { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; } /* Überschrift "Erweiterungen" */ #unified-extensions-view.cui-widget-panelview vbox.panel-header h1 span { color: #881111 !important; font-size: 1.8em !important; display: flex !important; justify-content: center !important; } /* Namen der Erweiterung */ .unified-extensions-item-contents label.unified-extensions-item-name{ color: gainsboro !important; font-size: 1.2em !important; font-weight: 700 !important; margin-top: -1px !important; margin-left: -5px !important; } /* Zusatzbeschriftungen der Button ausgeblendet */ #unified-extensions-area .unified-extensions-item-message-deck .unified-extensions-item-message, .unified-extensions-list .unified-extensions-item-message-deck { display: none !important; } /* Größe der Icons aller Erw. */ panel .unified-extensions-item[unified-extensions="true"] .webextension-browser-action > .toolbarbutton-badge-stack > .toolbarbutton-icon, .unified-extensions-list toolbarbutton .unified-extensions-item-icon { height: 20px !important; width: 20px !important; } /* Button der aktiven Erw. */ #unified-extensions-panel toolbaritem.unified-extensions-item { max-width: unset !important; width: 320px !important; height: 40px !important; background-color: #552211 !important; margin: 1px !important; border-radius: 4px !important; padding: 0 2px !important; } /* Button der aktiven Erw. bei Hover HG farbig */ #unified-extensions-panel toolbaritem.unified-extensions-item:hover { background-color: black !important; } /* Button der inaktiven Erw. */ .unified-extensions-list .unified-extensions-item { max-width: unset !important; width: 315px !important; height: 40px !important; background-color: #662211 !important; opacity: 0.85 !important; margin: 1px !important; border-radius: 4px !important; padding: 0 2px !important; } /* Button der inaktiven Erw. bei Hover HG farbig */ .unified-extensions-list .unified-extensions-item:hover { background-color: black !important; } /* bei Hover grauer HG der Button ausgeblendet */ #unified-extensions-area:hover.customization-target .toolbarbutton-1.unified-extensions-item-action-button.subviewbutton.panel-no-padding.webextension-browser-action { background-color: transparent !important; } .unified-extensions-item-action-button { overflow: visible !important; } /* Icons aktive Erw. */ #unified-extensions-area image.toolbarbutton-icon { opacity: 1 !important; margin-left: 2px !important; padding: 0 !important; } /* Icons inaktive Erw. */ .unified-extensions-list image.unified-extensions-item-icon { opacity: 1 !important; margin-left: -4px !important; padding: 0 !important; } /* Button mit dem Zahnkranz (Verwalten) / aktive Erw. */ #unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic{ background-color: black !important; border: 1px solid gainsboro !important; min-width: 32px !important; max-width: 32px !important; max-height: 32px !important; margin-left: -94px !important; color: orange !important; } /* bei Hover*/ #unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic:hover{ background-color: #D1E2F2 !important; border: 1px solid brown !important; min-width: 32px !important; max-width: 32px !important; max-height: 32px !important; margin-left: -94px !important; } /* Zahnkranz aktive Erw. bei Hover andere Farbe */ #unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional:hover toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon { fill: forestgreen !important; } /* Button mit dem Zahnkranz (Verwalten) / inaktive Erw. */ .unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic{ background-color: black !important; border: 1px solid gainsboro !important; min-width: 32px !important; max-width: 32px !important; max-height: 32px !important; margin-left: -84px !important; color: orange !important; } /* bei Hover */ .unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic:hover{ background-color: lightyellow !important; border: 1px solid brown !important; min-width: 32px !important; max-width: 32px !important; max-height: 32px !important; margin-left: -84px !important; } /* Zahnkranz inaktive Erw. bei Hover andere Farbe */ .unified-extensions-item-menu-button:hover .toolbarbutton-icon { fill: magenta !important; } /* Zahnkranz aktive Erw. / Icon */ #unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon { margin-left: -1px !important; } /* Zahnkranz inaktive Erw. / Icon */ #unified-extensions-view.cui-widget-panelview vbox.panel-subview-body vbox.unified-extensions-list unified-extensions-item.unified-extensions-item toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon { margin-left: -1px !important; } /* Button unten "Erweiterungen verwalten" */ #unified-extensions-manage-extensions { background-color: #f0f0db !important; margin-left: 365px !important; max-width: 250px !important; max-height: 30px !important; min-height: 30px !important; border: 1px solid grey !important; border-width: 3px !important; border-style: double !important; color: #5511aa !important; } /* bei Hover */ #unified-extensions-manage-extensions:hover { background-color: #D1E2F2 !important; color: brown !important; margin-left: 365px !important; margin-right: 0 !important; } /* Text "Erweiterungen verwalten" */ [data-l10n-id="unified-extensions-manage-extensions"] { color: gainsboro !important; font-size: 1.4em !important; font-weight: 600 !important; padding-left: 0px !important; display: flex !important; justify-content: center !important; } /* Text "Erweiterungen verwalten" verlagert */ #unified-extensions-manage-extensions.subviewbutton.panel-subview-footer-button.unified-extensions-manage-extensions label.toolbarbutton-text { margin: -7px 0 0 0 !important; } } -
Es funktioniert jetzt, und zwar genau, wie es soll.
Ich habe auch die Datei Symbole.css noch einmal aufgestellt , es wird alles angezeigt (habe ich vorher wohl oberflächlich gemacht
).Hier der Inhalt mit allen betreffenden Einträgen:
CSS
Alles anzeigen@-moz-document url(chrome://browser/content/browser.xhtml) { .unified-extensions-context-menu-pin-to-toolbar { background: url("file:///C:/FoxIcons/0804.png") no-repeat !important; background-position: 9px 4px !important; } .unified-extensions-context-menu-manage-extension { background: url("../icons/001.png") no-repeat !important; background-position: 9px 4px !important; } .unified-extensions-context-menu-remove-extension { background: url("../icons/001.png") no-repeat !important; background-position: 9px 4px !important; } .unified-extensions-context-menu-report-extension { background: url("../icons/001.png") no-repeat !important; background-position: 9px 4px !important; } .customize-context-manageExtension { background: url("file:///C:/FoxIcons/0804.png") no-repeat !important; background-position: 12px 2px !important; } .customize-context-removeExtension { background: url("../icons/001.png") no-repeat !important; background-position: 12px 2px !important; } .customize-context-reportExtension { background: url("../icons/001.png") no-repeat !important; background-position: 12px 2px !important; } /* Icon eingefügt bei "Erweiterungen verwalten" */ #unified-extensions-manage-extensions::before { margin-left: 90px !important; margin-right: -10px !important; content: '' !important; display: block !important; width: 19px !important; height: 24px !important; background-image: url("file:///C:/FoxIcons/0804.png"); filter: invert(.9); background-repeat: no-repeat !important; background-position: 4px 6px !important; background-size: 16px 16px !important; } }Hier das Ergebnis:
Dann viel Spaß weiterhin.
Gratulation noch zu Deiner Datei, ist ja Wahnsinn.
-
Keine Ahnung was du genau gemacht hast
Kann auch nicht sagen, was ich gemacht habe, aber im Kontext-Menü der Button (Symbolleiste) wollen hier auch nicht die Icon erscheinen. Alles versucht, Selektoren gewechselt, erweitert, aber nichts zu machen. Nur Kontext neuer Button, keine Probleme. Eine Datei Symbole.css angelegt, nur die betreffenden Code-Teile genommen, alles Übrige raus, trotzdem keine Anzeige in der Symbolleiste (andere ja)
Nehme ich dann wieder meine ursprüngliche Einteilung vor, so wird wieder alles sauber angezeigt.
