Eigene Zusatzleisten ab ff 143+

2002Andreas

Zitat von Boersenfeger

eine horizontale Zusatzleiste UNTEN.

Lässt sich doch im Skript genau einstellen, wo die Leiste sein soll

Boersenfeger

Ich habe mir diesen Code gar nicht angesehen... deswegen ja auch reingegrätscht....

2002Andreas

Zitat von Boersenfeger

Ich habe mir diesen Code gar nicht angesehen.

Immer erst genau lesen, dann hättest du dir das nämlich sparen können

Zitat von Boersenfeger

deswegen ja auch reingegrätscht....

Boersenfeger

// Das kommt auf den Betrachtungswinkel an; du musst das ja nicht bewerten!

lenny2

Zitat von Boersenfeger

Mal reingegrätscht: Hier wird derzeit nur eine vertikale Zusatzleiste besprochen, die ich nicht nutzen möchte; Ich präferiere in Nightly und 143.0.4 eine horizontale Zusatzleiste UNTEN.

Es gibt viele funktionierende horizontale Symbolleisten, aber nur zwei oder drei vertikale, einschließlich dieses Skripts.
Monitor hat ein Seitenverhältnis von 16:9 oder 16:10, daher ist es besser, der Symbolleiste einen vertikalen Streifen zuzuweisen als einen horizontalen.
Es ist also eine Frage der Präferenz.

Horstmann

Zitat von Boersenfeger

Mal reingegrätscht: Hier wird derzeit nur eine vertikale Zusatzleiste besprochen, die ich nicht nutzen möchte; Ich präferiere in Nightly und 143.0.4 eine horizontale Zusatzleiste UNTEN.
Wenn jemand daran interessiert ist, bitte mal melden, dann würde ich den verwendeten Code einstellen.

Gibt doch bestimmt schon Beiträge dazu, evtl. einfach dazu verlinken?
Ich erinnere mich vage, dass wir deine Leiste schon ab und zu diskutiert hatten.
Nur um Codeblähung zu vermeiden.

Wie erwähnt, hier gibt es auch eine "Bottom" Variante, kannst ja mal testen wenn du möchtest, ist nicht kompliziert.

Zitat von FuchsFan

Gemacht, keine Probleme mehr erkannt, Leiste wird bei Vollbild ausgeblendet.

Zitat von lenny2

Zitat von Horstmann

Für lenny2 einen Zusatz für das Aris Script , wenn es das denn ist.

In V4 werden jetzt Space aus diesem oder einem ähnlichen Skript angezeigt, Separator jedoch nicht.
Insgesamt gibt es keine Probleme mit dem V4 und es funktioniert ordnungsgemäß
Nicht mehr relevant, dieser Grafikfehler ist in V4 nicht mehr vorhanden.

Danke mal wieder!

Kurz zu den Separatoren etc., es gibt verschiedene Scripts dazu, meist älter, und die müssten erst mal in aktuellem Firefox durchgetestet werden ob sie generell noch klappen.
Im Zusammenhang mit diesen Leisten wäre der Testaufwand multipliziert, weiter komm ich da leider nicht.

Mira_Belle : Die Dinger sind als generell feste Leisten mit Versteckenoption pro Fenster konzipiert; Wegscrollen nach einiger Zeit oder Hovertricks sind leider nicht vorgesehen.

Ich habe einen Button als Test der die Position umschaltet, was man speichern könnte, ist aber auch eher ein Gimmick in diesem Fall.

lenny2

Zitat von Horstmann

Kurz zu den Separatoren etc., es gibt verschiedene Scripts dazu, meist älter, und die müssten erst mal in aktuellem Firefox durchgetestet werden ob sie generell noch klappen.

Das Skript space_and_separator_restorer.uc.js von Aris funktioniert in v144.0rc1 (kommentieren Sie die erste bedeutende Zeile im Code aus) // ChromeUtils.importESModule("resource:///modules/CustomizableUI.sys.mjs"); und fügt erfolgreich einen Separator in jede horizontale Toolbar ein, darunter auch die besprochene V4. In der vertikalen Toolbar wird der Separator jedoch nicht angezeigt. Ähnliches Verhalten bei anderen Separator-Skripten: In horizontalen Toolbar sind die Separator sichtbar, in vertikalen Toolbar hingegen nicht.

