Änderungen am Theme nach dem Update auf die 157.0 rückgängig machen

Skippy

Gestern war mein erster Eindruck nach dem Update so, dass ich dachte, ich müsse am neuen Aussehen meines alten Themes wieder vieles ändern. Jetzt habe ich aber schon eine Weile mit ihm gearbeitet und die kleinen Neuerungen sind doch gar nicht so übel. Zwei Dinge möchte ich allerdings doch wieder anders haben.
1) Wie bekomme ich es hin, dass der Reiter des aktiven Tabs wieder so aussieht wie auf dem nachfolgenden Bild? Also oben leicht abgerundete Ecken und unten offen?

.
2) In der Lesezeichen-Symbolleiste erhalten die ausgewählten Ordner oder Websites bei Mouseover einen etwas dunkleren Hintergrund, der an den Seiten sehr rund ist. Wie kann ich es ändern, dass der Hintergrund zum einen rechts und links leicht breiter wird und dann auch nur noch oben und unten an den Ecken leicht abgerundet ist?
Im Beispiel hier ist oben das aktuelle Aussehen und unten das alte, so wie es wieder werden soll.

Mira_Belle

Bitte testen.

CSS

/* Eckige statt abgerundete Elemente */
   :root {
     --border-radius-xsmall: 0 !important;
     --border-radius-small: 0 !important;
     --border-radius-medium: 0 !important;
     --border-radius-large: 0 !important;
     --border-radius-xlarge: 8px !important;
     --border-radius-circle: 0 !important;
   }

/* ================================================== */
/* Toolbar-Hintergründe                                */
/* ================================================== */

/* Menüleiste */
#toolbar-menubar {
  background: #ffff00 !important;
}

/* Tableiste */
#TabsToolbar-customization-target {
  background: #00ff00 !important;
}

/* Adressleiste */
#nav-bar-customization-target {
  background: #00ffff !important;
}

/* Lesezeichenleiste */
#PersonalToolbar {
  background: #ff00ff !important;
}

/* ================================================== */
/* Feine Linie: Unterkante der Tab-Leiste              */
/* (wird vom aktiven Tab unterbrochen)                 */
/* ================================================== */

/* Linie als Pseudo-Element am unteren Rand der Tab-Leiste */
#TabsToolbar {
  position: relative !important;
  border-bottom: none !important;
}

#TabsToolbar::before {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: gray !important;
  z-index: 0 !important;
}

.tabbrowser-tab[visuallyselected] .tab-background {
  box-shadow: 0 15px 0 0 #00ffff !important;
  margin-bottom: -15px !important;
}
/* ================================================== */
/* Tabs                                                */
/* ================================================== */

/* Basis aller Tabs – kein Rahmen hier! */
.tabbrowser-tab .tab-background {
  background-color: yellow !important;
  outline: none !important;
  border: none !important;
}

/* aktiver Tab mit Rahmen, unten offen */
.tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background {
  background-color: #00ffff !important;
  border: 1px solid gray !important;
  border-bottom: none !important;
}

/* multiselektierte Tabs */
.tabbrowser-tab:not([visuallyselected])[multiselected] .tab-background {
  background-color: blue !important;
  border: 1px solid gray !important;
  border-bottom: none !important;
}

/* multiselected hover */
.tabbrowser-tab:not([visuallyselected]):hover .tab-background {
  background-color: lime !important;
}

/* unselektiert hover */
.tabbrowser-tab:not([visuallyselected], [multiselected]):hover .tab-background {
  background-color: orange !important;
}

/* ---------------------------------------------------------------------------------- */

Alles anzeigen

Skippy

Danke erst mal für deine css-Codes und sorry, dass ich mich jetzt erst wieder melde.
Gestern und heute habe ich einige Zeit mit den Codes herumprobiert, aber es hat nicht ganz geklappt. Manches wurde zwar so geändert, wie ich es mir gewünscht habe, aber anderes ging dann nur teilweise oder auch gar nicht.

Wahrscheinlich liegt es hieran: Die userChrome.css wurde vor einiger Zeit schon mal ziemlich geändert und da habe ich es mit meinem Halbwissen jetzt nicht hinbekommen, die von dir geschriebenen Codes dort mit einzufügen bzw. auch altes unnützes gegen neues auszutauchen.
Ein Problem war auch mal – zumindest bei meinen Versuchen – dass bei dem verwendeten Theme die hellen blaugrauen Teile Farbverläufe haben, die man beim kurz mal draufgucken kaum bemerkt.

