Hilfe bei Konfiguration der "userChrome.css"

Dinole

Hallo zusammen,

mit Update auf FF 132 ist leider meine geliebte Funktion des automatischen Einblendens der Lesezeichen Sidebar abhanden gekommen. Ich wäre daher sehr dankbar, wenn man mir bei der Aktualisierung der "userChrome.css" helfen könnte.

Der Code, der leider nicht mehr funktioniert, lautet:

CSS

CSS

tab[selected="true"] {
  background-color: rgb(205,69,50) !important;
  color: black !important;
}
tab {
  -moz-appearance: none !important;
}
/* Sidebar per Maushover einblenden */
@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml"),
url("chrome://browser/content/browser.xhtml") {

#menu_bookmarksSidebar {
     display: -moz-box !important;
     }

#bookmarks-view-children {
     margin-top: -125px !important;
     margin-left: -15px !important;
    }

#sidebar-header {
    display: none !important;
    }

/* #sidebar-search-container { */
    /* display: none !important; */
    /* } */

.sidebar-placesTreechildren::-moz-tree-separator {
    margin: 0px 500px !important;
    }


#sidebar-box {
    display: block !important;
    position: fixed!important;
    top: 145px;
    bottom: -35px;
    width: 0px !important;
    overflow-x: hidden !important;
    -moz-appearance: none !important;
    border: 1px solid transparent !important;
    border-left: 0 !important;
    opacity: 0 !important;
    transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
    }

#sidebar-box:hover {
    z-index: 3 !important;
    width: 300px !important; 
    opacity: 1 !important;
    transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
    }    
        
#appcontent {
    margin-left: .1px !important;
   }

#sidebar-splitter {
    display: none !important;
    }

#sidebar {
    display: block !important;
    width: 100% !important;
    height: 95%;
    }
}

Alles anzeigen

Ich bedanke mich schon mal vorab für Eure Hilfe!

2002Andreas

Zitat von Dinole

des automatischen Einblendens der Lesezeichen Sidebar

Teste bitte diesen kompl. Code:

CSS

tab[selected="true"] {
         background-color: rgb(205,69,50) !important;
         color: black !important;
}

@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml"),
               url("chrome://browser/content/browser.xhtml") {
				   
#sidebar-box {
        position: absolute !important;
        top: 145px;
        bottom: 25px;
        width: 230px !important; 
        z-index: 100 !important;
        opacity: 0 !important;
        margin-left: -229px !important;
        transition: margin-left .5s linear .4s, opacity .6s ease-in .2s !important;
	}

#sidebar-box:hover {
        opacity: 1 !important;
        margin-left: 0 !important;
        transition: margin-left .66s !important; 
    }

#sidebar {
	    box-shadow: none !important;
	    border-radius: 0 !important;
	    border: none !important;
        position: absolute !important;
        width: 230px !important;
    }	
    
#sidebar-splitter {
        display: none !important;
    } 	
	
#sidebar-header {
        display: none !important;
    }

#sidebar-search-container {
        display: none !important;
    }	
}

Alles anzeigen

Dinole

2002Andreas Ich bedanke mich vielmals für Deine schnelle und kompetente Hilfe!

2002Andreas

Zitat von Dinole

Ich bedanke mich vielmals für Deine schnelle und kompetente Hilfe!

Freut mich wenn ich dir damit helfen konnte, war gern geschehen

Dinole · Screenshot 2025-12-10 091550.png

Guten Morgen, insbesondere an 2002Andreas ,

leider habe ich wieder mal ein Problem mit der userChrome.css, die mir nach dem Update auf FF 146.0 Probleme mit dem Hintergrund bereitet. Wie auf den beigefügten Bildern zu sehen ist, ist der Hintergrund der Lesezeichenliste dermaßen durchsichtig, dass diese bei einer geöffneten Webseite, abhängig von deren Hintergrund, kaum noch zu lesen ist. Ich habe zwar schon diverse RGB-Einstellungen versucht, aber ich schaffe es nicht, den Hintergrund auf undurchsichtig zu stellen.

Der Code lautet:

CSS

tab[selected="true"] {
         background-color: rgb(205,69,50) !important;
}



@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml"),
               url("chrome://browser/content/browser.xhtml") {
				   
#sidebar-box {
  z-index: 1000 !important;
  opacity: 0 !important;
  min-width: 0 !important;
  width: 2px !important;
  transition: .4s linear;
 }

#sidebar-box:hover {
  opacity: 1 !important;
  width: 250px !important;
  transition: .4s linear;
  margin-right: calc(2px - 250px) !important; /*ändern auf left, wenn die Sidebar rechts ist*/
 }
}

Alles anzeigen

Daher wäre ich für eine Hilfestellung sehr dankbar!

2002Andreas

Zitat von Dinole

ein Problem mit der userChrome.css,

Guten Morgen Dinole.

Da funkt dir etwas anderes dazwischen

Mit dem Code sieht das hier so aus:

Dinole

Zitat von 2002Andreas

Da funkt dir etwas anderes dazwischen

Vielen Dank 2002Andreas ,

Habe jetzt einmal alle Add-Ons manuell deaktiviert, das Problem bleibt bestehen, im abgesicherten Modus allerdings nicht, aber in diesem Modus dürfte auch der CSS-Code deaktiviert sein, da das automatische Ein-/Ausblenden der Sidebar dann auch nicht funktioniert.

Bis gestern, in der FF-Vorgängerversion, ging alles bestens, mit dem Update auf die Version 146.0 begann das Problem. Für bereits bestehende Add-Ons gab es auch keine Updates, die das Problem verursachen konnten, neue Add-Ons kamen auch nicht hinzu.