Horstmann

Zitat von lenny2

In der vertikalen Toolbar wird der Separator jedoch nicht angezeigt. Ähnliches Verhalten bei anderen Separator-Skripten: In horizontalen Toolbar sind die Separator sichtbar, in vertikalen Toolbar hingegen nicht.

Ahh, das ist gut zu wissen - und wäre ein Thema für eine eigene Thread.

Aber du könntest das mal probieren, CSS irgendwo reinschreiben (geht auch im Script CSS Teil), und im Anpassenfenster einen Separator in meine vertikale Leiste ziehen:

CSS

#newtoolbar toolbarseparator {
    outline: 1px solid red !important;
    outline-offset: 12px !important;  
}

Und schauen was passiert.

Ausserdem, grob geraten: in den Separatorscripts evtl. probieren toolbar[orient="vertical"] mit toolbar[vertical] zu ersetzen, oder als Test für vertikale Toolbars kurz nur toolbar an diesen Stellen zu benutzen.

Mira_Belle

Zitat von Horstmann

Die Dinger sind als generell feste Leisten mit Versteckenoption pro Fenster konzipiert;

Gut das Du mir das erklärst.
Denn ich verstehe das Skript nicht und habe mich schon an eine eigene Version versucht.
Alles gescheitert. Und da ich in nächster Zeit im realen Leben gefordert werde, wird das Coden
auf der Strecke bleiben, will sagen ich habe dann keine oder nur sehr wenig Zeit für so etwas.

Dein Skript scheint ja offensichtlich zu funktionieren,
dennoch hätte ich da Fragen.

Du definierst im JS Variablen! Und warum wandelst Du sie dann im CSS um?
Und an so einigen Stellen im JS habe ich mich auch gefragt, warum?
Ich vermute, Du kommst mit CSS besser klar.
Da kann in nur grundlegendes und oft auch nur, wenn ich die "Sachen" mit den Browserwerzeugen
untersuchen und prüfen kann.
Aber wehe, ich finde nicht den richtigen Selektor, dann bin ich aufgeschmissen.

Ich weiß nicht wie ich es erklären soll, aber schau Dir doch mal das custom_scrollbars.uc.js von Aris an.
Achte auf die "Weichen".
z.B. :