Hier ist mal die komplette alte userChrome.css. Vielleicht kannst du dort mal drüberschauen und gucken, wie ich meine neuen Wünsche dort eintragen muss. Es eilt auch nicht!

CSS

#context_moveTabToNewGroup,
#context_askChat,
#context_askChat + menuseparator,
#context_closeDuplicateTabs {
  display: none !important;
}

#context_reloadTab {
  order: -1 !important;
}

#context_selectAllTabs{
  order: -1 !important;
}


/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar menuitem,
#PlacesToolbar menu {
  margin: 0 0 !important;
  min-height: 20px !important;
  padding-top: 1px !important; 
  padding-bottom: 0 !important;
  border-radius: unset !important;
}

/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
/* 1px = Abstand Zeile oben und unten, 10px = Abstand linker Rand */
menupopup > menuitem,
menupopup > menu {
  padding-block: 1px !important;
  padding-inline-start: 10px !important;
}

#tab-preview-panel {
  --panel-width: auto !important;
}

/* Entfernt in der Tabzeile rechts die Grafik für -Alle Tabs Auflisten- */
#alltabs-button {
  display: none !important;
  }

/* Höhe der Tabs */
.tabbrowser-tab {
min-height: 36px !important;
max-height: 36px !important;
margin-top: 2px !important;
margin-bottom: 0 !important;
}

/* Rahmen des aktiven Tabs */
.tabbrowser-tab .tab-background[selected="true"] {
border-left: 1px solid #767676 !important;   /* Farbe der festsichtbaren Rahmenlinien, mittelgrau */
border-right: 1px solid #767676 !important;
border-top: 1px solid #767676 !important;
border-bottom: 2px solid #E6F0F8 !important; /* Höhe und Farbe der unteren Rahmenlinie */
box-shadow: none !important;  /* Entfernt den Schatten um den Rahmen */
}

/* Fügt eine schwarze Linie über der Symbolleiste als Trennlinie zum Tabbereich ein. Der aktive Tab hat dann 
Rahmenlinien seitlich und oben, aber nicht unten. Diese Ansicht war mal verschwunden, daher nun ein extra Code */
.tabbrowser-tab[selected] {
   position: relative;
   z-index: 1;
}

/* Tab Inhalt Abstände */
:root {
   --proton-tab-radius: 0px !important;   
   --proton-tab-block-margin: 2px !important;
   --inline-tab-padding: 9px !important;
}

/* Seitliche Abstände der Texte in Tab-Kontextmenüs */
menupopup#tabContextMenu menuitem,
menupopup#tabContextMenu menu {
  padding-left: 10px !important;
  padding-right: 10px !important;
 }
 
menupopup#placesContext menuitem,
menupopup#placesContext menu {
 padding-left: 10px !important;
 padding-right: 10px !important;
 }
 
 
/* Farbverlauf in der Tabzeile von oben nach unten */
#TabsToolbar {
   background: linear-gradient(to bottom, #CDDBE9, #E0EDF5 ) !important;
}

/* Aktiver Tab Hintergrund mit Farbverlauf */
.tabbrowser-tab[visuallyselected="true"]> .tab-stack > .tab-background {
   background: linear-gradient(to bottom, #EDF4FA, #E8F1F9 ) !important;
}

/* Inaktiver Tab hover Hintergrund */
.tabbrowser-tab:not([visuallyselected="true"]):hover  > .tab-stack > .tab-background {
   background: #BEC9D1 !important;    
}

/* Neuer-Tab-Button hover HG, funktioniert nur ohne eigenen HG für den Button */
#TabsToolbar #tabs-newtab-button {
  --toolbarbutton-hover-background: #BEC9D1 !important;  
}

/* Abstand zwischen den Lesezeichen in der Lesezeichen-Symbolleiste */
toolbarbutton.bookmark-item {
  margin-inline: 5px !important;
}

/* Entfernt die farbigen Rahmen bei allen aktiven Eingabefeldern */
input:not([type="file"], [type="image"]):focus-visible,
select:focus-visible,
button:focus-visible,
textarea:focus-visible {
    outline-style: none !important;
    }