Daher ist meine Vermutung, dass dieses FF-Update, wie auch bei einigen früheren Updates, dazu führt, dass bei manuellen CSS-Codes Probleme entstehen.

2002Andreas

Zitat von Dinole

dürfte auch der CSS-Code deaktiviert sein

So ist es.

Nutzt du noch andere Codes oder Skripte, wenn ja welche?

2002Andreas

Zitat von Dinole

dass bei manuellen CSS-Codes Probleme entstehen.

Könnten, muss aber nicht sein

Nutzt du auch CSS-Codes für Webseiten in der userContent.css?

Dinole

Zitat von 2002Andreas

Nutzt du noch andere Codes oder Skripte, wenn ja welche?

Nein, definitiv nicht. Die userChrome.css ist die einzige manuell hinzugefügte Datei.

2002Andreas

Zitat von Dinole

definitiv nicht.

Ohne die Sidebar sieht die Seite hier so aus:

Ist das bei dir auch so?

Und mit wie in Beitrag Nr. 6

Du hast auch nur den obigen CSS-Code, und keine weiteren?

Dinole

Zitat von 2002Andreas

Du hast auch nur den obigen CSS-Code, und keine weiteren?
Genau, nur den CSS-Code, nichts anderes. Und bei mir sehen die Seiten bei geschlossener und geöffneter Sidebar wie folt aus:

2002Andreas

Was mich bei dir wundert:

Die Seite ntv ist ganz links am Rand

Hier ist das ein Abstand.

Lösch bitte mal Cache und Cookies zumindest von ntv, und teste es dann.

Ansonsten:

Ist das auch auf anderen Webseiten so, oder nur bei ntv?

.DeJaVu

Und was für CSS hast du sonst noch am Start? Bitte alles offenlegen!

BrokenHeart

Zitat von 2002Andreas

Was mich bei dir wundert:
Die Seite ntv ist ganz links am Rand
Hier ist das ein Abstand.

Das Layout hängt wohl auch von der Breite des Fenster ab. Wenn man das FF-Fenster etwas verkleinert, dann verschwindet ab einem bestimmten Wert der linke Abstand und es sieht dann so aus wie beim TE.

PS: ...und das gepostete Skript funktioniert auch bei mir in FF146.

2002Andreas

Zitat von BrokenHeart

dann verschwindet ab einem bestimmten Wert der linke Abstand

Danke für den Hinweis

Trotzdem habe ich das Problem hier nicht

Die Sidebar legt sich dann über die Seite, ist aber nicht durchsichtig.

Dinole ...nutzt du ein Theme, und wenn ja welches?

2002Andreas

Zitat von Dinole

Der Code lautet:

Es muss an deinem Theme liegen

Wenn ich den Hintergrund der Sidebar auf transparent stelle ist es hier auch so.

Teste also bitte mal:

CSS

tab[selected="true"] {
         background-color: rgb(205,69,50) !important;
}

@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml"),
               url("chrome://browser/content/browser.xhtml") {
				   
#sidebar-box {
  background-color: white !important;
  z-index: 1000 !important;
  opacity: 0 !important;
  min-width: 0 !important;
  width: 2px !important;
  transition: .4s linear;
 }

#sidebar-box:hover {
  opacity: 1 !important;
  width: 250px !important;
  transition: .4s linear;
  margin-right: calc(2px - 250px) !important; /*ändern auf left, wenn die Sidebar rechts ist*/
 }
}

Alles anzeigen

Ich habe mal einen weißen Hintergrund eingefügt, evtl. reicht das ja scho aus.

milupo

Zitat von Dinole

Habe jetzt einmal alle Add-Ons manuell deaktiviert, das Problem bleibt bestehen, im abgesicherten Modus allerdings nicht,

Zitat von 2002Andreas

Es muss an deinem Theme liegen

Dinole Andreas könnte hier recht haben. Was hast du denn manuell deaktiviert – vielleicht nur die Erweiterungen oder auch die Themes? Das sind zwei unterschiedliche Kategorien im Add-on-Manager und im Fehlerbehebungsmodus (ehemals abgesicherter Modus) werden auch die Themes deaktiviert. Vielleicht deswegen tritt das Problem im Fehlerbehebungsmodus nicht auf.

Sören Hentzschel

Ich denke, dass es eine Regression dieser Änderung ist:

mozilla-central @ 935a682c44fe

Bug 1984885 - Enable transparent background on webext sidebar panels and set better --sidebar-background-color default for lwthemes.…

hg-edge.mozilla.org

Dinole · Screenshot 2025-12-10 153124.png

....an Alle...................

Vielen Dank für die Hinweise, es war tatsächlich das Theme "Brushed Like Chrome", was zu diesem Problem geführt hatte. Bin nun auf das Standard Theme zurückgewechselt, nun sieht wieder alles viel besser aus!

Hilfe bei Konfiguration der "userChrome.css"

Sören Hentzschel 29. Oktober 2024 um 16:28

Ähnliche Themen

Welchen Selektor bei Screenshot für das untere helle Feld, einschließlich der Button

url-Leiste vergrößert sich bei Klick wieder

Umkehrung der Tab-Reihenfolge in der Tab-Leiste

Radiobuttons und deren Positionierung in verschiedenen Firefox-Versionen

Update von Firefox (106.0.1 (64-Bit): Änderungen der Anzeige des privaten Modus rückgängig machen (erledigt)

Autovervollständigung bei der URL-Suchleiste