Verschiedene Border-Styles für verschiedene Popups?

harff182

Meine PopUps bekommen bisher mit diesem Code Ihren Rahmen:

CSS

#PlacesToolbar menupopup[placespopup="true"]::part(arrowscrollbox),
:is(panel, menupopup)::part(content) {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */

Für aufgeklappte Menüs möchte ich das auch so (solid) lassen:

Für den Lesezeichenbereich hätte ich gerne "dashed":

Und den Rest "dotted":

(Wie) Ist das zu machen?

2002Andreas

Zitat von harff182

(Wie) Ist das zu machen?

Alle einzeln ansprechen, und nicht mit deinem pauschalen Code.

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

menupopup#contentAreaContextMenu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

harff182

Wie immer:

paßt, wackelt nicht und tut was es soll

und: Danke

2002Andreas

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

harff182

Hab grade noch 2 PopUps erwischt, die jetzt keinen der 3 Borderstyles haben:

Rechtsklick auf einen Tab:

Rechtsklick in die Tab-Leiste:

Soll-Style = dotted.

Wie muß ich die mit unterbringen ?

grisu2099

Deine Bilder funktionieren nicht...

Bitte testen:

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

menupopup#contentAreaContextMenu,
#tabContextMenu,
#toolbar-context-menu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

harff182

hm... ich konnte sie sehen - hab mal neu hochgeladen und meld mich mal ab/an....

grisu2099 : Danke, paßt

Und jetzt geh ich in den Werkzeugen suchen, warum ich die beiden nicht gefunden hab

grisu2099

Zitat von harff182

ich konnte sie sehen

jetzt sehe ich sie auch...

Zitat von harff182

Danke, paßt

Gern geschehen!

harff182

Hab noch'n bischen mehr rumgeklickt und noch 2 gefunden, wo sich die Context-Menüs nicht angesprochen fühlen:

urlbar und searchbar.

Ich find aber kein #urlbar-context-menu oder #searchbar-context-menu oder so ähnlich

2002Andreas

Zitat von harff182

Ich find aber kein

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#urlbar,  
#PopupSearchAutoComplete,
menupopup#contentAreaContextMenu,
#tabContextMenu,
#toolbar-context-menu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

Und so für das Hamburger Menü wenn gewünscht:

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#appMenu-protonMainView,
#urlbar,  
#PopupSearchAutoComplete,
menupopup#contentAreaContextMenu,
#tabContextMenu,
#toolbar-context-menu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

milupo

Zitat von 2002Andreas

#PlacesToolbar menupopup[placespopup="true"]::part(arrowscrollbox) { border: 5px red dashed !important; /* Rahmendicke, Farbe */ border-radius: 10px !important; /* PopUps gerundet */ }

Sollte eigentlich nur in der userChromeShadow.css und im Stileditor funktionieren, da unter #shadow-root.

2002Andreas

Zitat von milupo

Sollte eigentlich

In Beitrag Nr 3 scheint es bei ihm zu funktionieren wie gewünscht

Ansonsten:

CSS

#PlacesToolbar  menupopup {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

milupo

Ich könnte mir vorstellen, dass der zweite Selektor - menupopup - ignoriert wird. Es ist ja noch #PlacesToolbar da.

2002Andreas

Zitat von harff182

Ich find aber kein

Dieser Code ist besser für die Urlbar.

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#urlbar[breakout][breakout-extend] > #urlbar-background,  
#PopupSearchAutoComplete,
menupopup#contentAreaContextMenu,
#tabContextMenu,
#toolbar-context-menu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

Damit ist nur dann der Rahmen vorhanden, wenn das Popup offen ist.

harff182

Zitat von milupo

Sollte eigentlich nur in der userShadowChrome.css

Ich hab den kompletten Code für die PopUps da drin. Falsch?

2002Andreas :

jetzt hab ich zwar um die urlbar einen gepunkteteten Rahmen, aber wenn ich da reinklicke, fühlt sich das PopUp nicht angesprochen:

Und wenn ich in die searchbar rechtsklicke, hat das PopUp auch nur den normalem Rahmen.

2002Andreas

Zitat von harff182

Ich hab den kompletten Code für die PopUps da drin

Pack den bitte mal in die userChrome.css und teste es dann.

CSS

#menubar-items menupopup {
    border: 5px red solid !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#PlacesToolbar  menupopup {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

#urlbar[breakout][breakout-extend] > #urlbar-background,  
#PopupSearchAutoComplete,
menupopup#contentAreaContextMenu,
#tabContextMenu,
#toolbar-context-menu  {
    border: 5px red dotted !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

Alles anzeigen

milupo

Bei mir funktionieren die Rahmen nur für die Kontextmenüs der Menüleiste und der Seiteninhalte. Für die Lesezeichenleiste nicht. Und genau das ist unter #shadow-root. Allerdings bin ich hier mit dem 96er Nightly unterwegs.

Zitat von harff182

Ich hab den kompletten Code für die PopUps da drin.

Die ist nur für Codes gedacht, die unter dem Knoten #shadow-root() liegen. Normalerweise ist die userChrome.css zuständig.

2002Andreas

Evtl. muss dann nur dieser Teil unter shadow:

CSS

#PlacesToolbar  menupopup[placespopup="true"]::part(arrowscrollbox) {
    border: 5px red dashed !important;    /* Rahmendicke, Farbe */
    border-radius: 10px !important;        /* PopUps gerundet */
}

PS:

Bin dann aber mal weg...bis morgen...

harff182

Zitat von milupo

Die ist nur für Codes gedacht, die unter dem Knoten #shadow-root() liegen. Normalerweise ist die userChrome.css zuständig.

Alles klar.

Das aufsplitten und in die verschiedenen Files verteilen schaff ich aber jetzt nicht mehr, ich muß morgen früh zum Dok

Ich meld mich dann morgen wieder, wenn ich glaub, alles richtig verteilt zu haben.

guuts nächtle...

milupo

Zitat von 2002Andreas

Evtl. muss dann nur dieser Teil unter shadow:

So ist es eigentlich gedacht. Hier ein Kommentar aus der userChromeShadow.css:

Zitat

/* In dieser Datei werden alle CSS-Regeln eingefügt, welche einen ::part() Selektor benötigen. */

Verschiedene Border-Styles für verschiedene Popups?

harff182 14. November 2021 um 18:51

Ähnliche Themen

Eine Sync-Frage

Downloadaktion für verschiedene Dateitypen merken

Warum installiert Firefox so viel Ordner und an verschiedenen Orten? :-)

Verschiedene Websites werden seit Update auf Version 90.0 gar nicht mehr geladen

about:profiles - Reihenfolge angezeigte Profile ändern

Hintergrundfarbe der Menüs/Lesezeichen/Kontextmenü - mit Hover-Effekt