/* Entfernt den farbigen Rahmen um das Adressfeld bei neu geöffneten Tab-Seiten */
#urlbar {
    --toolbar-field-focus-border-color: transparent !important;   
}

/* Entfernt den farbigen Rahmen ums vorgeschlagene Auswahlfeld bei der Auswahl, ob eine 
Datei im Net nach dem Anklicken geöffnet oder runtergeladen werden soll, z.B. PDFs */
@-moz-document url(chrome://mozapps/content/downloads/unknownContentType.xhtml){

:root {
  --focus-outline-width: 0 !important;
}
}

/* Farbe des Sterns im Suchfeld bei schon gesetztem Lesezeichen für die aktuelle Seite */
#star-button[starred="true"] {
    fill: #7D7C7C !important;
    }

/* Farbe des Seite-Neu-Laden-Buttons in der Symbolzeile */
#reload-button {
    color: #0558E2 !important;
    }

menuitem#context_selectAllTabs {
  -moz-box-ordinal-group: 1 !important;
}

/* Entfernt den Eintrag "Teilen" aus Tab-Kontextmenü */ 
menuitem[data-l10n-id="tab-context-share-url"] {
display: none !important;
}


#context_moveTabToSplitView.badge-new::after {
  display: none !important;
}

Alles anzeigen

2002Andreas

Zitat von Skippy

anderes ging dann nur teilweise oder auch gar nicht.

Sieht hier so aus:

mit diesem Code:

CSS

/* Eckige statt abgerundete Elemente */
   :root {
     --border-radius-xsmall: 0 !important;
     --border-radius-small: 0 !important;
     --border-radius-medium: 0 !important;
     --border-radius-large: 0 !important;
     --border-radius-xlarge: 8px !important;
     --border-radius-circle: 0 !important;
   }

/* ================================================== */
/* Toolbar-Hintergründe                                */
/* ================================================== */

/* Menüleiste */
#toolbar-menubar {
  background: #ffff00 !important;
}

/* Tableiste */
#TabsToolbar-customization-target {
  background: #00ff00 !important;
}

/* Adressleiste */
#nav-bar-customization-target {
  background: #00ffff !important;
}

/* Lesezeichenleiste */
#PersonalToolbar {
  background: #ff00ff !important;
}

/* ================================================== */
/* Feine Linie: Unterkante der Tab-Leiste              */
/* (wird vom aktiven Tab unterbrochen)                 */
/* ================================================== */

/* Linie als Pseudo-Element am unteren Rand der Tab-Leiste */
#TabsToolbar {
  position: relative !important;
  border-bottom: none !important;
}

#TabsToolbar::before {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: gray !important;
  z-index: 0 !important;
}

.tabbrowser-tab[visuallyselected] .tab-background {
  box-shadow: 0 15px 0 0 #00ffff !important;
  margin-bottom: -15px !important;
}
/* ================================================== */
/* Tabs                                                */
/* ================================================== */

/* Basis aller Tabs – kein Rahmen hier! */
.tabbrowser-tab .tab-background {
  background-color: yellow !important;
  outline: none !important;
  border: none !important;
}

/* aktiver Tab mit Rahmen, unten offen */
.tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background {
  background-color: #00ffff !important;
  border: 1px solid gray !important;
  border-bottom: none !important;
}

/* multiselektierte Tabs */
.tabbrowser-tab:not([visuallyselected])[multiselected] .tab-background {
  background-color: blue !important;
  border: 1px solid gray !important;
  border-bottom: none !important;
}

/* multiselected hover */
.tabbrowser-tab:not([visuallyselected]):hover .tab-background {
  background-color: lime !important;
}

/* unselektiert hover */
.tabbrowser-tab:not([visuallyselected], [multiselected]):hover .tab-background {
  background-color: orange !important;
}

/* ---------------------------------------------------------------------------------- */


#context_moveTabToNewGroup,
#context_askChat,
#context_askChat + menuseparator,
#context_closeDuplicateTabs {
  display: none !important;
}

#context_reloadTab {
  order: -1 !important;
}

#context_selectAllTabs{
  order: -1 !important;
}


