Lesezeichenmenü und Popup sind wieder hell und Abstände wieder groß

Mira_Belle

Verstehe ich nicht!

Das Lesezeichenmenü ist wieder hell!

Die Abstände sind auch wieder zu groß!

Die Menüs unter "Datei, Bearbeiten, Chronik, Lesezeichen, Extras und Hilfe sind außerdem viel zu breit

und haben vor dem Text viel zu viel Freifläche!

Bei den Popups das gleiche!

Der komplette Code!

CSS: userChrome.css

@-moz-document url(chrome://browser/content/browser.xhtml) {

/* ----------------------------------------------------------------------------*/
/***** Abstände der Einträge in den Menüs und Lesezeichen wieder schmaler ******/
/* ----------------------------------------------------------------------------*/

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

/*---------------------------------------------------*/
/********* Anpassungen des "Hamburgermenüs" **********/
/*---------------------------------------------------*/

    #appMenu-multiView .subviewbutton {
        padding-top: 2px !important;                /* Zeilenabstand */
    }

    /* Farbe des ersten Separators */
    
    .PanelUI-subView toolbarseparator.proton-zap {
        border-image: none !important;
        background: #e1e1e1 !important;                /* Hellgrau */
    }

    /* Farbe all der anderen Separatoren */

    #widget-overflow-mainView > toolbarseparator, 
    #widget-overflow-mainView > .panel-subview-body > toolbarseparator,
    .PanelUI-subView toolbarseparator, #permission-popup-mainView > toolbarseparator,
    #protections-popup-multiView toolbarseparator, #identity-popup-mainView > toolbarseparator,
    #identity-popup-securityView > toolbarseparator, #editBookmarkPanel toolbarseparator,
    .cui-widget-panelview menuseparator, .cui-widget-panel toolbarseparator,
    .PanelUI-subView > toolbarseparator {
        background: #e1e1e1 !important;                /* Hellgrau */
    }

    /* Farbe der Schrift & Hintergrund */
    
    panelview,
    #appMenu-popup  .panel-subview-body {
        color: #e1e1e1  !important;                 /* Hellgrau */
        background: #2b2a33  !important;               /* Grau */
    } 

/* -------------------------------------------------*/
/************* aktiven Tab einfärben ****************/
/* -------------------------------------------------*/

    .tab-background[selected="true"] {                                                                                            
        background:rgba(255, 148, 0, 0.4) !important;                                            
        box-shadow: inset  0px 0px 5px 0px #ff9400 !important; /* Orange */                        
    }                                                                                            


/*    .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background {    */
/*        background: rgba(255, 148, 0, 0.4) !important;                                                */
/*        box-shadow: inset 0px 0px 5px 0px #ff9400 !important;                                         */        /* Orange */                            
/*    }                                                                                                */

/* --------------------------------------------------*/
/************* passiven Tab einfärben ****************/
/* --------------------------------------------------*/

    .tab-background:not([selected]):not([multiselected]) {
        background:rgba(225, 225, 225, 0.2) !important;
        box-shadow: inset 0px 0px 5px 0px #e1e1e1 !important; /* Hellgrau */
    }

/*---------------------------------------------------*/
/************** Tab schließen X hover  ***************/
/*---------------------------------------------------*/

    .tab-content > .tab-close-button:hover {
/*      background: #E81123 !important;    */
/*        background: transparent !important;    */
        background:rgba(255, 0, 0, 0.4) !important;
/*        box-shadow: inset 0px 0px 4px 0px #ff0000 !important;    */             /* Hellrot*/
    }

/*---------------------------------------------------*/
/***************** New Tab Icon  *********************/
/*---------------------------------------------------*/
 
    /* Dies ist das Pluszeichen um einen neuen Tab zuöffnen */
 
/*     :-moz-any(.tabs-newtab-button,#tabs-newtab-button) {    */
*    :is(.tabs-newtab-button,#tabs-newtab-button) {
        list-style-image: url(./image/newtab-inverted.png) !important;
        -moz-image-region: rect(2px, 15px, 16px, 1px) !important;
    }

