Beiträge von Horstmann

Horstmann

Zitat von Mira_Belle

Eventuell jetzt:

Sieht hier gut aus soweit!

Horstmann

Taucht hier auf im tagesaktuellen Fx Release und Nightly.
Der Button ist dafür idealerweise auf On gesetzt (nicht ausgegraut).

Horstmann

Zitat von Mitleser

Zitat von Horstmann

von mir mit separatem Button für den Positionswechsel der Leiste

Das wirst du sicherlich in der finalen Version noch ändern (Dropdown oder freie Maustasten).

Mir gefällt die Idee mit dem separatem Button für Position, eigentlich nur damit der User den dann in irgenwo hinschieben kann bei Bedarf, oder rausziehen und gar nicht benutzen kann. Den Rechtsklick will ich auch nicht verändern.
Angesichts der zurückhaltenden Respons habe ich aber eh keine Releasepläne momentan, wenn's eh kaum jemand benutzt ; deine Variante hat ja wenigstens keine Alternative von Aris etc..

Jetzt aber erstmal viel Spaß mit dem Scooter!

Horstmann

Es bringt für deine Zwecke wohl nicht viel, aber hier ist eine momentane grobe Testversion von mir mit separatem Button für den Positionswechsel der Leiste; bezogen auf meine feststehende Leiste, aber das gleiche Prinzip.

Mit der Entwicklung ist momentan leider hier nichts los im Forum.

00-toolbar_test-54-RC5-B-width+button-4.uc.js.zip

Horstmann

Zitat von Mitleser

Vielleicht irgendetwas mit Windows.window...

Bei meinen sehr beschränkten JS Kenntnissen kann ich dich leider nur wieder auf Aris verweisen, und gewagterweise auf mein eigenes Script.

Beide benutzen Services.wm.getEnumerator um die Button Funktion auf alle Fenster zu erweitern bzw. in meinem Fall optional auch einzuschränken. Bei Aris funktioniert übrigens auch der Elchtest, sein Button ist aber nur für Funktion in allen Fenstern angelegt.

Ich hab ein paar Dinge probiert, aber in deinem Script kann ich als armer Laie die Variablen und Zusammenhänge nicht komplett nachvollziehen.

Horstmann

Zitat von .DeJaVu

Insgesamt ist dieses Forum Anlaufstelle #1 für DACH, mozillazine für US.

Was'n "Dach", ein Dackel ohne "shund" ?

Mozillazine, abgesehen davon dass mir das Design die Wimpern flechtet, ist v.a. ein müder Aufguss von dem was auf den Firefox Reddits zu finden ist - was wiederum die #1 Foren-Quelle für Fx allgemein und Fx CSS ist.

Horstmann

Zitat von Mitleser

Zitat von Horstmann

Ich hatte inzwischen mal kurz in meiner Toolbarversion diese Arislösung für nicht funktionierende Buttons angetestet in Fx 144, schien hier zu klappen.

Die Lsg. von Aris hatte ich auch in Betracht gezogen, die macht den Quellcode aber noch anfälliger für Veränderungen durch Updates. Deshalb bin ich bei der Patchlsg. geblieben.

Zitat von Horstmann

Zeile 133 bis 151, für bar in Zeile 148 hatte ich halt meine eigene toolbar ID eingesetzt

Verstehe ich nicht???

Der zweite Teil bezieht sich nur auf die davor erwähnte Aris Lösung und seinen Code, hatte ich evtl. nicht klar zusammengefasst.

Zitat von Mitleser

Zitat von Horstmann

Dein Button funktioniert hier nicht mit dem Elchtest

