Hilfe bei Konfiguration der "userChrome.css"

Dinole · Screenshot 2022-11-15 173351.jpg

Guten Abend,

wie im Betreff genannt, wäre ich dankbar, wenn ich einen Hinweis bekommen könnte, wie die Sensibilität des Einblendens der Lesezeichen-Sidebar reduziert werden könnte. Ich habe den Eindruck, dass seit Version 107.0 das Einblenden der Lesezeichen-Sidebar viel zu früh erfolgt, in dem diese schon eingeblendet wird, wenn der Mauszeiger noch weit vom Seitenrand entfernt ist. Eigentlich sollte sich die Sidebar erst öffnen, wenn der Mauszeiger den Seitenrand berührt. Den entsprechenden Code habe ich beigefügt.

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;
    z-index: 2 !important;
    }

#sidebar-box:hover {
    width: 300px !important; 
    opacity: 1 !important;
    transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
    }

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

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

Alles anzeigen

Vielen Dank für Eure Hilfe.

2002Andreas

Zitat von Dinole

das Einblenden der Lesezeichen-Sidebar viel zu früh erfolgt

Teste bitte mal diesen kompl. Code:

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

Dinole

Zitat von 2002Andreas

Teste bitte mal diesen kompl. Code:

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 kann nur sagen, Danke!

2002Andreas

Zitat von Dinole

Ich kann nur sagen, Danke!

Gerne doch

511

Hi.

Ich habe dasselbe Problem; seit dem Update auf 107 "kommt die Sidebar zu früh" mit meiner userChrome.css.

Leider erscheint sie mit dem Code von Andreas überhaupt nicht mehr.

Kannst Du mir vielleicht sagen, welches Codeschnipsel für den Bereicht verantwortlich ist, ab dem die Sidebar erscheinen soll?

Stehe gerade auf dem Schlauch.

Mozilla scheint ja etwas im generellen Code verändert zu haben, wenn die alte userChrome nicht mehr ganz greift...

Grüße

Martin

2002Andreas

Zitat von 511

ab dem die Sidebar erscheinen soll?

Ändere bitte mal den Wert in Zeile 56 in z.B. 1px und teste.

CSS

#appcontent {
    margin-left: 1px !important;
   }

511

Hi Andreas,

leider ohne Erfolg...

2002Andreas

Zitat von 511

leider ohne Erfolg...

Poste doch bitte mal deinen kompl. Code ins nächste Antwortfenster.

511

CSS

@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xul"),
url("chrome://browser/content/browser.xhtml") {

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

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

sidebarheader {
    display: none !important;
    }

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

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

label[persist="value"][flex="1"][crop="end"][control="sidebar"][value="Lesezeichen"] {
    display: none !important;
    }

#sidebar-box {
    display: block !important;
    position: fixed!important;
    top: 120px;
    right: 0;
    bottom: -25px;
    width: 5px !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;
    z-index: 2 !important;
    }

#sidebar-box:hover {
        width: 350px !important; 
    opacity: 1 !important;
    transition: width .1s ease-out .1s, opacity .1s ease-out .1s !important;
    }

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

/* #sidebar-header { */
    /* width:100%; */
    /* border: 0 !important; */
    /* } */

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

Alles anzeigen

Gabbo

Bei mir geht das mit der Änderung in der #sidebar-box:

min-width anstatt width...

CSS

#sidebar-box {
    display: block !important;
    position: fixed !important;
    bottom: 0px;
    margin-bottom: 0px !important;
    min-width: 0px !important;/*geändert*/
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-width: none !important;
    appearance: none !important;
    border: 1px solid transparent !important;
    opacity: 0 !important;
    transition: border .2s ease-out .2s, min-width/*geändert*/ .2s ease-out .2s, opacity .2s ease-out .2s !important; 
    z-index: 2 !important;
}
#sidebar-box:hover {
    min-width: 230px !important;/*geändert*/
    border: 1px solid var(--uc-color-border) !important;
    opacity: 1 !important;
    transition: border .15s ease-out .01s, min-width/*geändert*/ .15s ease-out .01s, opacity .15s ease-out .01s !important;
}