/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar menuitem,
#PlacesToolbar menu {
  margin: 0 0 !important;
  min-height: 20px !important;
  padding-top: 1px !important; 
  padding-bottom: 0 !important;
  border-radius: unset !important;
}

/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
/* 1px = Abstand Zeile oben und unten, 10px = Abstand linker Rand */
menupopup > menuitem,
menupopup > menu {
  padding-block: 1px !important;
  padding-inline-start: 10px !important;
}

#tab-preview-panel {
  --panel-width: auto !important;
}

/* Entfernt in der Tabzeile rechts die Grafik für -Alle Tabs Auflisten- */
#alltabs-button {
  display: none !important;
  }

/* Höhe der Tabs */
.tabbrowser-tab {
min-height: 36px !important;
max-height: 36px !important;
margin-top: 2px !important;
margin-bottom: 0 !important;
}

/* Rahmen des aktiven Tabs */
.tabbrowser-tab .tab-background[selected="true"] {
border-left: 1px solid #767676 !important;   /* Farbe der festsichtbaren Rahmenlinien, mittelgrau */
border-right: 1px solid #767676 !important;
border-top: 1px solid #767676 !important;
border-bottom: 2px solid #E6F0F8 !important; /* Höhe und Farbe der unteren Rahmenlinie */
box-shadow: none !important;  /* Entfernt den Schatten um den Rahmen */
}

/* Fügt eine schwarze Linie über der Symbolleiste als Trennlinie zum Tabbereich ein. Der aktive Tab hat dann 
Rahmenlinien seitlich und oben, aber nicht unten. Diese Ansicht war mal verschwunden, daher nun ein extra Code */
.tabbrowser-tab[selected] {
   position: relative;
   z-index: 1;
}

/* Tab Inhalt Abstände */
:root {
   --proton-tab-radius: 0px !important;   
   --proton-tab-block-margin: 2px !important;
   --inline-tab-padding: 9px !important;
}

/* Seitliche Abstände der Texte in Tab-Kontextmenüs */
menupopup#tabContextMenu menuitem,
menupopup#tabContextMenu menu {
  padding-left: 10px !important;
  padding-right: 10px !important;
 }
 
menupopup#placesContext menuitem,
menupopup#placesContext menu {
 padding-left: 10px !important;
 padding-right: 10px !important;
 }
 
 
/* Farbverlauf in der Tabzeile von oben nach unten */
#TabsToolbar {
   background: linear-gradient(to bottom, #CDDBE9, #E0EDF5 ) !important;
}

/* Aktiver Tab Hintergrund mit Farbverlauf */
.tabbrowser-tab[visuallyselected="true"]> .tab-stack > .tab-background {
   background: linear-gradient(to bottom, #EDF4FA, #E8F1F9 ) !important;
}

/* Inaktiver Tab hover Hintergrund */
.tabbrowser-tab:not([visuallyselected="true"]):hover  > .tab-stack > .tab-background {
   background: #BEC9D1 !important;    
}

/* Neuer-Tab-Button hover HG, funktioniert nur ohne eigenen HG für den Button */
#TabsToolbar #tabs-newtab-button {
  --toolbarbutton-hover-background: #BEC9D1 !important;  
}

/* Abstand zwischen den Lesezeichen in der Lesezeichen-Symbolleiste */
toolbarbutton.bookmark-item {
  margin-inline: 5px !important;
}

/* Entfernt die farbigen Rahmen bei allen aktiven Eingabefeldern */
input:not([type="file"], [type="image"]):focus-visible,
select:focus-visible,
button:focus-visible,
textarea:focus-visible {
    outline-style: none !important;
    }

/* Entfernt den farbigen Rahmen um das Adressfeld bei neu geöffneten Tab-Seiten */
#urlbar {
    --toolbar-field-focus-border-color: transparent !important;   
}

/* Entfernt den farbigen Rahmen ums vorgeschlagene Auswahlfeld bei der Auswahl, ob eine 
Datei im Net nach dem Anklicken geöffnet oder runtergeladen werden soll, z.B. PDFs */
@-moz-document url(chrome://mozapps/content/downloads/unknownContentType.xhtml){

:root {
  --focus-outline-width: 0 !important;
}
}