Mit der Elchtestproblematik kann ich leben, diese Konstellation ist wohl eher selten. Die On/Off-funktion funktioniert ja in einem zweiten geöffneten Fenster unabhängig vom Ersten. Die Links/Rechts-funktion leider nicht (Vorschläge??

Dein Button scheint in bestimmten Konstellationen die on/off und links/rechts Funktionen bei mehreren offenen Fenster durcheinander zu bringen, wobei ich das Problem leider nicht exakt reproduzieren kann.
Beides funktioniert hier generell in mehreren offenen Fenstern, aber nicht immer konsistent.

event.target.ownerGlobal könnte damit zusammenhängen, wobei ich offengestanden immer noch nicht weiß was das bewirkt.

Evtl. müssen die beiden Funktionen oder deren Präferenzen klarer getrennt/im Zusammenhang definiert werden?

Bzgl. Elchtestproblematik, bei mir am Mac kann ich damit nicht leben, eben weil Fx als Programm sich nicht beendet wenn alle Fenster geschlossen sind, und ein Button ohne den Fix dann nur nach Neustart von Fx wieder funktioniert.

Horstmann

Zitat von Mira_Belle

Horstmann Wenn kein Text markiert ist, wird, bzw. sollte, die komplette Page übersetzt werden!
Probiere es doch mal mit dem Google-Skript aus,
denn genau so WAR das DeepL-Skript ja auch aufgebaut!

Ach deshalb wird mit dem Googlescript die gleiche Seite in neuem Tab geladen - war mir entgangen dass sich die Sprache dann geändert hat.

Hab mir ein Googlescript mit zusätzlicher Trennlinie und etwas CSS mal abgeändert für die Positionierung, das scheint so weit zu passen; zum Thema DeepL fällt mir leider nichts ein.

Horstmann

Es geht evtl. haarscharf am Thema vorbei oder könnte ein eigenes sein, aber dieses Script und ähnliche sollen doch vor allem dann eine Übersetzung anbieten, wenn ein Text ausgewählt ist.

Ich habe mir einige Varianten angeschaut und rumprobiert, aber konnte keine Lösung finden, die nur dann den Übersetzer als menuitem in das Kontextmenü einträgt, wenn eben Text tatsächlich ausgewählt ist.
Sonst ist es ja nur ein Linkbutton zur Übersetzer Webseite.

Die Frage v.a. deshalb, weil das Kontextmenü so viele Einträge je nach Situation zeigt oder versteckt, dass ich es via CSS oder auch im Script schwierig finde, den Übersetzer Schalter korrekt zu positionieren.

Einfacher wäre es wenn er nur bei Bedarf/Textauswahl überhaupt erscheint, dann kann man in zB ganz nach oben packen.

Horstmann

Funktioniert hier am Mac.

Zwei Dinge:

Ich hatte inzwischen mal kurz in meiner Toolbarversion diese Arislösung für nicht funktionierende Buttons angetestet in Fx 144, schien hier zu klappen.

Zeile 133 bis 151, für bar in Zeile 148 hatte ich halt meine eigene toolbar ID eingesetzt => document.getElementById("newtoolbar").addEventListener...etc .

Dein Button funktioniert hier nicht mit dem Elchtest, wie auch in der alten Version von deinem Script, s. Beschreibung der Problematik im Link.

Horstmann

Zitat von Dato

Zitat von Horstmann

funktioniert das denn

mit deinem CSS klappt das nicht so.
Das haut mein anderes CSS durcheinander für meine Tableiste.
Bvon Andreas nicht.

Seufz...

Horstmann

Zitat von Dato

Danke auch für dein css,

Ja und, funktioniert das denn, etwas Feedback?

Horstmann

Zitat von Sören Hentzschel

Tja, auch darauf muss man erst einmal kommen, dass mitten in einem deutschen Satz völlig wahllos ein englischer und definitiv nicht alltäglicher Begriff eingebaut wird, der dann auch noch aus der englischen Umgangssprache kommt, die ich ja schon im Deutschen versuche, weitestgehend zu vermeiden. Auf die Idee wäre ich überhaupt nicht gekommen. Aber das ist gut, denn das unterstreicht genau meinen Punkt.

Dein Punkt gehört und zur Kenntnis genommen.

OP und lingo muss man nicht kennen, es sind aber sehr geläufige Begriffe für jemanden, der sich ab und an aus dem deutschsprachigen online Umfeld herausbewegt - was du doch eigentlich auch tust?

Zu Sprachreinheit brauche ich übrigens keine Ratschläge, aber ich weiss es ist eine Obsession von dir - schön dass sich junge Leute noch die Mühe machen, auch wenn es entschieden off-topic (ausserhalb des Themas) ist.

Meine online Aktivitäten bewegen sich zu 90% im englischen Sprachraum, daher die Überschneidungen; wer Fragen hat kann fragen, wie der OP.

Vielleicht können wir dann zum Thema zurückkehren; welches Tabs CSS Code betrifft, der permanent falsch benutzt wird - bestimmt auch von mir - und sehr häufig zu Fragen führt.

Horstmann

Zitat von Sören Hentzschel

Am besten bleibt man einfach bei deutschen Begriffen ohne Abkürzung, die versteht jeder.

Mit deshalb ist die Forensuche intern und extern oft problematisch, weil jeder seine eigenen Übersetzungen von jedem UI (Benutzeroberfläche ) Teil kreiert.
Ich bleibe bei meiner Lingo, vor allem wenn es weniger Buchstaben braucht (Button => Schaltfläche ??).

Dato , hier mal eine Art von CSS das ich für den Zweck benutze, es gibt da viele mögliche Varianten, ist auch abhängig von mehreren Variablen.

CSS

.tabbrowser-tab[multiselected] .tab-background {
    background-color: orange !important;
    outline-color: lightgreen !important;
    background-image: none !important;
}

.tabbrowser-tab[multiselected]:not([selected]):hover .tab-background {
    background-color: darkorange !important;
    outline-color: green !important;
}

.tabbrowser-tab[multiselected]:not([selected], :hover) .tab-content {
    color: red !important;
}

Alles anzeigen

Horstmann

Zitat von Dato

was ist ein OP ?

Ein Operationssaal.
Oder ein Original Poster, der ursprüngliche Beitragsersteller - also du.

Horstmann

Zitat von 2002Andreas

Teste bitte:

CSS

.tab-content[multiselected] {
    background: red !important;
    color: white !important;
    border: 4px solid blue !important;
  }

Der Tabhintergrund ist generell tab-background, der Code oben setzt HG und Umrandung an die falsche Stelle und verfälscht das Tabdesign .
Die Umrandung ist ausserdem eine existierende outline, die man anpassen könnte, statt eine border drauf zu zwingen.
Hier dann evtl. für die Text-Farbe.
multiselected und selected könnte man sich dann auch noch im Zusammenhang zueinander anschauen, u.a..

Wenn der OP das nicht bemerkt, ist es ja ok, nur zur Info.
Getestet von Garten Eden bis FX144.

Horstmann

Zitat von lenny2

Ich mache mir Sorgen um aufgeblähten Code, deshalb verwende ich weiterhin V7R2

Prima dass es zu klappen scheint!
Der extra Code in späteren Versionen ist vorwiegend optional, sollte also kaum oder keinen Einfluss auf Performance haben, und wird für Funktionen ignoriert falls nicht aktiviert.

Horstmann

Version 10/ Fix:

Bitte den Header und die Kommentare in der User Einstellungen Sektion vor Änderungen lesen; zwei mögliche Lösungen für störrische Themes können optional benutzt werden, und für Lenny hätten wir noch eine Space & Separator Script Lösung #102 (gefühlt).
Dieses Script wurde auch gerade erneuert.

Einige weitere Optionen sind hinzugefügt, speziell für Abmessungen; eine Autovariante hätte ich auch dafür, aber so schwer ist es nicht das manuell zu regeln.
Sowas könnte Sinn machen noch mit rein zu packen, aber dazu braucht es Feedback.

JavaScript

// Zusaetzliche Toolbars wahlweise rechts, links, unten

// Use filename starting with 00 for custom button functions !! =>
// 00_extra_toolbars_V10.uc.js

// Basiert auf: https://www.camp-firefox.de/forum/thema/137714-seitennavigation-fly-out-menue
// Aris: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/addonbar_vertical.uc.js
// Forumthema: https://www.camp-firefox.de/forum/thema/139927-eigene-zusatzleisten-ab-ff-143/
// Kudos an Aris und Mitleser fuer Vorarbeit, Loesungen und Tips

// ACHTUNG: Einige Systembuttons lassen sich in zusaetzliche/eigene Tb's zwar noch verschieben, haben aber KEINE Funktion.
// Dazu gibt es einen Patch von @BrokenHeart:  https://www.camp-firefox.de/forum/thema/138875-fix-toolbar-buttons-reagieren-nicht-mehr-ab-ff-134/

// Version V10 / Release 5

(function() {
    if (location.href !== 'chrome://browser/content/browser.xhtml')
        return;

// User Einstellungen
// Nach Script Aenderungen Neustart mit Start-Cache loeschen => about:support
// Moegliche Problemloesungen (s. unten) muessen wo noetig manuell an/ausgeschaltet werden

        // Eigenes Icon, in Profilordner/chrome/icons Ordner
        let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));
        let IconPath = '/chrome/icons/';
        let Icon_tb = 'toolbar_n3.svg';
        let ImagePath = ProfilePath + IconPath + Icon_tb;

        // 0 Firefox Icon, 1 eigenes Icon benutzen
        let new_tb_icon  = 0;

        // Position Startzustand: 0 Rechts, 1 Links, 2 Bottom
        let new_tb_loc = 0;

        // 0 letzter Zustand Leiste On/Off beim Beenden merken, 1 nicht merken
        // 2x Neustart noetig, nur beim ersten Neuspeichern dieser Einstellung
        let new_tb_save = 0;

        // 0 Startzustand Leiste On, 1 Startzustand Off, bei new_tb_save = 1
        let new_tb_off = 0;

        // 0 Button schaltet Leiste fuer alle Fenster, 1 nur aktives Fenster
        let new_tb_uno = 0;

        // Eigene Hintergrundfarbe: 0 Off, 1 On
        let new_tb_color = 0;
        // Hintergrundfarbe bei On
        let new_tb_bg_color = 'lightblue';

        // Trennlinie Breite, 0px = off
        let new_tb_border_width = '1px';
        // Trennlinie Farbe
        //let new_tb_border_color = 'grey';
        let new_tb_border_color = 'color-mix(in srgb, currentColor 30%, transparent)';

// Groessen von Leiste und Buttons aendern, muss px Wert sein, auch bei 0px, manuell

        // Groesse Buttons via padding aendern, 8px Standard; Abstand, Leistengroesse wird mit geaendert
        let new_tb_btn_size = '6px';

        // Abstand zwischen Buttons, 2px Standard
        let new_tb_distance = '5px';

        // Breite vertikale Leiste / Hoehe horizontale Leiste um diesen Wert erhoehen, bei 0px => Leistengroesse = Buttongroesse
        let new_tb_size = '1px';

// Moegliche Problemloesungen, nur falls noetig, experimentell

        // Fix #1 fuer Themes mit zu niedrigen/ gekachelten Hintergrund Bildern, true / false, besser nur eines benutzen
        let theme_fix = false;
        // Fix #2, ueberschreibt Fix #1
        let theme_fix_2 = false;

        // Anpassung fuer Restore 'Space & Separator' items script for Firefox 102+ by Aris, true / false
        // https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/space_and_separator_restorer.uc.js
        // Tip: Separator, Space etc. im Anpassenfenster nur mit Rechtsklick aus Leiste entfernen
        let separator_fix = true;

// User Einstellungen Ende

        if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
        	Services.prefs.setBoolPref('svg.context-properties.content.enabled', true );
        }

        const pref_newtoolbar_state = "userchrome.newtoolbar.enabled";

        let toolbox_new = document.createXULElement('toolbox');
        toolbox_new.setAttribute('id','toolbox_new');
        toolbox_new.setAttribute('orient','horizontal');

        let ntb = document.createXULElement('toolbar');
        ntb.id = 'newtoolbar';
        ntb.setAttribute('customizable', true);
        ntb.setAttribute("class","toolbar-primary chromeclass-toolbar browser-toolbar customization-target");
        ntb.setAttribute('mode', 'icons');
        ntb.setAttribute('context', 'toolbar-context-menu');
        ntb.setAttribute('toolbarname', 'Addon Bars');
	      ntb.setAttribute('label', 'Addon Bars');
        ntb.setAttribute('orient', 'vertical');
        ntb.setAttribute("accesskey","");

	      toolbox_new.appendChild(ntb);
        document.getElementById('browser').parentNode.appendChild(toolbox_new);

        let observer_custom = new MutationObserver(function(mutations) {
          for (let mutation of mutations) {
            try {
              const customContainer = document.getElementById('customization-container');
              if (!customContainer) return;
              const rect = customContainer.getBoundingClientRect();
              document.getElementById('toolbox_new').style.setProperty('--height_newbar_c', rect.height + 'px');
            } catch (e) { }
          }
        });
        observer_custom.observe(document.querySelector('#main-window'), {
          attributes: true,
          attributeFilter: ['customizing'],
        });

        let navbar_size = document.getElementById("browser");
        let observer = new ResizeObserver(() => {
        let rect = navbar_size.getBoundingClientRect();
        document.getElementById('toolbox_new').style.setProperty('--height_newbar', rect.height + 'px');
        document.getElementById('toolbox_new').style.setProperty('--height_newbar_top', rect.top + 'px');
        });
        observer.observe(navbar_size);

        CustomizableUI.registerArea('newtoolbar', {legacy: true});
        CustomizableUI.registerToolbarNode(ntb);

      //On/off button
      try {
          CustomizableUI.createWidget({
              id: 'NewToolbar_button',
              type: 'custom',
              defaultArea: CustomizableUI.AREA_NAVBAR,
                  onBuild: function(aDocument) {
                      let toolbaritem = aDocument.createXULElement('toolbarbutton');
                      let props = {
                          id: 'NewToolbar_button',
                          class: 'toolbarbutton-1 chromeclass-toolbar-additional',
                          removable: true,
                          label: 'Toggle New Toolbar',
                          tooltiptext: 'Toggle New toolbar',
                      };
                      for(let p in props)
                          toolbaritem.setAttribute(p, props[p]);
                      return toolbaritem;
                  }
           });
       } catch(e) { }

    // Button Funktion
    if (new_tb_uno === 0) {
      document.getElementById('NewToolbar_button').addEventListener('click', tb_toggle );
      }
    else if (new_tb_uno === 1) {
      document.getElementById('NewToolbar_button').addEventListener('click', tb_toggle_uno );
    }

    function tb_toggle() {
      let windows = Services.wm.getEnumerator(null);
		   while (windows.hasMoreElements()) {
      		  let win = windows.getNext();
       if (event.button === 0) {
         const toolbar = win.document.getElementById("newtoolbar");
         const browserArea = win.document.getElementById("browser");
         const button = win.document.getElementById("NewToolbar_button");

         toolbar.classList.toggle("off-mode");
         browserArea.classList.toggle("off-mode_b");
         button.classList.toggle("off-mode_btn");

         const ntb_visible = !toolbar.classList.contains("off-mode");
         Services.prefs.setBoolPref(pref_newtoolbar_state, ntb_visible);
         }
       }
    };

    function tb_toggle_uno() {
      if (event.button === 0) {
           const toolbar = document.getElementById("newtoolbar");
           const browserArea = document.getElementById("browser");
           const button = document.getElementById("NewToolbar_button");

           toolbar.classList.toggle("off-mode");
           browserArea.classList.toggle("off-mode_b");
           button.classList.toggle("off-mode_btn");

           const ntb_visible = !toolbar.classList.contains("off-mode");
           Services.prefs.setBoolPref(pref_newtoolbar_state, ntb_visible);
           }
    };

    // Position Startzustand
    if (new_tb_loc === 1) {
         toolbox_new.classList.add("left_mode");
         browser.classList.add("left_mode_b");
         NewToolbar_button.classList.add("left_mode_btn");
       }
    else if (new_tb_loc === 2) {
         toolbox_new.classList.add("bottom_mode");
         browser.classList.add("bottom_mode_b");
         NewToolbar_button.classList.add("bottom_mode_btn");
       }

    let toolbarEnabled = true;
    try {
        toolbarEnabled = Services.prefs.getBoolPref(pref_newtoolbar_state);
    } catch(e) {
        Services.prefs.setBoolPref(pref_newtoolbar_state, new_tb_off === 0); // Initialwert setzen
        toolbarEnabled = new_tb_off === 0;
    }

    if (!toolbarEnabled) {
        newtoolbar.classList.add("off-mode");
        browser.classList.add("off-mode_b");
        NewToolbar_button.classList.add("off-mode_btn");
    }

    // #1 Beim Beenden von Firefox: Prefs loeschen, falls new_tb_save === 1
    if (new_tb_save === 1) {
        Services.obs.addObserver(function observer(subject, topic, data) {
            if (topic === "quit-application-granted") {
                try {
                    Services.prefs.clearUserPref(pref_newtoolbar_state);
                } catch (e) { }
                Services.obs.removeObserver(observer, "quit-application-granted");
            }
        }, "quit-application-granted");
     }

    // Icon
    if (new_tb_icon === 1) {
         NewToolbar_button.classList.add("icon_mode");
       }
    // Hintergrundfarbe
    if (new_tb_color === 1) {
         newtoolbar.classList.add("ntb_bg_color");
       }