Alles anzeigen

2002Andreas

Zitat von 511

leider ohne Erfolg...

Naja, du hattest die Änderungen ja auch gar nicht in deinen Code eingetragen

CSS

@-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-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

511

Sorry, das war dann wohl ein Missverständnis.

Ich dachte, Du wolltest den Code sehen, mit dem es bei mir bisher funktioniert hat.

Wie auch immer, mit der Korrektur auf "min-width" hat es nun geklappt.

Ein ganz großes Dankeschön!!!

Grüße

Martin

511

Hallo,

ich habe einen neuen PC mit WIN 11.

Ich habe die userChrome.css, die auf dem WIN 10 Rechner (beides mit Firefox 129) einwandfrei lief, auf den neuen Rechner kopiert.

So weit funktioniert das auch, aber die Sidebar öffnet sich leider viel zu früh, schon ca. 6 cm bevor die Maus den rechten Rand erreicht.
Hat jemand eine Idee, warum das in WIN 11 anders sein sollte?
Oder gibt es noch zusätzliche Einstellungen in about:config, die vorgenommen werden müssen?

Grüße

Martin

Hier meine aktuelle userChrome.css:

CSS

@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xul"),
url("chrome://browser/content/browser.xhtml") {

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

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

sidebarheader {
    display: none !important;
    }

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

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

label[persist="value"][flex="1"][crop="end"][control="sidebar"][value="Lesezeichen"] {
    display: none !important;
    }

#sidebar-box {
    display: block !important;
    position: fixed!important;
    top: 110px;
	right: 0;
    bottom: -25px;
    min-width: 5px !important;
    overflow-x: hidden !important;
    -moz-appearance: none !important;
    border: 1px solid transparent !important;
    border-left: 1px solid #1E90FF !important;
    opacity: 0 !important;
    transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
	z-index: 2 !important;
	background:#f8f8ff!important}

    }

#sidebar-box:hover {
    
min-width: 350px !important; 
    opacity: 1 !important;
    transition: min-width .1s ease-out .1s, opacity .1s ease-out .1s !important;
    }

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

/* #sidebar-header { */
    /* width:100%; */
    /* border: 0 !important; */
    /* } */

#sidebar {
    display: block !important;
    width: 100% !important;
    height: 95%;
    }
}
#appcontent {
  margin-left: 2px !important;
}

Alles anzeigen

2002Andreas

Zitat von 511

Hat jemand eine Idee

Verschieb die Sidebar erst nach rechts:

Und dann nimm diesen Code, und pass ihn dir noch etwas an nach deinen Wünschen:

CustomCSSforFx/current/css/generalui/sidebar_show_on_hover.css at master · Aris-t2/CustomCSSforFx

Custom CSS tweaks for Firefox. Contribute to Aris-t2/CustomCSSforFx development by creating an account on GitHub.

github.com

511

Hallo Andreas,

ganz herzlichen Dank!! --> Läuft!

Viele Grüße
Martin

2002Andreas

Zitat von 511

Läuft!

Freut mich, auch wenn ich in diesem Fall fast nichts dazu getan hatte

Hilfe bei Konfiguration der "userChrome.css"

Ähnliche Themen

Fehlende Umsetzung der userChrome.css

Bräuchte Hilfe für die userChrome.css Anpassung

Verbesserung userChrome.css (Saubere Programmierung)

userChrome.css funktioniert nicht (Umstellung in about:config ist erfolgt)

Wie heraus bekommen, welche Werte sich bei einer Konfigurationsänderung des FF per GUI, in der internen über die about:config ersichtlichen Konfiguration geändert haben ?

userChrome.css wird nicht geladen