/* Farbe des Sterns im Suchfeld bei schon gesetztem Lesezeichen für die aktuelle Seite */
#star-button[starred="true"] {
    fill: #7D7C7C !important;
    }

/* Farbe des Seite-Neu-Laden-Buttons in der Symbolzeile */
#reload-button {
    color: #0558E2 !important;
    }

menuitem#context_selectAllTabs {
  -moz-box-ordinal-group: 1 !important;
}

/* Entfernt den Eintrag "Teilen" aus Tab-Kontextmenü */ 
menuitem[data-l10n-id="tab-context-share-url"] {
display: none !important;
}


#context_moveTabToSplitView.badge-new::after {
  display: none !important;
}

Alles anzeigen

Der obere Teil ist neu.

Skippy

Hallo,
hier bin ich noch mal.

Ich habe in den vergangenen Tagen mit verschiedenen Einstellungen herumgespielt und nun habe ich bis auf eine Kleinigkeit alles so, wie es mir gefällt. Anstatt an einigen Stellen die Rundungen von Proton wegzubekommen und es lieber wieder eckig zu haben, finde ich die Rundungen jetzt doch ganz nett und möchte sie so lassen. Das heißt, bis auf die Hintergründe bei Mouseover über den Einträge in den Ordnern, die auf der Lesezeichen-Symbolleiste liegen.

Ich habe auf dem Laptop und dem PC nun eine identische userChrome.css in Verwendung. Wenn ich am Laptop in der Lesezeichen-Symbolleiste einen Ordner öffne, dann erhalten die Einträge dort bei Mouseover einen eckigen Hintergrund. So gefällt es mir gut und so soll es bleiben. Auch kann ich die Abstände in der Höhe zwischen den einzelnen Eintäge anpassen, diese vergrößern oder verkleinern. So wie es auf dem beigefügten Bild rechts zu sehen ist, gefällt es mir für den Laptop jetzt gut.

Genauso soll es auch am PC sein, doch dort bekomme ich es einfach nicht hin, obwohl dort - wie schon erwähnt - die userChrome.css nun völlig identisch ist. Ich habe schon verschiedenes probiert, aber das hatte entweder gar nichts geändert oder es wurde verschlimmbessert …
Die Abstände zwischen den einzelnen Einträgen sind dort deutlich größer und der Mouseover-Hintergrund ist abgerundet. Wie lässt sich das ändern? Die Einträge dichter zusammenschieben geht momentan vielleicht auch deswegen nicht, weil der Mouseover-Hintergrund so hoch ist (im Bild links).

Dieses habe ich in der userChrome.css stehen:

CSS

/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar menuitem,
#PlacesToolbar menu {
  margin: 0 0 !important;
  min-height: 20px !important;
  padding-top: 1px !important; 
  padding-bottom: 0 !important;
  border-radius: unset !important;
}

/* Tab Inhalt Abstände */
:root {
   --proton-tab-radius: 0px !important;   
   --proton-tab-block-margin: 2px !important;
  --inline-tab-padding: 9px !important;
}

Alles anzeigen

Mira_Belle

Schau mal in den Einstellungen unter "Dichte des Fensters", ob Du da den Kompaktmodus aktiviert hast.

Skippy

Am Laptop steht es auf "Automatisch (Standard)".
Beim PC müsste ich morgen mal gucken und es dort evtl. mal mit "Kompakt" probieren, falls dort was anderes ausgewählt ist.

2002Andreas

Zitat von Skippy

Dieses habe ich in der userChrome.css stehen:

Das sollte ausreichen:

CSS

/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar .toolbar-menupopup :is(menuitem,menu) {
  padding: 0 0 !important; 
}

Und das hat keinerlei Funktion mehr, das stammt noch aus Zeiten von Proton, und wir sind bei Nova inzwischen.

CSS

/* Tab Inhalt Abstände */
:root {
   --proton-tab-radius: 0px !important;   
   --proton-tab-block-margin: 2px !important;
  --inline-tab-padding: 9px !important;
}

Zitat von Skippy

mit "Kompakt" probieren

Hat darauf keinen Einfluss.

Zitat von Skippy

doch dort bekomme ich es einfach nicht hin

Nutzt du dort denn schon CSS-Codes?

Ansonsten, hast du den config Eintrag auf true stehen?

toolkit.legacyUserProfileCustomizations.stylesheets