JavaScript

  if(custom_scrollbars === true)
	custom_scrollbars_code=`

So etwas verstehe ich! Richtig oder falsch, dann mach mal, oder auch nicht.

Horstmann

Zitat von Mira_Belle

Du definierst im JS Variablen! Und warum wandelst Du sie dann im CSS um?
Und an so einigen Stellen im JS habe ich mich auch gefragt, warum?
Ich vermute, Du kommst mit CSS besser klar.

Gefühlt hatten allein wir beide diese Diskussion schon 100x.

Die paar JS Variablen sind in dem Script einfacher zu setzen gewesen (ohne zB endlos Klassen zu adden), und teils nur da um die User Anpassungen nach oben zu packen, für einfachere Bedienbarkeit.

JS Variablen dann in CSS Variablen zu packen macht für mich die Bearbeitung und das Troubleshooting einfacher, auch weil ${...} Variablen direkt im CSS seeeehr hartnäckig sein können.
Das mit der Weiche schau ich mir aber nochmal an; ist mir schon aufgefallen, hat mir aber bisher nicht zugesagt.

Und ja, ich komme mit CSS sehr viel besser klar als mit JS.

Mira_Belle

Zitat von Horstmann

JS Variablen dann in CSS Variablen zu packen macht für mich die Bearbeitung und das Troubleshooting einfacher, auch weil ${...} Variablen direkt im CSS seeeehr hartnäckig sein können.
...
Und ja, ich komme mit CSS sehr viel besser klar als mit JS.

Hatte ich mir schon gedacht!
Und ich tu mir mit den --ug-xxx_yyy: - Dingern schwer, gerade auch, wenn das CSS in JS eingebunden ist!
VS-Code hebt dann Variablen nicht hervor, dann übersehe ich die ganz gerne, wohingegen ${...} wie Leuchtfeuer blinken.

Aber Du musst ja mit dem Code zurechtkommen, nicht ich.

lenny2

Zitat von Horstmann

Aber du könntest das mal probieren, CSS irgendwo reinschreiben (geht auch im Script CSS Teil), und im Anpassenfenster einen Separator in meine vertikale Leiste ziehen:

Prima! Mit diesem Code hat es in der Toolbar und im Einstellungsfenster geklappt.

CSS

#newtoolbar toolbarseparator {
    outline: 1px solid yellow !important;
    outline-offset: -3px !important;
    padding-left: 34px !important;
}

Horstmann

Zitat von lenny2
Mit diesem Code hat es in der Toolbar und im Einstellungsfenster geklappt.
CSS
#newtoolbar toolbarseparator {
    outline: 1px solid yellow !important;
    outline-offset: -3px !important;
    padding-left: 34px !important;
}

Die Border war wohl das Problem...
Ich hab das mal in dieser Version geändert, sollte aber besser gehen, und ist vermutlich trotzdem ein separates Thema, wenn's in anderen vertikalen auch nicht klappt.

A propos diese Version, hier ein paar Detaillösungen, und ein etwas gewagter Versuch die On/Off Zustände zu speichern.
Das Ganze sollte sich bei let new_tb_off = 2; etwa wie die Sidebar verhalten; bei Neustart wird der letzte Zustand gespeichert, und auch für neue Fenster während einer Session übernommen (sollte aber auch viel besser gehen, hab mich da etwas verkünstelt).

Themes Kompatibiltaet könnte sich mal jemand anschauen der sich auskennt mit sowas, betr. der HGfarbe.
Und ein Icon gibt's auch noch!

JavaScript

// Use filename starting with 00 !! =>
// 00_extra_toolbars_V5.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
// Forum: 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/
// Kudos an Mitleser fuer Vorarbeit, Loesungen und Tips
// ToDo: Themes Kompatibiltaet

// Nach Script Aenderungen Neustart mit Start-Cache loeschen => about:support

// Version V5 / Test 5


(function() {

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

// User Einstellungen

        // 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 Startzustand Leiste On , 1 Startzustand Off, 2 Startzustand letzter Zustand gespeichert experimentell
        let new_tb_off = 2;

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

        // Abstand zw. Buttons, muss px Wert sein, auch bei 0px
        let new_tb_distance = '2px';

        // Breite / Hoehe Leiste erhoehen, muss px Wert sein, auch bei 0px
        let new_tb_size = '0px';

        // Trennlinien Breite, muss px Wert sein, 0px = off
        let new_tb_border_width = '1px';
        // Trennlinien Farbe
        let new_tb_border_color = 'grey';

// User Einstellungen Ende

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

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

        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');

	      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) {
              console.error("Fehler beim Setzen von --height_newbar_c:", 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 function
    document.getElementById('NewToolbar_button').addEventListener('click', event => {
        if (event.button === 0) {
           newtoolbar.classList.toggle("off-mode");
           browser.classList.toggle("off-mode_b");
           NewToolbar_button.classList.toggle("off-mode_btn");
           let ntb_off = newtoolbar.classList.contains("off-mode");
           Services.prefs.setBoolPref("userChrome.newtoolbar.hidden", ntb_off);
           }
       });

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

    // Hintergrundfarbe
    if (new_tb_color === 1) {
         newtoolbar.style.backgroundColor = new_tb_bg_color;
       };

    // Positions 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");
       };

    // On/off Startzustand

    if (new_tb_off === 0) {
        Services.prefs.setBoolPref('userChrome.newtoolbar.hidden', false );
      }
    else if (new_tb_off === 1) {
        newtoolbar.classList.add("off-mode");
        browser.classList.add("off-mode_b");
        NewToolbar_button.classList.add("off-mode_btn");
        Services.prefs.setBoolPref('userChrome.newtoolbar.hidden', true );
      }
    else if (new_tb_off === 2) {
        try {
          if (Services.prefs.getBoolPref("userChrome.newtoolbar.hidden")) {
              newtoolbar.classList.add("off-mode");
              browser.classList.add("off-mode_b");
              NewToolbar_button.classList.add("off-mode_btn");
          }
      } catch (e) {}
    };


const css =`