const css =`

:root {
    --ug-newbar_basewidth: calc(2 * var(--ug-newbar-button_inner_padding) + 16px);
    --ug-newbar_width: calc(var(--ug-newbar_basewidth) + var(--ug-newbar_borderwidth) + 2 * var(--ug-newbar_add_width));

    --ug-newbar-button_inner_padding: ${new_tb_btn_size};         /* Groesse Buttons */
    --ug-newbar_add_width: `+new_tb_size+`;                       /* Breite / Hoehe erhoehen */
    --ug-newbar_btnspace: ${new_tb_distance};                     /* Abstand zw. Buttons */
    --ug-newbar_borderwidth: ${new_tb_border_width};              /* Breite / Hoehe Trennlinie */
}

/*- Buttons Groesse -*/
#newtoolbar {
    --toolbarbutton-inner-padding: var(--ug-newbar-button_inner_padding) !important;
	 	--toolbarbutton-outer-padding: 0px !important;
}

/*-  Button  -*/
#NewToolbar_button .toolbarbutton-icon {
    list-style-image: url("chrome://browser/skin/sidebars-right.svg");
}
#NewToolbar_button.icon_mode .toolbarbutton-icon {
    list-style-image: url("${ImagePath}");
}
#NewToolbar_button.off-mode_btn:not(:hover, :active) .toolbarbutton-icon {
    opacity: 0.4;
}
#NewToolbar_button.left_mode_btn .toolbarbutton-icon {
    transform: rotate(180deg);
}
#NewToolbar_button.bottom_mode_btn .toolbarbutton-icon {
    transform: rotate(90deg);
}

/*--  Basis / Right  --*/

#browser {
    transition: padding 0.25s ease !important;
}
#browser:not(.off-mode_b) {
    padding-right: var(--ug-newbar_width) !important;
}

#toolbox_new {
    position: fixed;
    z-index: 4 !important;
    display: flex;
    width: fit-content;
    top: var(--height_newbar_top);
    right: 0;
}
#newtoolbar {
    display: flex;
    min-width: var(--ug-newbar_basewidth) !important;
    width: var(--ug-newbar_width);
    min-height: var(--ug-newbar_basewidth) !important;
    height: var(--height_newbar) !important;
    align-items: center !important;
    padding-block: 8px;
    border: 0 solid ${new_tb_border_color};
    border-inline-width: var(--ug-newbar_borderwidth) 0;
    transition: margin 0.25s ease;
    box-shadow: none !important;
}
#newtoolbar:not([customizing]).off-mode {
    min-width: 0px !important;
    margin-inline: 0 calc(0px - var(--ug-newbar_width));
}

#newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    margin-block: var(--ug-newbar_btnspace) !important;
}

/*--  Left  --*/

#browser:not(.off-mode_b).left_mode_b {
    padding-inline: var(--ug-newbar_width) 0 !important;
}
#toolbox_new.left_mode {
    left: 0;
}
.left_mode #newtoolbar:not([customizing]) {
    border-left: none;
    border-inline-width: 0 var(--ug-newbar_borderwidth);
}
.left_mode #newtoolbar:not([customizing]).off-mode {
    margin-inline: calc(0px - var(--ug-newbar_width)) 0;
}

/*--  Bottom  --*/

#browser:not(.off-mode_b).bottom_mode_b {
    padding-inline: 0 !important;
    padding-bottom: var(--ug-newbar_width) !important;
}

#toolbox_new.bottom_mode {
    top: unset;
    bottom: 0;
}
.bottom_mode #newtoolbar:not([customizing]) {
    flex-direction: row !important;
    height: var(--ug-newbar_width) !important;
    width: 100vw;
    padding-block: 0;
    padding-inline: 8px;
    border-inline-width: 0;
    border-top-width: var(--ug-newbar_borderwidth);
    /*justify-content: center !important;*/    /* Inhalt mittig, optional */
}
.bottom_mode #newtoolbar:not([customizing]).off-mode {
    min-height: 0px !important;
    margin-inline: 0;
    margin-block: 0 calc(0px - var(--ug-newbar_width)) !important;
}

#toolbox_new.bottom_mode #newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#toolbox_new.bottom_mode #newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    margin-block: var(--toolbarbutton-outer-padding) !important;
    margin-inline: var(--ug-newbar_btnspace) !important;
}

/*--  Fullscreen  --*/

/* Mac / nur Video Fullscreen */
#main-window[inDOMFullscreen]:not([customizing]) #toolbox_new {
    visibility: collapse !important;
}
#main-window[inDOMFullscreen]:not([customizing]) #browser {
    padding: 0 !important;
}

/* Windows Fullscreen Video + Normal */
@media (-moz-platform: windows) {
#main-window[inFullscreen]:not([customizing]) #toolbox_new {
    visibility: collapse !important;
}
#main-window[inFullscreen]:not([customizing]) #browser {
    padding: 0 !important;
}
}

/*--  customizing  --*/

:root[customizing] #toolbox_new {
    top: unset !important;
    bottom: 0 !important;
    right: 0 !important;
    left: unset !important;
}
#newtoolbar[customizing] {
    height: var(--height_newbar_c) !important;
}
#customization-container {
    margin-right: var(--ug-newbar_width) !important;
}

/*-  Farben Themes  -*/

/* Eigene HG Farbe falls eingeschaltet */
#newtoolbar.ntb_bg_color {
    background-color: ${new_tb_bg_color} !important;
}

/*- Farben Themes, falls Hintergrundbilder gekachelt, oben theme_fix versuchen -*/

:root[lwtheme] #newtoolbar:not(.ntb_bg_color) {
    background-color: var(--lwt-accent-color, var(--toolbar-bgcolor)) !important;
}
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color) {
    background-image: var(--lwt-header-image) !important;
    background-position: right 0px top 0px !important;
}

/*--  Testfarben  --*/
/*
#newtoolbar {
    border-block: 8px solid orange;
}
#newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    outline: 1px solid red;
    outline-offset: -1px;
}
*/

`;