Skippy

Zitat von 2002Andreas
Das sollte ausreichen:
CSS
/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar .toolbar-menupopup :is(menuitem,menu) {
  padding: 0 0 !important; 
}
Okay, ich werde es morgen mal am PC ausprobieren.

Und das hat keinerlei Funktion mehr, das stammt noch aus Zeiten von Proton, und wir sind bei Nova inzwischen.
CSS
/* Tab Inhalt Abstände */
:root {
   --proton-tab-radius: 0px !important;   
   --proton-tab-block-margin: 2px !important;
  --inline-tab-padding: 9px !important;
}
Dann kann ich es ja entfernen. Gibt es etwas ähnliches auch für Nova oder ist das nicht nötig?

Zitat von Skippy

mit "Kompakt" probieren

Hat darauf keinen Einfluss.

Zitat von Skippy

doch dort bekomme ich es einfach nicht hin

Nutzt du dort denn schon CSS-Codes?
Ja
Ansonsten, hast du den config Eintrag auf true stehen?
Ja
toolkit.legacyUserProfileCustomizations.stylesheets
genau so
Alles anzeigen

2002Andreas

Zitat von Skippy

Gibt es etwas ähnliches auch für Nova oder ist das nicht nötig?

Was genau möchtest du denn erreichen?

Tabs eckig...Schrift verschoben?

Wenn ja, teste bitte:

CSS

.tab-background {
 --tab-border-radius: 0 !important;
}

.tab-label {
  margin-inline: 10px !important;
}

PS:

Bitte nicht innerhalb von einem Zitat antworten, das ist unübersichtlich.

Skippy

Zitat von 2002Andreas

Das sollte ausreichen:

CSS
/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar .toolbar-menupopup :is(menuitem,menu) {
padding: 0 0 !important;
}

Alles anzeigen

Das scheint bei mir nicht zu funktionieren. Ich habe es da auch mal mit verschiedenen Werten probiert, aber das Ergebnis sieht immer gleich aus. Die Abstände werden weder kleiner noch größer. Sie bleiben zwischen den einzelnen Lesezeichen-Zeilen immer auf dem selben zu großen Abstand. Hmmm ...
Ob der Hintergrund eines Lesezeichens bei Mouseover nun eckig oder abgerundet angezeigt wird, ist mittlerweile nicht mehr so wichtig für mich, aber es wäre toll, wenn es klappen würde, dass sich die Abstände zwischen den einzelnen doch noch irgendwie verringern ließen, so wie es auf dem Bild in Beitrag #5 zu sehen ist.
Es ist halt seltsam, dass sich das am Laptop alles prolemlos machen lässt, aber am PC hakt es.

Mira_Belle

Mh, poste doch einmal Dein komplettes CSS, bitte.
Eventuell beißt sich da was.

Aber vorher könntest Du das noch mal ausprobieren:

CSS

	/* --------------------------------------------- */
	/* -------- Zeilenabstände in den Menüs -------- */
    /* --------------------------------------------- */

    #AppMenuButton menupopup > menuitem,
    #AppMenuButton menupopup > menu {
        padding-block: 3px !important; /* default 4px */
    }

    menupopup > menuitem,
    menupopup > menu {
        padding-block: 2px !important;
	}

Alles anzeigen

2002Andreas

Zitat von Skippy

Das scheint bei mir nicht zu funktionieren

Ohne den Code:

Mit dem Code:

Also passt etwas an deinem PC nicht

Steht in deiner userChrome.css Datei unten rechts auch: UTF-8

Und wie schon gesagt, poste bitte den kompl. Inhalt deiner userChrome.css Datei.

Skippy

Zitat von 2002Andreas

Steht in deiner userChrome.css Datei unten rechts auch: UTF-8

Ja, da steht UTF-8

Hier ist der komplette Inhalt der userChrome.css.
Einiges altes, das längst nicht mehr gültig oder nötig war, habe ich zuvor rausgeschmissen. Das hier ist nun noch übrig.
Die Werte oben bei margin-inline und padding-block kann ich ändern wie ich will, z. B. auf 5, 8 oder 12 stellen, im Browser bleibt der Lesezeichabstand danach trotzdem immer bei dem alten wie auf dem Screenshot.