:root {
    /*--ug-newbar_basewidth: 32px;*/
    --ug-newbar_basewidth: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
    --ug-newbar_width: calc(var(--ug-newbar_basewidth) + 2*var(--ug-newbar_add_width));

    --ug-newbar_borderwidth: ${new_tb_border_width};             /* Breite / Hoehe Trennlinie */
    --ug-newbar_add_width: ${new_tb_size};                       /* Breite / Hoehe erhoehen */
    --ug-newbar_btnspace: ${new_tb_distance};                    /* Abstand zw. Buttons */
}

/*- Buttons kleiner -*/
#newtoolbar  {
  	/*--toolbarbutton-inner-padding: 6px !important;*/
	 	--toolbarbutton-outer-padding: 0px !important;
}

/*-  Trennlinie  -*/
#newtoolbar {
   --trenn-color: ${new_tb_border_color};
}

/*-  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.45;
}
#NewToolbar_button.left_mode_btn .toolbarbutton-icon {
    transform: rotate(180deg);
}
#NewToolbar_button.bottom_mode_btn .toolbarbutton-icon {
    transform: rotate(90deg);
}

/*--  Basis / Right  --*/

/*-  Farben Themes, unfinished  -*/
:root[lwtheme]:not([customizing]) #newtoolbar {
    background-color: var(--lwt-accent-color, var(--toolbox-bgcolor)) !important;
}

#browser {
    transition: padding 0.25s ease !important;
}

#browser:not(.off-mode_b) {
    padding-right: calc(var(--ug-newbar_width) + var(--ug-newbar_borderwidth)) !important;
}

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

#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: calc(var(--ug-newbar_width) + var(--ug-newbar_borderwidth)) 0 !important;
}
#toolbox_new.left_mode {
    left: 0;
}
.left_mode #newtoolbar:not([customizing]) {
    box-shadow: var(--ug-newbar_borderwidth) 0 var(--trenn-color);
}
.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: calc(var(--ug-newbar_width) + var(--ug-newbar_borderwidth)) !important;
}

#toolbox_new.bottom_mode {
    top: unset;
    bottom: 0;
    flex-direction: row;
    width: fit-content;
}
.bottom_mode #newtoolbar:not([customizing]) {
    flex-direction: row !important;
    height: var(--ug-newbar_width) !important;
    width: 100vw;
    padding-block: 0;
    padding-inline: 8px;
    box-shadow: 0 calc(0px - var(--ug-newbar_borderwidth)) var(--trenn-color);
    border: none;
    /*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 unfinished?  --*/

/* 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;
}

/*- Extra Test: Anpassung fuer Restore 'Space & Separator' items script for Firefox 102+ by Aris -*/