/*----------------------------------------------------*/
/* Anpassungen der Navigations- und Lesezeichenleiste */
/*----------------------------------------------------*/

    /* Navigationsleiste Farbe */

    #nav-bar {
        background-color: transparent !important;
    }

    /* Menüleiste Farbe */
    
    #PersonalToolbar {
        background-color: transparent !important;
    }

/*---------------------------------------------------*/
/********** Anpassungen in der Adressleiste **********/
/*---------------------------------------------------*/

    /* Lesezeichen-Stern ungesetzt */

    #star-button:not([starred="true"]) {
        fill: rgb(80,160,225) !important;            /* Hellblau */    
    }
    
    /* Lesezeichen-Stern gesetzt */
  
    #star-button[starred="true"] {
/*        fill: rgb(225,225,225) !important;            /* Hellgrau */
        fill: rgb(80,160,225) !important;            /* Hellblau */    
    }
    
    /*  Download-Anzeige */

    #downloads-button[progress="true"] #downloads-indicator-anchor #downloads-indicator-icon {
        fill: #FFCC00 !important;                    /* Orange */
    }
    #downloads-button {
        --toolbarbutton-icon-fill-attention: rgb(255,204,0) !important;    /* Orange */
    }
    #downloads-button > .toolbarbutton-badge-stack > #downloads-indicator-progress-outer { 
        border-color: #FFCC00 !important;            /* Orange */
    }
    #downloads-indicator-start-image {
        fill: #FFCC00 !important;                    /* Orange */
    }

    /* Rahmen von Adressfeld und Suchfeld  */

    #urlbar-container {
        --toolbar-field-focus-border-color: transparent !important;
    }
    
    #urlbar {
        --toolbar-field-focus-border-color: transparent !important;
    }
    
    #search-container {
        --toolbar-field-focus-border-color: transparent !important;
    }
    
    #searchbar {
        --toolbar-field-focus-border-color: transparent !important;
    }

    #urlbar:not([focused="true"], [open]):-moz-lwtheme > #urlbar-background,
    #searchbar:not(:focus-within):-moz-lwtheme {
        border: none !important;
    }

    /* Markierter Text  */
    
    ::selection {
        color: white !important;
        background: #ff8000 !important;
    }

/*----------------------------------*/
/********** Line entfernen **********/
/*----------------------------------*/

    /* Ich hatte eine helle Linie  */
    /* zwischen Tab- & Adressleiste */

    :root{ --tabs-navbar-shadow-size: 0 !important }


/*---------------------------------------------------*/
/********** Anpassungen an der Adressleiste **********/
/*---------------------------------------------------*/

    :root{ --lwt-toolbar-field-focus: rgb(43, 42, 51)!important }    /* Farbe Hintergrund (Dunkelgrau)*/

    :root{ --lwt-toolbar-field-focus-color: rgb(225, 225, 225)!important }    /* Farbe Schrift (Hellgrau) */

    :root{ --lwt-toolbar-field-background-color: rgba(255, 255, 255, 0)!important }    /* Farbe der Felder (transparent) */

    /* Farbe Url (Helles Orange)*/
    .urlbarView-url {
        overflow: hidden !important;
        color: rgba(255, 204, 0, 0.15)!important;
    }

    /* Schriftzug "Suchen" & Hintergrund */
    .urlbarView-row:not([type="tip"], [type="dynamic"])[selected] > .urlbarView-row-inner, .urlbarView-row-inner[selected] {
        background-color: rgba(225, 225, 225, 0.15) !important;        /* Hellgrau, transparent */
        color: #e1e1e1 !important;        /* Hellgrau */
    }

/*---------------------------------------------------*/
/**** Anpassungen an der Lesezeichen-Symbolleiste ****/
/*---------------------------------------------------*/

    /* "Breite" der Separatoren */
    #PlacesToolbarItems > toolbarseparator {
        padding-inline: 5px !important;
    }

    /* "Sichtbarkeit" der Separatoren */
    #PlacesToolbarItems > toolbarseparator::before {
        border-image-slice: 0 !important;
    }

}