CSS

/* ------------------------------------------------------------------------------ */
/* --------------------- Abstände in den Lesezeichen-Menüs ---------------------- */
/* ------------------------------------------------------------------------------ */

/* Abstand zwischen den Lesezeichen in der Lesezeichen-Symbolleiste */
  toolbarbutton.bookmark-item {
      margin-inline: 2px !important;
  }

  #AppMenuButton menupopup > menuitem,
  #AppMenuButton menupopup > menu {
      padding-block: 3px !important; /* default 4px */
  }


/* ------------------------------------------------------------------------------ */
/* ------------------------------------ Tabs ------------------------------------ */
/* ------------------------------------------------------------------------------ */

#tab-preview-panel {
  --panel-width: auto !important;
}

/* Farbverlauf in der Tabzeile von oben nach unten */
#TabsToolbar {
   background: linear-gradient(to bottom, #CDDBE9, #E0EDF5 ) !important;
}

/* Entfernt in der Tabzeile rechts die Grafik für -Alle Tabs Auflisten- */
#alltabs-button {
  display: none !important;
  }

/* Höhe der Tabs */
.tabbrowser-tab {
min-height: 36px !important;
max-height: 36px !important;
margin-top: 2px !important;
margin-bottom: 0 !important;
}

/* Seitliche Abstände der Texte in Tab-Kontextmenüs */
menupopup#tabContextMenu menuitem,
menupopup#tabContextMenu menu {
  padding-left: 10px !important;
  padding-right: 10px !important;
 }

/* Entfernt den farbigen Rahmen um das Adressfeld bei neu geöffneten Tab-Seiten */
#urlbar {
    --toolbar-field-focus-border-color: transparent !important;   
}

menuitem#context_selectAllTabs {
  -moz-box-ordinal-group: 1 !important;
}

/* Entfernt den Eintrag "Teilen" aus Tab-Kontextmenü */ 
menuitem[data-l10n-id="tab-context-share-url"] {
display: none !important;
}


/* ---------------------------------------------------------------------------- */
/* -------------------------------- Sonstiges --------------------------------- */
/* ---------------------------------------------------------------------------- */

/* Entfernt den farbigen Rahmen ums vorgeschlagene Auswahlfeld bei der Auswahl,ob eine 
Datei im Net nach dem Anklicken geöffnet oder runtergeladen werden soll, z.B. PDFs */
@-moz-document url(chrome://mozapps/content/downloads/unknownContentType.xhtml){

:root {
  --focus-outline-width: 0 !important;
}
}

/* Entfernt die farbigen Rahmen bei allen aktiven Eingabefeldern */
input:not([type="file"], [type="image"]):focus-visible,
select:focus-visible,
button:focus-visible,
textarea:focus-visible {
    outline-style: none !important;
    }

Alles anzeigen

2002Andreas

Zitat von Skippy

Die Werte oben bei margin-inline und padding-block kann ich ändern wie ich will

Das ist ja auch nicht der Code aus Beitrag Nr. 8 den ich dir extra gegeben hatte

Teste bitte:

CSS

/* ------------------------------------------------------------------------------ */
/* --------------------- Abstände in den Lesezeichen-Menüs ---------------------- */
/* ------------------------------------------------------------------------------ */

/* Abstand zwischen den Lesezeichen in der Lesezeichen-Symbolleiste */
/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar .toolbar-menupopup :is(menuitem,menu) {
  padding: 0 0 !important; 
}

/* Hamburger Menu Abstände */
#appMenu-mainView {
    --panel-menuitem-padding: 1px !important;
}


/* ------------------------------------------------------------------------------ */
/* ------------------------------------ Tabs ------------------------------------ */
/* ------------------------------------------------------------------------------ */

#tab-preview-panel {
  --panel-width: auto !important;
}

/* Farbverlauf in der Tabzeile von oben nach unten */
#TabsToolbar {
   background: linear-gradient(to bottom, #CDDBE9, #E0EDF5 ) !important;
}

/* Entfernt in der Tabzeile rechts die Grafik für -Alle Tabs Auflisten- */
#alltabs-button {
  display: none !important;
  }

/* Höhe der Tabs */
.tabbrowser-tab {
min-height: 36px !important;
max-height: 36px !important;
margin-top: 2px !important;
margin-bottom: 0 !important;
}