let theme_fix_code = '';
if (theme_fix) {
  theme_fix_code = `
/*-  Fix #1 Hintergrundbilder fuer Themes mit gekachelten Bildern, falls eingeschaltet -*/
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color) {
    background: var(--lwt-header-image) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: right 0px top 0px !important;
}
:root[lwtheme][lwtheme-image] #toolbox_new.bottom_mode #newtoolbar:not(.ntb_bg_color) {
    background-size: auto !important;
}
 `;
}

let theme_fix_code_2 = '';
if (theme_fix_2) {
  theme_fix_code_2 = `
/*-  Fix #2 Hintergrundbilder fuer Themes mit gekachelten Bildern, falls eingeschaltet -*/
:root[lwtheme][lwtheme-image] #toolbox_new #newtoolbar:not(.ntb_bg_color) {
     background: transparent !important;
}
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color)::before {
    content: "" ;
    position: absolute;
    top: 0;
    right: 0;
    width: var(--height_newbar) !important;
    height: var(--ug-newbar_width) !important;
    pointer-events: none;
    z-index: -1 !important;
    background: var(--lwt-header-image) !important;
    background-repeat: no-repeat !important;
    /*background-position: left 0px top 100% !important;*/
    transform: rotate(-90deg) translateX(var(--ug-newbar_width)) !important;
    transform-origin: 100% 100% !important;
    transition: margin 0.25s ease;
}
:root[lwtheme][lwtheme-image] #toolbox_new.bottom_mode #newtoolbar:not(.ntb_bg_color, [customizing])::before {
    transform: scaleX(-1) !important;
    transform-origin:  50% 50% !important;
    width: 100% !important;
}

:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color)[customizing]::before {
    width: var(--height_newbar_c) !important;
}

#newtoolbar:not([customizing]).off-mode::before {
    min-width: 0px !important;
    margin-inline: 0 calc(0px - var(--ug-newbar_width));
}
.left_mode #newtoolbar:not([customizing]).off-mode::before {
    margin-inline: calc(0px - var(--ug-newbar_width)) 0;
}
.bottom_mode #newtoolbar:not([customizing]).off-mode::before {
    min-height: 0px !important;
    margin-inline: 0;
    margin-block: 0 calc(0px - var(--ug-newbar_width)) !important;
}
 `;
}