Alles anzeigen

Was mich auch "nervt", der markierter Text ist in der Menüleiste auch nicht mehr grau, sondern wieder blau.

Kann mir da jemand helfen?

Um das Adressfeld erscheint plötzlich so ein heller Rahmen,

wie auch um das Suchenfeld!

Die URL sollte ein kräftiges orange sein, ist aber total blass.

PS: Zeile 196 Wert angepasst, bzw. geändert! Passt wieder!

Hier der "helle" Rahmen! Stört!

Heller Hintergrund! Falsche Schriftfarbe, sollte hellgrau sein

und der Abstand vor dem Text!

Und hier zusätzlich der falsche Zeilenabstand!

2002Andreas

Zitat von Mira_Belle

Die Abstände sind auch wieder zu groß!

So sieht das hier mit deinem Code aus:

.DeJaVu

Zitat von Mira_Belle

Das Lesezeichenmenü ist wieder hell!
Die Abstände sind auch wieder zu groß!

Warte mal ab, bis Firefox 92 aufschlägt, ich durfte dort in der Lesezeichenleiste (genauer: Lesezeichensymbolleiste als verschiebbaren Eintrag) schon nachbessern (Windows 8), was in v91 noch gut aussieht. Proton wird ständig weiterentwickelt.

Mira_Belle

Das macht irgendwie keinen Spaß!

Ach, um das "Hamburgermenü" ist ja auch dieser blöde "helle" Rahmen!!

2002Andreas

Zitat von Mira_Belle

Das macht irgendwie keinen Spaß!

Wenn man seinen Fx nach eigenen Vorstellungen verändert, dann muss man damit rechnen, dass etwas wieder angepasst werden muss.

Wäre ja sonst auch langweilig

.DeJaVu

Zitat von Mira_Belle

Das macht irgendwie keinen Spaß!

Du hast dich dafür entschieden, CSS für Firefox (userChrome) zu nutzen. Entweder konsequent mit Änderungen leben oder sein lassen. Und falls, sich am besten auf das beschränken, was man auch allein hinbekommt - und CSS büffeln.

Mira_Belle

Zitat von .DeJaVu

Du hast dich dafür entschieden, CSS für Firefox (userChrome) zu nutzen. Entweder konsequent mit Änderungen leben oder sein lassen. Und falls, sich am besten auf das beschränken, was man auch allein hinbekommt - und CSS büffeln.

Mh, Danke.

Mit folgendem Code habe ich die "hellen" Schatten (Rahmen) weg bekommen.

CSS

:root {
    --arrowpanel-border-color: transparent !important;
}

Für die Schatten um das Adressfeld inkl. ausgeklappte URL. (Wie nennt man das eigentlich?)

UND für das "Hamburgermenü"!

CSS

#PopupSearchAutoComplete {
    border-color: transparent !important;
}

Und für das Suchfeld inkl. dem ausgeklappten Teil.

Ich bitte um Hilfe bei der Hintergrundfarbe, Zellenbreite und Zeilenabstände der Menüs.

2002Andreas

Zitat von Mira_Belle

Zellenbreite und Zeilenabstände der Menüs.

Teste bitte mit ändern der Werte in Zeile 8 und 9.

Mira_Belle

Zitat von 2002Andreas

Teste bitte mit ändern der Werte in Zeile 8 und 9.

Danke!

CSS

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

Hat's gerichtet! [Ich weiß, der Wert "0" ist ohne px!]

Mira_Belle

Zitat von Mira_Belle

Verstehe ich nicht!
Das Lesezeichenmenü ist wieder hell!
Bei den Popups das gleiche!

Nun bräuchte ich nur noch hier Hilfe.

Dann habe ich fast alles wieder so, wie vorher. (Glaube ich)

2002Andreas

Zitat von Mira_Belle

Nun bräuchte ich nur noch hier Hilfe.

In deinem Code ist nichts enthalten, was den HG der Popups bzw. der Menüs einfärben soll.

Welches Theme nutzt du denn?

Mira_Belle

Zitat von 2002Andreas