/* Seitliche Abstände der Texte in Tab-Kontextmenüs */
menupopup#tabContextMenu menuitem,
menupopup#tabContextMenu menu {
  padding-left: 10px !important;
  padding-right: 10px !important;
 }

/* Entfernt den farbigen Rahmen um das Adressfeld bei neu geöffneten Tab-Seiten */
#urlbar {
    --toolbar-field-focus-border-color: transparent !important;   
}

menuitem#context_selectAllTabs {
  -moz-box-ordinal-group: 1 !important;
}

/* Entfernt den Eintrag "Teilen" aus Tab-Kontextmenü */ 
menuitem[data-l10n-id="tab-context-share-url"] {
display: none !important;
}


/* ---------------------------------------------------------------------------- */
/* -------------------------------- Sonstiges --------------------------------- */
/* ---------------------------------------------------------------------------- */

/* Entfernt den farbigen Rahmen ums vorgeschlagene Auswahlfeld bei der Auswahl,ob eine 
Datei im Net nach dem Anklicken geöffnet oder runtergeladen werden soll, z.B. PDFs */
@-moz-document url(chrome://mozapps/content/downloads/unknownContentType.xhtml){

:root {
  --focus-outline-width: 0 !important;
}
}

/* Entfernt die farbigen Rahmen bei allen aktiven Eingabefeldern */
input:not([type="file"], [type="image"]):focus-visible,
select:focus-visible,
button:focus-visible,
textarea:focus-visible {
    outline-style: none !important;
    }

Alles anzeigen

Skippy

Jetzt ist der komplette Code aus Beitrag Nr. 8 online. Die einzelnen Lesezeichen sind nun alle dicht aneinander.
Jetzt versuche ich schon seit ein paar Minuten, zwischen denen jeweils einen Abstand von etwa 3 oder 4px einzufügen, aber sie kleben trotzdem weiterhin direkt aneinander.
Habe es mit Änderungen an den Werten in Zeile 8 und auch 13 versucht, aber die haben nie etwas bewirkt.

2002Andreas

Zitat von Skippy

einen Abstand von etwa 3 oder 4px einzufügen

So funktioniert das hier einwandfrei

CSS

/* Abstand zwischen den Lesezeichen in der Lesezeichen-Symbolleiste */
/* Abstände/Höhe der Einträge in Lesezeichen-Popup-Menüs ändern */
#PlacesToolbar .toolbar-menupopup :is(menuitem,menu) {
  padding: 2px 0 !important; 
}

/* Hamburger Menu Abstände */
#appMenu-mainView {
    --panel-menuitem-padding: 8px !important;
}

Die Werte musst du dir dann anpassen.

So sieht das mit 12px aus:

und so mit 4px:

Skippy

Juchhe, jetzt hat's endlich funktioniert. 😀
Mein Fehler war, dass ich es bei beiden mit unterschiedlichen Werten versucht hatte ... *sehr peinlich*
Danke für deine Geduld.

Ein kurze letzte Frage noch. Wie kann man die Breite eines offenen Lesezeichenordners begrenzen? Manche Lesezeichen haben einen langen Text und dadurch werden die Spalten manchmal recht breit.
Kann man die Breite irgendwie begrenzen und der lange Text wird dann an einem bestimmten Punkt abgestoppt und es kommt evtl. einfach ein . . . hinten dran?

2002Andreas

Zitat von Skippy

jetzt hat's endlich funktioniert

Zitat von Skippy

Danke für deine Geduld.

gern geschehen

Zitat von Skippy

die Breite eines offenen Lesezeichenordners begrenzen?

Teste bitte, den Wert musst/kannst du dir anpassen:

CSS

#PlacesToolbar .toolbar-menupopup {
  max-width: 300px !important;
}

Änderungen am Theme nach dem Update auf die 157.0 rückgängig machen

Beitrag von Skippy (16. Oktober 2026 um 20:07)

Ähnliche Themen

Mozilla veröffentlicht Firefox 157 mit Nova-Design

Farbe der Tabs je nach Status definieren

Das Security-Märchen

2026-Update: Aktualisierung auf WoltLab Suite 6.2

Exklusiv: So sieht das neue „Nova”-Design von Firefox aus