let separator_fix_code = '';
if (separator_fix) {
  separator_fix_code = `
/* Anpassung fuer Separator Scripts, falls eingeschaltet */
#newtoolbar toolbarseparator {
    margin: 6px 0 !important;
    width: calc(var(--ug-newbar_width) - var(--ug-newbar_borderwidth) - 6px) !important;
    max-width: var(--ug-newbar_width) !important;
    border-block-color: hsl(0, 0%, 0%, 0.55) hsl(0, 0%, 100%, 0.55) !important;
    /*background-color: color-mix(in srgb, currentColor 70%, transparent) !important;
    border: none !important;*/
}
#newtoolbar :is(toolbarspacer, toolbarspring, toolbarseparator) {
    min-width: 1px !important;
}
.bottom_mode #newtoolbar:not([customizing]) toolbarseparator {
    transform: rotate(-90deg) !important;
}
#newtoolbar[customizing] toolbarseparator {
    margin-block: 16px !important;
}
 `;
}

  const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
  //const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
  const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(''+ css + theme_fix_code + theme_fix_code_2 + separator_fix_code));
  sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

})();

Alles anzeigen

toolbar_n3.svg.zip

Horstmann

Zitat von FuchsFan

Horstmann
Nur als Hinweis, stelle ich in Zeile 72 auf true, so bleibt beim Ausblenden die Leiste wieder sichtbar (Thema hatten wir schon).

Vielen Dank, gut beobachtet!

Fix für theme_fix_2 ist unterwegs!

Horstmann

Zitat von lenny2

Ja

Danke; gut zu wissen.

Evtl. die finale Version, ausser es gibt grobe Fehler, bevor jeder zu Aris wechselt.

Bitte die Kommentare in der User Einstellungen Sektion vor Änderungen lesen; zwei mögliche Lösungen für störrische Themes können optional benutzt werden, und für Lenny hätten wir noch eine Space & Separator Script Lösung #102 (gefühlt).
Dieses Script wurde auch gerade erneuert, immer noch buggy...

Einige weitere Optionen sind hinzugefügt, speziell für Abmessungen; eine Autovariante hätte ich auch dafür, aber so schwer ist es nicht das manuell zu regeln.
Sowas könnte Sinn machen noch mit rein zu packen, aber dazu braucht es Feedback.

Version 9:

JavaScript

// Zusaetzliche Toolbars wahlweise rechts, links, unten

// Use filename starting with 00 !! =>
// 00_extra_toolbars_V9.uc.js

// Basiert auf: https://www.camp-firefox.de/forum/thema/137714-seitennavigation-fly-out-menue
// Und Aris: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/addonbar_vertical.uc.js
// Forumthema: https://www.camp-firefox.de/forum/thema/139927-eigene-zusatzleisten-ab-ff-143/

