weiß wovon ich rede
Ich kann warten, die Hoffnung habe ich längst nicht aufgegeben.
![]()
weiß wovon ich rede
Ich kann warten, die Hoffnung habe ich längst nicht aufgegeben.
![]()
Entweder wie oben im Code anpassen, oder im pauschalen Code ausschließen:
Deinen zusätzlichen Code musste ich wieder entfernen, hat das Kontext-Menü zerbröselt. Ich bediene größtenteils alles mit diesem Code:
/* Buttons in den Popup-Menüs / Hintergrund */
#toolbar-context-menu menuitem.customize-context-moveToPanel,
#toolbar-context-menu menuitem.customize-context-removeFromToolbar,
#toolbar-context-menu menuitem.viewCustomizeToolbar,
#mainPopupSet menupopup#toolbar-context-menu menuitem.customize-context-reportExtension,
#mainPopupSet menupopup#toolbar-context-menu menuitem.customize-context-removeExtension,
#mainPopupSet menupopup#toolbar-context-menu menuitem.customize-context-manageExtension,
#placesContext menuitem,
#view-menu-popup menuitem#menu_customizeToolbars,
#mainPopupSet menupopup#toolbar-context-menu menuitem,
#history-menu menupopup#historyMenuPopup menu#historyUndoWindowMenu,
#tabContextMenu menuitem#context_closeLeftTabs,
#bookmarksMenu menupopup#bookmarksMenuPopup menuitem,
#historyMenuPopup menu#historyUndoMenu,
menupopup > menu ,menupopup > menuitem,popup > menu ,popup > menuitem {
appearance: none !important;
background-color: #fefefc !important;
min-height: 24px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
margin: 0.5px !important;
border-width: thin !important;
border: 1px solid silver !important;
border-radius: 5px !important;
background-repeat: no-repeat !important;
background-position: 10px 3px !important;
padding-left: 40px !important;
}
Alles anzeigen
Bin erst mal offline!
Das kannst du auch entfernen:
Das ist jetzt übrig geblieben, perfekt. ![]()
/*=== Submenü zu "Lesezeichen-Symbolleiste" / für alle drei Bereiche zuständig ====*/
#toggle_PersonalToolbar :is(menuitem[type="radio"][checked="true"] >.menu-iconic-left) {
background-repeat: no-repeat !important;
margin-left: -30px !important;
padding-left: 15px !important;
width: 19px !important;
height: 15px !important;
}
#toggle_PersonalToolbar :is(menuitem[type="radio"][checked="false"] >.menu-iconic-left) {
background-repeat: no-repeat !important;
margin-left: -30px !important;
padding-left: 27px !important;
width: 19px !important;
height: 15px !important;
}
/* aktive Box */
#toggle_PersonalToolbar menuitem[type="radio"][checked="true"] >.menu-iconic-left {
background-image: url("file:///C:/FoxIcons/0126.png") !important;
}
/* inaktive Box */
#toggle_PersonalToolbar menuitem[type="radio"][checked="false"] >.menu-iconic-left {
background: url("file:///C:/FoxIcons/0127.png") no-repeat !important;
}
/* originale Icon ausgeblendet */
#toggle_PersonalToolbar menuitem[type="radio"][checked="true"] > .menu-iconic-left .menu-iconic-icon {
display: none !important; }
#toggle_PersonalToolbar menupopup menuitem hbox.menu-accel-container label.menu-iconic-accel {
display: none !important; }
/* Submenü ** ENDE */
Alles anzeigen
Die Frage ist, ob sich das lohnt für jegliche Icons so zu machen
Nöö, denn was ich jetzt sagen kann, dass es speziell nur für diese mit Checkbox gemacht werden muss. Alles Andere ist mit zwei Zeilen gemacht, bin zwar erst am Anfang, aber das funktioniert.
wenn Du noch etwas Spezielles machen solltest, so lass es uns bitte wissen. ![]()
Teste bitte mal:
Sehr schön, Andreas, damit lässt sich was machen. Danke!
![]()
Hier sieht das mit deinem und meinem Code so aus
Ja, Andreas, so ist es hier auch, aber der Code dafür soll ja verkleinert werden (minimal bis auf zwei Zeilen). wenn ich das mache, so wie in deinem Beispiel im Menü "Hilfe", dann bekomme ich kein Icon mehr angezeigt, egal welche Bezeichnung ich wähle. ![]()
Machbar ist das also alles mit dem ganz kurzen Code.
Ja, aber da gibt es hier auch die ersten Probleme. Beim Menü "Ansicht" hier:
Das bekomme ich nicht gebacken mit der neuen Schreibweise. Hast Du eine Idee, wie das aussehen könnte?
/*=== Submenü zu "Lesezeichen-Symbolleiste" / für alle drei Bereiche zuständig ====*/
/* aktive Box */
#toggle_PersonalToolbar menuitem[type="radio"][checked="true"] >.menu-iconic-left::before {
margin-right: 10px !important;
margin-left: -28px !important;
content: '' !important;
display: block !important;
width: 19px !important;
height: 15px !important;
background: url("file:///C:/FoxIcons/0126.png") no-repeat !important;
background-position: 0px 0px !important;
background-size: 16px 16px !important;
}
/* inaktive Box */
#toggle_PersonalToolbar menuitem[type="radio"][checked="false"] >.menu-iconic-left::before {
margin-right: 10px !important;
margin-left: -19px !important;
content: '' !important;
display: block !important;
width: 19px !important;
height: 15px !important;
background: url("file:///C:/FoxIcons/0127.png") no-repeat !important;
background-repeat: no-repeat !important;
background-position: -1px 0px !important;
background-size: 16px 16px !important; }
/* Text bei aktiver Box verlagert */
#view-menu-popup menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="true"] >.menu-iconic-text,
#toolbar-context-menu menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="true"] >.menu-iconic-text,
#placesContext menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="true"] >.menu-iconic-text {
appearance: none !important;
margin-left: -18px !important;}
/* Text bei inaktiver Box verlagert */
#view-menu-popup menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="false"] >.menu-iconic-text,
#toolbar-context-menu menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="false"] >.menu-iconic-text,
#placesContext menu#toggle_PersonalToolbar menupopup menuitem[type="radio"][checked="false"] >.menu-iconic-text {
appearance: none !important;
margin-left: -4px !important;}
/* originale Icon ausgeblendet */
#toggle_PersonalToolbar menuitem[type="radio"][checked="true"] > .menu-iconic-left .menu-iconic-icon {
display: none !important; }
#toggle_PersonalToolbar menupopup menuitem hbox.menu-accel-container label.menu-iconic-accel {
display: none !important; }
/* Submenü ** ENDE */
Alles anzeigen
Ich bin auch am überlegen, ob ich hier auch alles auf diese kurze Form ändere.
Also, die Arbeit mache ich mir, das hättest Du schon längst anbieten können.
![]()
Es kommt ja wieder Schmuddelwetter, genau passgerecht. ![]()
Es geht auch noch kürzer
Danke auch, da habe ich wenigstens wieder Arbeit. ![]()
kann mir da jemand behilflich sein ?
Versuch mal bitte:
/* Hintergrund der einzelnen Button */
hbox.dialog-button-box button[label="Speichern nach"]{
appearance: none!important;
color: white !important;
background: dodgerblue !important;
border: 1px solid black !important;
border-radius: 7px !important;
padding-left: 4px !important;
padding-right: 4px !important;
padding-bottom: 3px !important;
}
hbox.dialog-button-box button[label="Speichern nach"]:hover {
appearance: none !important;
color: white !important;
background: blue !important;
border: 1px solid red !important;
}
Alles anzeigen
Das Kreuz ist zwar weg wenn ich aber mehrere Tab's offen habe und ich gehen auf einen Tab ist es zu sehen. Sobald ich aber zum linken Tab gehe verschwindet es wieder und ich kann diesen Tab nicht schließen.
Es entspricht zwar nicht Deinen Wünschen, aber versuche mal bitte, eventuell findest Du auch Gefallen daran. Grundsätzlich ist das Kreuz nur bei Hover zu sehen, egal welcher Tab.
/*=== Tabschliessen-Button ** nur zu sehen bei Mouseover ===*/
/* Tab X close buttons ( links 1 / rechts 2 ) */
.tab-close-button {
-moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab .close-icon {
width: 24px !important;
margin: -2px -8px -3px -8px !important;
padding: 5px !important;
fill: #FFF !important;
}
.tabbrowser-tab .close-icon:hover {
fill: #ff0000 !important;
}
.tabbrowser-tab[selected] .close-icon:hover {
background-color: rgba(0, 0, 0, 0.2) !important;
outline: none !important;
visibility: visible !important;
}
.tabbrowser-tab:not([selected]) .close-icon:hover {
background-color: rgba(0, 0, 0, 0.2) !important;
outline: none !important;
visibility: visible !important;
}
.tabbrowser-tab[selected]:not(:hover):not([pinned]) .tab-close-button,
.tabbrowser-tab:not([selected]):not(:hover):not([pinned]) .tab-close-button {
display: -moz-box !important;
visibility: hidden !important;
}
.tabbrowser-tab[selected]:hover:not([pinned]) .tab-close-button,
.tabbrowser-tab:not([selected]):hover:not([pinned]) .tab-close-button {
display: -moz-box !important;
visibility: visible !important;
}
/* close buttons ** ENDE */
Alles anzeigen
Falls es bei anderen Usern auch bei Popup-Menüs zu diesen Schatten kommen sollte, dann hat das mit Windows zu tun.
2002Andreas gab mir den Hinweis dazu (Danke!
), und jetzt sind auch die Schatten weg.
Im Screenshot (roter Kreis), dort den Haken entfernen.
Sieht hier so aus, mit pers. Note oben
![]()
Muss ich hier noch nacharbeiten, wegen aktiver und inaktiver Button. Die stimmen in v110 nicht überein.
aber anpassen wofür , Firefox 110.0 ?
Version 111 und 112, 110 nicht getestet.
Danke auch, und wenn anpassen, warum auf dieses "interessante" Design?
Weil es Spaß an der Freude ist.
![]()
Du hast ja einen ganz eigenen Stil, der laut Bild größer ist (als meiner).
Deswegen hatte ich betont, nach Vorlage von...... ![]()
Die Vorlage von .DeJaVu musste ich wieder anpassen, wer Interesse hat, bediene sich. ![]()
@-moz-document url-prefix(chrome://browser/content/browser.xhtml) {
/* Eigenes Icon für Button */
#navigator-toolbox toolbar#nav-bar.browser-toolbar toolbarbutton#unified-extensions-button.toolbarbutton-1 > .toolbarbutton-icon {
list-style-image: url("file:///C:/FoxIcons/0109.png") !important;
opacity: 0.9 !important;
}
/* Popup-Menü HG und Border */
#unified-extensions-view.cui-widget-panelview{
background-color: gainsboro !important;
border: 4px solid royalblue !important;
padding: 0px 10px 0px 10px !important;
width: 370px !important;
}
/* Scrollbar ausgeblendet */
#unified-extensions-view.cui-widget-panelview vbox.panel-subview-body{
scrollbar-width: none !important;
}
/* grid */
#unified-extensions-area,
.unified-extensions-list {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
}
/* Überschrift "Erweiterungen" */
#unified-extensions-view.cui-widget-panelview vbox.panel-header h1 span {
color: #881111 !important;
font-size: 1.8em !important;
display: flex !important;
justify-content: center !important;
}
/* Zusatzbeschriftungen der Button ausgeblendet */
.unified-extensions-item-contents label.unified-extensions-item-name,
#unified-extensions-area .unified-extensions-item-message-deck .unified-extensions-item-message,
.unified-extensions-list .unified-extensions-item-message-deck {
display: none !important;
}
/* Größe der Icons aller Erw. */
#unified-extensions-area.customization-target .toolbarbutton-1.unified-extensions-item-action-button.subviewbutton.panel-no-padding.webextension-browser-action stack.toolbarbutton-badge-stack image.toolbarbutton-icon,
/* panel .unified-extensions-item[unified-extensions="true"] .webextension-browser-action > .toolbarbutton-badge-stack > .toolbarbutton-icon, */
.unified-extensions-list toolbarbutton .unified-extensions-item-icon {
height: 25px !important;
width: 25px !important;
}
/* Button der aktiven Erw. */
#unified-extensions-panel toolbaritem.unified-extensions-item {
max-width: unset !important;
width: 112px !important;
height: 40px !important;
background-color: grey !important;
margin: 1px !important;
border: 1px solid green !important;
border-radius: 4px !important;
padding: 0 2px !important;
}
/* Button der aktiven Erw. bei Hover HG farbig */
#unified-extensions-panel toolbaritem.unified-extensions-item:hover {
background-color: beige !important;
border: 1px solid coral !important;
}
/* Button der inaktiven Erw. */
.unified-extensions-list .unified-extensions-item {
max-width: unset !important;
width: 107px !important;
height: 40px !important;
background-color: grey !important;
opacity: 0.85 !important;
margin-top: 6px !important;
/* margin: 1px !important; */
border: 1px solid blue !important;
border-radius: 4px !important;
padding: 0 2px !important;
}
/* Button der inaktiven Erw. bei Hover HG farbig */
.unified-extensions-list .unified-extensions-item:hover {
background-color: gold !important;
border: 1px solid coral !important;
}
/* bei Hover grauer HG der Button ausgeblendet */
.unified-extensions-item-action-button.panel-no-padding.webextension-browser-action.subviewbutton:hover{
background-color: transparent !important;
}
.unified-extensions-item-action-button {
overflow: visible !important;
}
/* Icons aktive Erw. */
#unified-extensions-area image.toolbarbutton-icon {
opacity: 1 !important;
margin-left: 2px !important;
padding: 0 !important;
}
/* Icons inaktive Erw. */
.unified-extensions-list image.unified-extensions-item-icon {
opacity: 1 !important;
margin-left: -4px !important;
padding: 0 !important;
}
/* Button mit dem Zahnkranz (Verwalten) / aktive Erw. */
#unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic{
background-color: black !important;
border: 1px solid gainsboro !important;
min-width: 32px !important;
max-width: 32px !important;
max-height: 32px !important;
margin-left: -94px !important;
color: orange !important;
}
/* bei Hover*/
#unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic:hover{
background-color: #D1E2F2 !important;
border: 1px solid brown !important;
min-width: 32px !important;
max-width: 32px !important;
max-height: 32px !important;
margin-left: -94px !important;
}
/* Zahnkranz aktive Erw. bei Hover andere Farbe */
#unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional:hover toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon {
fill: forestgreen !important;
}
/* Button mit dem Zahnkranz (Verwalten) / inaktive Erw. */
.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic{
background-color: black !important;
border: 1px solid gainsboro !important;
min-width: 32px !important;
max-width: 32px !important;
max-height: 32px !important;
margin-left: 17px !important;
color: orange !important;
}
/* bei Hover */
.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic:hover{
background-color: lightyellow !important;
border: 1px solid brown !important;
min-width: 32px !important;
max-width: 32px !important;
max-height: 32px !important;
margin-left: 17px !important;
}
/* Zahnkranz inaktive Erw. bei Hover andere Farbe */
.unified-extensions-item-menu-button:hover .toolbarbutton-icon {
fill: magenta !important;
}
/* Zahnkranz aktive Erw. / Icon */
#unified-extensions-area.customization-target toolbaritem.toolbaritem-combined-buttons.unified-extensions-item.chromeclass-toolbar-additional toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon {
margin-left: -1px !important;
}
/* Zahnkranz inaktive Erw. / Icon */
#unified-extensions-view.cui-widget-panelview vbox.panel-subview-body vbox.unified-extensions-list unified-extensions-item.unified-extensions-item toolbarbutton.unified-extensions-item-menu-button.subviewbutton.subviewbutton-iconic image.toolbarbutton-icon {
margin-left: -1px !important;
}
/* Button unten "Erweiterungen verwalten" */
#unified-extensions-manage-extensions {
background-color: #f0f0db !important;
margin-left: 50px !important;
max-width: 250px !important;
max-height: 30px !important;
min-height: 30px !important;
border: 1px solid grey !important;
border-width: 3px !important;
border-style: double !important;
color: #5511aa !important;
}
/* bei Hover */
#unified-extensions-manage-extensions:hover {
background-color: #D1E2F2 !important;
color: brown !important;
margin-left: 50px !important;
margin-right: 0 !important;
}
/* Text "Erweiterungen verwalten" */
[data-l10n-id="unified-extensions-manage-extensions"] {
color: gainsboro !important;
font-size: 1.4em !important;
font-weight: 600 !important;
padding-left: 0px !important;
display: flex !important;
justify-content: center !important;
}
/* Text "Erweiterungen verwalten" verlagert */
#unified-extensions-manage-extensions.subviewbutton.panel-subview-footer-button.unified-extensions-manage-extensions label.toolbarbutton-text {
margin: -7px 0 0 0 !important;
}
}
Alles anzeigen
Nächste Woche soll es wieder kalt werden, dann hast du Zeit und Muße dazu.
Das wäre es, aber keine Ruhe damit. ![]()
Alles raus, nur noch den betreffenden Code-Schnipsel, und sofern backround dazu kommt, dann ist der Schatten da.
Ich verabschiede mich davon, bringt nichts. ![]()
Aber das habt ihr bestimmt schon ausprobiert.
Danke, für Deine Zuarbeit. ![]()
Das hatte ich in dem Zusammenhang auch schon probiert, aber dadurch verändert sich nur der äußere Abstand, der Schatten bleibt trotzdem.