#newtoolbar {
    --ug-sep_distance: 8px;     /* Distanz */
    --ug-sep_width: 4px;        /* schmaler */
}
#newtoolbar toolbarseparator {
    margin-block: var(--ug-sep_distance) !important;
    margin-inline: 0px !important;
    width: calc(var(--ug-newbar_width) - var(--ug-sep_width)) !important;
    height: 1px !important;
    appearance: none !important;
    border-inline: none !important;
		border-top: 1px solid rgba(15,17,38, 0.5) !important;
		border-bottom: 1px solid rgba(255,255,255, 0.3) !important;
}
.bottom_mode #newtoolbar:not([customizing]) toolbarseparator {
    margin-block: 0px !important;
    margin-inline: var(--ug-sep_distance) !important;
    width: initial !important;
    height: calc(var(--ug-newbar_width) - var(--ug-sep_width)) !important;
    border-block: none !important;
    border-left: 1px solid rgba(15,17,38, 0.5) !important;
    border-right: 1px solid rgba(255,255,255, 0.3) !important;
}
#newtoolbar toolbarspacer {
    min-width: 0px !important;
    width: 18px !important;
    height: 18px !important;
}
#newtoolbar[customizing] :is(toolbarseparator, toolbarspacer) {
    margin-block: 8px !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;
}
*/
        `;

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

})();

Alles anzeigen

toolbar_n3.svg.zip

grisu2099

Zitat von Horstmann

Die Border war wohl das Problem...

Wahrscheinlich, weil in den horizontalen Leisten border-left und/oder border-right verwendet wird. Ändert man das ganze auf border-top (und nimmt sicherheitshalber den Namen der Toolbar in die CSS-Deklaration auf), klappt es - zumindest bei einem Test mit meiner Version von space_and_separator_restorer.uc.js...

lenny2

V5. Separators werden sehr kurz angezeigt, 5-7px, und ich konnte dies nicht ändern. Vorrang hat derzeit V4.
Übrigens, die Methode zum Hinzufügen von Separators und Spaces aus Beitrag Nr. 13 funktioniert in Firefox v144.0rc1. Dabei ist kein Aris-Skript oder ein anderes Skript erforderlich.

Mira_Belle

Zitat von Horstmann

Themes Kompatibiltaet könnte sich mal jemand anschauen der sich auskennt mit sowas, betr. der HGfarbe.

Ist doch mit CSS zu machen, Dein Spezialgebiet.

In einem anderen Toolbarskript habe ich dies verwendet:

CSS

    #new-toolbar {
      border-top: 1px solid var(--sidebar-border-color,rgba(0,0,0,0.1)) !important;
      background-color: var(--toolbar-bgcolor);
      background-image: var(--toolbar-bgimage);
    }
    :root[lwtheme] #new-toolbar {
      background: var(--lwt-accent-color) !important;
    }
    :root[lwtheme][lwtheme-image='true'] #new-toolbar {
      background: var(--lwt-header-image) !important;
      background-position: 0vw 50vh !important;
    }

Alles anzeigen

Definitiv sind da die Selektoren zu bearbeiten!
(Wenn ich jenes Skript verwende, wird der Toolbarhintergrund dynamisch dem Theme angepasst)

Horstmann

Zitat von Mira_Belle

Zitat von Horstmann

Themes Kompatibiltaet könnte sich mal jemand anschauen der sich auskennt mit sowas, betr. der HGfarbe.

In einem anderen Toolbarskript habe ich dies verwendet:
Definitiv sind da die Selektoren zu bearbeiten!
(Wenn ich jenes Skript verwende, wird der Toolbarhintergrund dynamisch dem Theme angepasst)

Danke, ich kenne den Thread und die Codes, aber nach dem Testen von ein paar Dutzend Themes passen nur die wenigsten sauber, und müssten individuell angepasst werde, soweit ich das überblicke.

Viele Themes scheinen nur für den (alten) Basis Fx Toolbar Setup gebaut zu sein, ohne vertikale, untere oder überhaupt Zusatz-Elemente zu berücksichtigen, und haben oft eigene Plazierungen für HG-Bilder.

Wo's klappt ist es hübsch (Screens aus 115esr) , aber den Code den ich habe kann man nicht für alle benutzen.
Kenn mich aber auch nicht aus, wie gesagt.

Zitat von lenny2

V5. Separators werden sehr kurz angezeigt, 5-7px, und ich konnte dies nicht ändern. Vorrang hat derzeit V4.
Übrigens, die Methode zum Hinzufügen von Separators und Spaces aus Beitrag Nr. 13 funktioniert in Firefox v144.0rc1. Dabei ist kein Aris-Skript oder ein anderes Skript erforderlich.

Offengestanden werde ich den Code dazu später rausnehmen, das ist wohl besser in der gelinkten Thread aufgehoben.
Hier wäre noch ein Test für diese Leisten: sepa no border.rtf.zip

Mira_Belle

Zitat von Horstmann

Viele Themes scheinen nur für den (alten) Basis Fx ... gebaut zu sein, ...

Deren "Bild" ist halt einfach zu klein.

lenny2

Zitat von Horstmann

Hier wäre noch ein Test für diese Leisten: sepa no border.rtf.zip

Danke, es funktioniert normal.
Zur Information: Es wurden passendere Icon für die Vertikal Toolbar gefunden chrome://browser/skin/sidebar-collapsed.svg chrome://browser/skin/sidebar-collapsed-right.svg
In der Leiste von Aris konnte man ein background image anstelle einer background color festlegen

CSS

//    background-image: var(--toolbar-bgimage);
      background-image: url("file:///C:/real path/to your/Chrome/icons/background.png") !important;

Horstmann

Zitat von lenny2

In der Leiste von Aris konnte man ein background image anstelle einer background color festlegen

Siehe #57, mit vielen Themes passt es nicht sauber.