// ACHTUNG: Einige Systembuttons lassen sich in zusaetzliche/eigene Tb's zwar noch verschieben, haben aber KEINE Funktion.
// Dazu gibt es einen Patch von @BrokenHeart:  https://www.camp-firefox.de/forum/thema/138875-fix-toolbar-buttons-reagieren-nicht-mehr-ab-ff-134/

// Version V9 / Release 4

(function() {
    if (location.href !== 'chrome://browser/content/browser.xhtml')
        return;

// User Einstellungen
// Nach Script Aenderungen Neustart mit Start-Cache loeschen => about:support
// Moegliche Problemloesungen (s. unten) muessen wo noetig manuell an/ausgeschaltet werden

        // Eigenes Icon, in Profilordner/chrome/icons Ordner
        let ProfilePath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));
        let IconPath = '/chrome/icons/';
        let Icon_tb = 'toolbar_n3.svg';
        let ImagePath = ProfilePath + IconPath + Icon_tb;

        // 0 Firefox Icon, 1 eigenes Icon benutzen
        let new_tb_icon  = 0;

        // Position Startzustand: 0 Rechts, 1 Links, 2 Bottom
        let new_tb_loc = 0;

        // 0 letzter Zustand Leiste On/Off beim Beenden merken, 1 nicht merken
        // 2x Neustart noetig, nur beim ersten Neuspeichern dieser Einstellung
        let new_tb_save = 0;

        // 0 Startzustand Leiste On, 1 Startzustand Off, bei new_tb_save = 1
        let new_tb_off = 0;

        // 0 Button schaltet Leiste fuer alle Fenster, 1 nur aktives Fenster
        let new_tb_uno = 0;

        // Eigene Hintergrundfarbe: 0 Off, 1 On
        let new_tb_color = 0;
        // Hintergrundfarbe bei On
        let new_tb_bg_color = 'lightblue';

        // Trennlinie Breite, 0px = off
        let new_tb_border_width = '1px';
        // Trennlinie Farbe
        //let new_tb_border_color = 'grey';
        let new_tb_border_color = 'color-mix(in srgb, currentColor 30%, transparent)';

// Groessen von Leiste und Buttons aendern, muss px Wert sein, auch bei 0px, manuell

        // Groesse Buttons via padding aendern, 8px Standard, Abstand geringer, Leistengroesse wird mit angepasst!
        let new_tb_btn_size = '6px';

        // Abstand zwischen Buttons, 2px Standard
        let new_tb_distance = '5px';

        // Breite vertikale Leiste / Hoehe horizontale Leiste um diesen Wert erhoehen, bei 0px => Leistengroesse = Buttongroesse
        let new_tb_size = '1px';

// Moegliche Problemloesungen, nur falls noetig, experimentell

        // Fix #1 fuer Themes mit zu niedrigen/ gekachelten Hintergrund Bildern, true / false, besser nur eines benutzen
        let theme_fix = false;
        // Fix #2, ueberschreibt Fix #1
        let theme_fix_2 = false;

        // Anpassung fuer Restore 'Space & Separator' items script for Firefox 102+ by Aris, true / false
        // Benutzung nicht empfohlen, Bugs, und toolbarspring fehlplaziert
        // Tip: Separator, Space etc. im Anpassenfenster nur mit Rechtsklick aus Leiste entfernen
        let separator_fix = true;

// User Einstellungen Ende

        if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
        	Services.prefs.setBoolPref('svg.context-properties.content.enabled', true );
        }

        const pref_newtoolbar_state = "userchrome.newtoolbar.enabled";

        let toolbox_new = document.createXULElement('toolbox');
        toolbox_new.setAttribute('id','toolbox_new');
        toolbox_new.setAttribute('orient','horizontal');

        let ntb = document.createXULElement('toolbar');
        ntb.id = 'newtoolbar';
        ntb.setAttribute('customizable', true);
        ntb.setAttribute("class","toolbar-primary chromeclass-toolbar browser-toolbar customization-target");
        ntb.setAttribute('mode', 'icons');
        ntb.setAttribute('context', 'toolbar-context-menu');
        ntb.setAttribute('toolbarname', 'Addon Bars');
	      ntb.setAttribute('label', 'Addon Bars');
        ntb.setAttribute('orient', 'vertical');
        ntb.setAttribute("accesskey","");

	      toolbox_new.appendChild(ntb);
        document.getElementById('browser').parentNode.appendChild(toolbox_new);

        let observer_custom = new MutationObserver(function(mutations) {
          for (let mutation of mutations) {
            try {
              const customContainer = document.getElementById('customization-container');
              if (!customContainer) return;
              const rect = customContainer.getBoundingClientRect();
              document.getElementById('toolbox_new').style.setProperty('--height_newbar_c', rect.height + 'px');
            } catch (e) { }
          }
        });
        observer_custom.observe(document.querySelector('#main-window'), {
          attributes: true,
          attributeFilter: ['customizing'],
        });

        let navbar_size = document.getElementById("browser");
        let observer = new ResizeObserver(() => {
        let rect = navbar_size.getBoundingClientRect();
        document.getElementById('toolbox_new').style.setProperty('--height_newbar', rect.height + 'px');
        document.getElementById('toolbox_new').style.setProperty('--height_newbar_top', rect.top + 'px');
        });
        observer.observe(navbar_size);

        CustomizableUI.registerArea('newtoolbar', {legacy: true});
        CustomizableUI.registerToolbarNode(ntb);

      //On/off button
      try {
          CustomizableUI.createWidget({
              id: 'NewToolbar_button',
              type: 'custom',
              defaultArea: CustomizableUI.AREA_NAVBAR,
                  onBuild: function(aDocument) {
                      let toolbaritem = aDocument.createXULElement('toolbarbutton');
                      let props = {
                          id: 'NewToolbar_button',
                          class: 'toolbarbutton-1 chromeclass-toolbar-additional',
                          removable: true,
                          label: 'Toggle New Toolbar',
                          tooltiptext: 'Toggle New toolbar',
                      };
                      for(let p in props)
                          toolbaritem.setAttribute(p, props[p]);
                      return toolbaritem;
                  }
           });
       } catch(e) { }

    // Button Funktion
    if (new_tb_uno === 0) {
      document.getElementById('NewToolbar_button').addEventListener('click', tb_toggle );
      }
    else if (new_tb_uno === 1) {
      document.getElementById('NewToolbar_button').addEventListener('click', tb_toggle_uno );
    }

    function tb_toggle() {
      let windows = Services.wm.getEnumerator(null);
		   while (windows.hasMoreElements()) {
      		  let win = windows.getNext();
       if (event.button === 0) {
         const toolbar = win.document.getElementById("newtoolbar");
         const browserArea = win.document.getElementById("browser");
         const button = win.document.getElementById("NewToolbar_button");

         toolbar.classList.toggle("off-mode");
         browserArea.classList.toggle("off-mode_b");
         button.classList.toggle("off-mode_btn");

         const ntb_visible = !toolbar.classList.contains("off-mode");
         Services.prefs.setBoolPref(pref_newtoolbar_state, ntb_visible);
         }
       }
    };

    function tb_toggle_uno() {
      if (event.button === 0) {
           const toolbar = document.getElementById("newtoolbar");
           const browserArea = document.getElementById("browser");
           const button = document.getElementById("NewToolbar_button");

           toolbar.classList.toggle("off-mode");
           browserArea.classList.toggle("off-mode_b");
           button.classList.toggle("off-mode_btn");

           const ntb_visible = !toolbar.classList.contains("off-mode");
           Services.prefs.setBoolPref(pref_newtoolbar_state, ntb_visible);
           }
    };

    // Position Startzustand
    if (new_tb_loc === 1) {
         toolbox_new.classList.add("left_mode");
         browser.classList.add("left_mode_b");
         NewToolbar_button.classList.add("left_mode_btn");
       }
    else if (new_tb_loc === 2) {
         toolbox_new.classList.add("bottom_mode");
         browser.classList.add("bottom_mode_b");
         NewToolbar_button.classList.add("bottom_mode_btn");
       }

    let toolbarEnabled = true;
    try {
        toolbarEnabled = Services.prefs.getBoolPref(pref_newtoolbar_state);
    } catch(e) {
        Services.prefs.setBoolPref(pref_newtoolbar_state, new_tb_off === 0); // Initialwert setzen
        toolbarEnabled = new_tb_off === 0;
    }

    if (!toolbarEnabled) {
        newtoolbar.classList.add("off-mode");
        browser.classList.add("off-mode_b");
        NewToolbar_button.classList.add("off-mode_btn");
    }

    // #1 Beim Beenden von Firefox: Prefs loeschen, falls new_tb_save === 1
    if (new_tb_save === 1) {
        Services.obs.addObserver(function observer(subject, topic, data) {
            if (topic === "quit-application-granted") {
                try {
                    Services.prefs.clearUserPref(pref_newtoolbar_state);
                } catch (e) { }
                Services.obs.removeObserver(observer, "quit-application-granted");
            }
        }, "quit-application-granted");
     }

    // Icon
    if (new_tb_icon === 1) {
         NewToolbar_button.classList.add("icon_mode");
       }
    // Hintergrundfarbe
    if (new_tb_color === 1) {
         newtoolbar.classList.add("ntb_bg_color");
       }