Zitat von Mira_Belle

Dann habe ich fast alles wieder so, wie vorher. (Glaube ich)

In deinem Code ist nichts enthalten, was den HG der Popups bzw. der Menüs einfärben soll.
Welches Theme nutzt du denn?

Dann scheint es so, dass ich irrte. Sorry

Eventuell kann man aber ja doch die Popups "ändern"?

Das Theme ist "abstract Orange-and-blue" von Valou.

2002Andreas

Zitat von Mira_Belle

die Popups "ändern"?

Sehen hier mit deinem Theme so aus:

Dazu habe ich deinen Code aus Beitrag Nr. 1 genommen, ohne deine nachträglichen Änderungen.

milupo

Ist denn das Theme bei dir auch wirklich aktiviert? Schaue mal in den Add-on-Manager. Mir scheint, da ist eher das System-Theme oder das helle Theme aktiviert.

Mira_Belle

Zitat von 2002Andreas

Sehen hier mit deinem Theme so aus:
Dazu habe ich deinen Code aus Beitrag Nr. 1 genommen, ohne deine nachträglichen Änderungen.

Schon merkwürdig!

Bei mir, mit und ohne Theme, helle Hintergründe in den Menüs, Popups und auch im Suchfeld, wie auch im Adressfeld.

Ändere aktiviere ich das Theme, sind zwar das Adressfeld und das Suchfeld wieder dunkel,

aber alle haben wieder diesen hellen Rahmen, inkl. Hamburgermenü.

Popups und Menüs der Menüleiste bleiben hell!

Mira_Belle

So, ich habe des Rätselslösung!

Ich habe heute an der Farbgestaltung von Windows herumgespielt!

Ich finde es schrecklich, dass bei inaktivem Fenster die Titelleiste weis wird!

Alles wieder in den "alten" Zustand versetzt und oh Wunder,

die Menüs sind ALLE, ohne Ausnahme wieder dunkel!

Da soll man drauf kommen.

milupo

Zitat von Mira_Belle

Ich finde es schrecklich, dass bei inaktivem Fenster die Titelleiste weis wird!

Du kannst ja in den Windows-Einstellungen unter Anpassen --> Farben eine Akzentfarbe auswählen und dann ein Häkchen in „Titelleisten und Fensterrahmen“ einfügen. Seit Fx 89 verwendet übrigens Firefox für die Menüleiste nicht mehr die Windows-Farbe, dafür muss man einen entsprechenden CSS-Code angeben. Nur so nebenbei. Aber du hast ja ein Theme, das sich darum kümmert.

Mira_Belle

Zitat von milupo

Du kannst ja in den Windows-Einstellungen unter Anpassen --> Farben eine Akzentfarbe auswählen und dann ein Häkchen in „Titelleisten und Fensterrahmen“ einfügen. Seit Fx 89 verwendet übrigens Firefox für die Menüleiste nicht mehr die Windows-Farbe, dafür muss man einen entsprechenden CSS-Code angeben. Nur so nebenbei. Aber du hast ja ein Theme, das sich darum kümmert.

Ja und?

Habe ich doch! Ich habe Dunkelgrau gewählt und das inaktive Fenster, bzw. dessen Titelleiste wird weis.

Ist im übrigen egal welche Farbe ich auswähle.

Dennoch Danke.

milupo

OK. Ich verwende immer nur ein Fenster und die Titelleiste ist bei mir ausgeblendet.

Boersenfeger

// Es ist immer schwierig ein externes Theme und einwirkenden CSS-Code auf einen Nenner zu bringen. Wenn dann auch noch die Windows-Farbverwaltung ins Spiel kommt, wirds noch komplizierter. Aber wenn dann Proton komplett ist und man seine Einstellungen wieder auf Reihe hat, freut man sich über das Ergebnis.

Lesezeichenmenü und Popup sind wieder hell und Abstände wieder groß

Ähnliche Themen

einige Proton-Änderungen abmildern

Anpassungen wegen Proton

Anpassungen des "Hamburgermenüs"

Tab-Leiste anpassen