const css =`

:root {
    --ug-newbar_basewidth: calc(2 * var(--ug-newbar-button_inner_padding) + 16px);
    --ug-newbar_width: calc(var(--ug-newbar_basewidth) + var(--ug-newbar_borderwidth) + 2 * var(--ug-newbar_add_width));

    --ug-newbar-button_inner_padding: ${new_tb_btn_size};         /* Groesse Buttons */
    --ug-newbar_add_width: `+new_tb_size+`;                       /* Breite / Hoehe erhoehen */
    --ug-newbar_btnspace: ${new_tb_distance};                     /* Abstand zw. Buttons */
    --ug-newbar_borderwidth: ${new_tb_border_width};              /* Breite / Hoehe Trennlinie */
}

/*- Buttons Groesse -*/
#newtoolbar {
    --toolbarbutton-inner-padding: var(--ug-newbar-button_inner_padding) !important;
	 	--toolbarbutton-outer-padding: 0px !important;
}

/*-  Button  -*/
#NewToolbar_button .toolbarbutton-icon {
    list-style-image: url("chrome://browser/skin/sidebars-right.svg");
}
#NewToolbar_button.icon_mode .toolbarbutton-icon {
    list-style-image: url("${ImagePath}");
}
#NewToolbar_button.off-mode_btn:not(:hover, :active) .toolbarbutton-icon {
    opacity: 0.4;
}
#NewToolbar_button.left_mode_btn .toolbarbutton-icon {
    transform: rotate(180deg);
}
#NewToolbar_button.bottom_mode_btn .toolbarbutton-icon {
    transform: rotate(90deg);
}

/*--  Basis / Right  --*/

#browser {
    transition: padding 0.25s ease !important;
}
#browser:not(.off-mode_b) {
    padding-right: var(--ug-newbar_width) !important;
}

#toolbox_new {
    position: fixed;
    z-index: 4 !important;
    display: flex;
    width: fit-content;
    top: var(--height_newbar_top);
    right: 0;
}
#newtoolbar {
    display: flex;
    min-width: var(--ug-newbar_basewidth) !important;
    width: var(--ug-newbar_width);
    min-height: var(--ug-newbar_basewidth) !important;
    height: var(--height_newbar) !important;
    align-items: center !important;
    padding-block: 8px;
    border: 0 solid ${new_tb_border_color};
    border-inline-width: var(--ug-newbar_borderwidth) 0;
    transition: width 0.25s ease, margin 0.25s ease /*,height 0.5s ease*/ ;
    box-shadow: none !important;
}
#newtoolbar:not([customizing]).off-mode {
    min-width: 0px !important;
    margin-inline: 0 calc(0px - var(--ug-newbar_width));
}

#newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    margin-block: var(--ug-newbar_btnspace) !important;
}

/*--  Left  --*/

#browser:not(.off-mode_b).left_mode_b {
    padding-inline: var(--ug-newbar_width) 0 !important;
}
#toolbox_new.left_mode {
    left: 0;
}
.left_mode #newtoolbar:not([customizing]) {
    border-left: none;
    border-inline-width: 0 var(--ug-newbar_borderwidth);
}
.left_mode #newtoolbar:not([customizing]).off-mode {
    margin-inline: calc(0px - var(--ug-newbar_width)) 0;
}

/*--  Bottom  --*/

#browser:not(.off-mode_b).bottom_mode_b {
    padding-inline: 0 !important;
    padding-bottom: var(--ug-newbar_width) !important;
}

#toolbox_new.bottom_mode {
    top: unset;
    bottom: 0;
}
.bottom_mode #newtoolbar:not([customizing]) {
    flex-direction: row !important;
    height: var(--ug-newbar_width) !important;
    width: 100vw;
    padding-block: 0;
    padding-inline: 8px;
    border-inline-width: 0;
    border-top-width: var(--ug-newbar_borderwidth);
    /*justify-content: center !important;*/    /* Inhalt mittig, optional */
}
.bottom_mode #newtoolbar:not([customizing]).off-mode {
    min-height: 0px !important;
    margin-inline: 0;
    margin-block: 0 calc(0px - var(--ug-newbar_width)) !important;
}

#toolbox_new.bottom_mode #newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#toolbox_new.bottom_mode #newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    margin-block: var(--toolbarbutton-outer-padding) !important;
    margin-inline: var(--ug-newbar_btnspace) !important;
}

/*--  Fullscreen  --*/

/* Mac / nur Video Fullscreen */
#main-window[inDOMFullscreen]:not([customizing]) #toolbox_new {
    visibility: collapse !important;
}
#main-window[inDOMFullscreen]:not([customizing]) #browser {
    padding: 0 !important;
}

/* Windows Fullscreen Video + Normal */
@media (-moz-platform: windows) {
#main-window[inFullscreen]:not([customizing]) #toolbox_new {
    visibility: collapse !important;
}
#main-window[inFullscreen]:not([customizing]) #browser {
    padding: 0 !important;
}
}

/*--  customizing  --*/

:root[customizing] #toolbox_new {
    top: unset !important;
    bottom: 0 !important;
    right: 0 !important;
    left: unset !important;
}
#newtoolbar[customizing] {
    height: var(--height_newbar_c) !important;
}
#customization-container {
    margin-right: var(--ug-newbar_width) !important;
}

/*-  Farben Themes  -*/

/* Eigene HG Farbe falls eingeschaltet */
#newtoolbar.ntb_bg_color {
    background-color: ${new_tb_bg_color} !important;
}

/*- Farben Themes, falls Hintergrundbilder gekachelt, oben theme_fix versuchen -*/

:root[lwtheme] #newtoolbar:not(.ntb_bg_color) {
    background-color: var(--lwt-accent-color, var(--toolbar-bgcolor)) !important;
}
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color) {
    background-image: var(--lwt-header-image) !important;
    background-position: right 0px top 0px !important;
}

/*--  Testfarben  --*/
/*
#newtoolbar {
    border-block: 8px solid orange;
}
#newtoolbar > :is(.toolbarbutton-1, toolbaritem),
#newtoolbar toolbarpaletteitem > :is(.toolbarbutton-1, toolbaritem) {
    outline: 1px solid red;
    outline-offset: -1px;
}
*/

`;

let theme_fix_code = '';
if (theme_fix) {
  theme_fix_code = `
/*-  Fix #1 Hintergrundbilder fuer Themes mit gekachelten Bildern, falls eingeschaltet -*/
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color) {
    background: var(--lwt-header-image) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-position: right 0px top 0px !important;
}
:root[lwtheme][lwtheme-image] #toolbox_new.bottom_mode #newtoolbar:not(.ntb_bg_color) {
    background-size: auto !important;
}
 `;
}

let theme_fix_code_2 = '';
if (theme_fix_2) {
  theme_fix_code_2 = `
/*-  Fix #2 Hintergrundbilder fuer Themes mit gekachelten Bildern, falls eingeschaltet -*/
:root[lwtheme][lwtheme-image] #toolbox_new #newtoolbar:not(.ntb_bg_color) {
     background: transparent !important;
}
:root[lwtheme][lwtheme-image] #newtoolbar:not(.ntb_bg_color)::before {
    content: "" ;
    position: absolute;
    top: 0;
    right: 0;
    width: var(--height_newbar) !important;
    height: var(--ug-newbar_width) !important;
    pointer-events: none;
    z-index: -1 !important;
    background: var(--lwt-header-image) !important;
    background-repeat: no-repeat !important;
    /*background-position: left 0px top 100% !important;*/
    transform: rotate(-90deg) translateX(var(--ug-newbar_width)) !important;
    transform-origin: 100% 100% !important;
}
:root[lwtheme][lwtheme-image] #toolbox_new.bottom_mode #newtoolbar:not(.ntb_bg_color)::before {
    transform: scaleX(-1) !important;
    transform-origin:  50% 50% !important;
    width: 100% !important;
}
 `;
}

let separator_fix_code = '';
if (separator_fix) {
  separator_fix_code = `
/* Anpassung fuer Separator Scripts, falls eingeschaltet */
#newtoolbar toolbarseparator {
    margin: 6px 0 !important;
    width: calc(var(--ug-newbar_width) - var(--ug-newbar_borderwidth) - 6px) !important;
    max-width: var(--ug-newbar_width) !important;
    border-block-color: hsl(0, 0%, 0%, 0.55) hsl(0, 0%, 100%, 0.55) !important;
    /*background-color: color-mix(in srgb, currentColor 70%, transparent) !important;
    border: none !important;*/
}
#newtoolbar :is(toolbarspacer, toolbarspring, toolbarseparator) {
    min-width: 1px !important;
}
.bottom_mode #newtoolbar:not([customizing]) toolbarseparator {
    transform: rotate(-90deg) !important;
}
#newtoolbar[customizing] toolbarseparator {
    margin-block: 16px !important;
}
 `;
}

  const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
  //const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(css));
  const uri = Services.io.newURI('data:text/css,' + encodeURIComponent(''+ css + theme_fix_code + theme_fix_code_2 + separator_fix_code));
  sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);

})();

Alles anzeigen

toolbar_n3.svg.zip

Beiträge von Horstmann

Das "DeepL-Skript" funktioniert nicht mehr richtig!

Eigene Zusatzleisten ab ff 143+

Schaltbare vertikale Overlay-Zusatzleiste

Schaltbare vertikale Overlay-Zusatzleiste

Schaltbare vertikale Overlay-Zusatzleiste

Das "DeepL-Skript" funktioniert nicht mehr richtig!

Schaltbare vertikale Overlay-Zusatzleiste

Das "DeepL-Skript" funktioniert nicht mehr richtig!

Das "DeepL-Skript" funktioniert nicht mehr richtig!

Schaltbare vertikale Overlay-Zusatzleiste

CSS gesucht für "Alle Tabs Auswählen"

CSS gesucht für "Alle Tabs Auswählen"

CSS gesucht für "Alle Tabs Auswählen"

CSS gesucht für "Alle Tabs Auswählen"

CSS gesucht für "Alle Tabs Auswählen"

CSS gesucht für "Alle Tabs Auswählen"

Eigene Zusatzleisten ab ff 143+

Eigene Zusatzleisten ab ff 143+

Eigene Zusatzleisten ab ff 143+

Eigene Zusatzleisten ab ff 143+