Hier nun mein Code für den "Addon-Manager"
/*============================= Addon-Manager ================================*/
/* Addons-Verwaltung: Hintergrundfarben */
@-moz-document url-prefix(chrome://mozapps/content/extensions/aboutaddons.html),
url-prefix(about:addons) {
#sidebar {
background: #CDC8B1 !important; /* Hintergrund linke Seite */
}
.main-search,
.sticky-container,
.main-heading,
#content {
background: #EEEED1 !important; /* Hintergrund rechte Seite */
font-size: 15px !important;
} }
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/******** Button (kleine Quadrate) einrichten - farbliche Anpassung ********************/
@-moz-document url-prefix(chrome://mozapps/content/extensions/extensions.xul), url-prefix(about:addons),url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
panel-item[action="toggle-disabled"][data-l10n-id="disable-addon-button"] {
-moz-context-properties: fill !important;
fill: red !important;
}
panel-item[action="toggle-disabled"][data-l10n-id="enable-addon-button"] {
-moz-context-properties: fill !important;
fill: green !important;
}
panel-item[data-l10n-id="remove-addon-button"] {
-moz-context-properties: fill !important;
fill: red !important;
}
panel-item[data-l10n-id="install-update-button"] {
-moz-context-properties: fill !important;
fill: blue !important;
}
panel-item[data-l10n-id="preferences-addon-button"] {
-moz-context-properties: fill !important;
fill: grey !important;
}
panel-item[data-l10n-id="report-addon-button"] {
-moz-context-properties: fill !important;
fill: orange !important;
}
panel-item[data-l10n-id="expand-addon-button"],
panel-item[data-l10n-id="manage-addon-button"] {
-moz-context-properties: fill !important;
fill: blue !important;
}
panel-item[data-l10n-id="ask-to-activate-button"] {
-moz-context-properties: fill !important;
fill: red !important;
}
panel-item[data-l10n-id="always-activate-button"] {
-moz-context-properties: fill !important;
fill: green !important;
}
panel-item[data-l10n-id="never-activate-button"] {
-moz-context-properties: fill !important;
fill: red !important;
} }
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/********* Versionsnummer wird angezeigt ************************************************/
@-moz-document url-prefix(chrome://mozapps/content/extensions/extensions.xul), url-prefix(about:addons),url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
/*restore version number */
div:not([current-view="updates"]) .addon-name-link[title]:not([data-l10n-args])::after,
div:not([current-view="updates"]) .addon-name[title]:not([data-l10n-args])::after {
display: block !important;
content: attr(title) !important;
margin-top: -22px !important;
} }
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/************Button (Felder) auf der rechten Seite **************************************/
@-moz-document url-prefix(chrome://mozapps/content/extensions/extensions.xul), url-prefix(about:addons),url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
html {
--addon-page-options-width: 340px;
}
/* <some> locales require adjustments */
html[lang="de"] {
--addon-page-options-width: 370px;
}
html:-moz-any([lang="ru"],[lang="it"],[lang="fr"],[lang="el"]) {
--addon-page-options-width: 440px;
}
html[lang*="es-"] {
--addon-page-options-width: 460px;
}
/**/
/* Umrandung und Hintergrund der Button rechte Seite */
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):not([badged]),
.addon.card panel-item:not([badged]){
border: 1px solid grey !important;
background: lightyellow !important;
/* border-radius: 50px !important; */
margin-top: -3px !important;
}
/* Umrandung und Hintergrund der Button rechte Seite bei Hover */
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):not([badged]):hover,
.addon.card panel-item:not([badged]):hover{
border: 1px solid red !important;
background: blue !important;
color: white !important;
/* border-radius: 50px !important; */
}
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):not([badged]),
.addon.card panel-item:not([badged]){
border: 1px solid lightgrey !important;
}
addon-list addon-card panel-list * {
background: white !important;
color: black !important;
}
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):hover,
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):active {
border: 1px solid black !important;
}
@supports -moz-bool-pref("browser.in-content.dark-mode") {
@media (prefers-color-scheme: dark) {
addon-list addon-card panel-list *,
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button),
.more-options-menu panel-item {
background: black !important;
color: white !important;
}
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):hover,
addon-list[type="theme"] addon-card button[data-l10n-id="enable-addon-button"]:not(.theme-enable-button):active {
border: 1px solid white !important;
}
} }
:-moz-any(addon-list,panel-list) panel-item{
margin: 0 1px !important;
}
/* reduce size of default buttons */
link:-moz-any([href$="panel-item.css"],[href$="panel-list.css"]) ~ button {
width: unset !important;
padding: 2px 5px !important;
}
/* remove three dots button */
addon-card .more-options-button {
display: none !important;
}
/* remove button icon */
:host([checked]),
panel-item[checked],
:-moz-any(addon-list,panel-list) panel-item {
--icon: unset !important;
}
/* restore buttons */
div.arrow.top + div.list {
display: flex !important;
flex-flow: row wrap !important;
justify-content: flex-start !important;
}
panel-item[action="preferences"] {
order: -1;
}
panel-item[badged] {
border: 1px solid Highlight !important;
}
panel-item[badged]::after,
:host([badged]) button::after,
link:-moz-any([href$="panel-item.css"],[href$="panel-list.css"]) ~ button::after,
:-moz-any(addon-options,plugin-options) button::after {
display: none !important;
content: unset !important;
}
addon-page-options panel-list {
min-width: unset !important;
width: auto !important;
max-width: var(--addon-page-options-width) !important;
z-index: 1000 !important;
}
addon-page-options panel-list panel-item {
min-width: calc(var(--addon-page-options-width) - 20px) !important;
width: 320px !important;
}
.sticky-container {
z-index: 1000 !important;
}
link:-moz-any([href$="panel-item.css"],[href$="panel-list.css"]) ~ button label[accesskey] {
padding-inline-start: 20px !important;
padding-top: 3px !important;
padding-bottom: 3px !important;
min-width: calc(var(--addon-page-options-width) - 10px) !important;
width: calc(var(--addon-page-options-width) - 10px) !important;
}
addon-page-options panel-list panel-item[accesskey][checked] {
background: url("chrome://global/skin/icons/check.svg") 5px no-repeat !important;
}
addon-card panel-list {
position: relative !important;
display: flex !important;
overflow: hidden !important;
background: unset !important;
border: unset !important;
box-shadow: unset !important;
min-width: unset !important;
width: unset !important;
float: right !important;
right: 36px !important;
}
addon-card panel-list {
margin-top: -48px !important;
}
addon-card .addon.card .theme-enable-button {
-moz-appearance: none !important;
min-width: 20px !important;
width: 20px !important;
max-width: 20px !important;
height: 20px !important;
font-size: 0 !important;
border: 1px solid !important;
border-top: 3px solid !important;
-moz-margin-end: 1px !important;
opacity: 0.9 !important;
}
addon-card .addon.card .theme-enable-button:hover {
cursor: pointer !important;
opacity: 1.0 !important;
filter: brightness(2.00) !important;
}
addon-card .addon.card[active="true"] .theme-enable-button {
background: Highlight url("chrome://global/skin/icons/check.svg") 2px no-repeat !important;
}
addon-card:hover .addon.card[active="true"] .theme-enable-button {
background: red url("chrome://browser/skin/zoom-out.svg") 2px no-repeat !important;
}
addon-card:hover .addon.card[active="false"] .theme-enable-button {
background: green url("chrome://global/skin/icons/check.svg") 2px no-repeat !important;
}
addon-card .card-contents {
display: block !important;
height: 40px !important;
}
addon-card .card-contents .addon-description {
display: block !important;
mask-image: linear-gradient(to left, transparent, black 10px) !important;
}
addon-card .addon.card .theme-enable-button,
input[type="checkbox"].toggle-button {
-moz-margin-end: 8px !important;
}
.card-contents input[type="checkbox"].toggle-button {
-moz-margin-end: 0px !important;
}
addon-card > .addon.card,
addon-card > .addon.card * {
overflow: hidden !important;
} }
/***************** Container anpassen **************************************************/
@-moz-document url-prefix(chrome://mozapps/content/extensions/aboutaddons.html),
url-prefix(chrome://mozapps/content/extensions/extensions.xul), url-prefix(about:addons) {
/* Container in der Breite anpassen*/
message-bar-stacks + #main:not([class="site-main"]) div[current-view="list"] {
max-width: 100% !important;
}
/* Hintergrund der Container bei Hover andere Farbe */
addon-card:not([expanded="true"]) .addon.card:hover {
background: #76ee00 !important;
}
/* Abstand zwischen den Containern */
addon-card .addon {
margin: 7px !important;
}
/* Umrandung der Container bei Hover breiter Rand und andere Farbe */
:root {
--card-outline-color: DarkOrange !important;
}
/* Hintergrund der Container mit anderer Farbe */
addon-card:not([expanded="true"]) .addon.card {
background: #F1F7FC !important; /* Hintergrundfarbe */
border: 2px solid grey !important; /* Umrandung */
border-radius: 15px !important; /* Ecken abgerundet */
width: 1200px !important; /* Länge der Container */
max-height: 120px !important; /* Höhe der Container bei Themes */
} }
/****************** sonstige Anpassungen ***************************/
/* unter Themes die Grafik anpassen */
.card-heading-image {
min-width: 800px !important; /* Länge der Grafik */
height: 80px !important; /* Höhe der Grafik */
margin-left: -4px !important; /* Abstand vom linken Rand */
margin-top: -6px !important; /* Abstand vom oberen Rand */
}
/* blendet den Text für privates Browsing ein */
.addon-badge-private-browsing-allowed::before {
content: "(In privaten Fenstern erlaubt)" !important;
margin-left: 10px !important; /* Entfernung nach rechts */
}
.addon-badge-private-browsing-allowed {
min-width: 430px !important; /* lila Icon Entfernung nach rechts */
}
/* unter Verwalten das sich öffnende Menü verbreitern */
@-moz-document url-prefix(chrome://mozapps/content/extensions/aboutaddons.html),
url-prefix(about:addons) {
html body div#full div#content div#main div addon-card div.card.addon{
min-width: 1100px !important; /* Breite in px */
} }
/* Unter Plugins - Nachfragen ob aktiviert werden soll - entfernt */
.card > plugin-options:nth-child(4) > panel-list:nth-child(1) > panel-item:nth-child(1),
#main > div:nth-child(1) > addon-list:nth-child(1) > section:nth-child(2) > addon-card:nth-child(2) > div:nth-child(1) > plugin-options:nth-child(4) > panel-list:nth-child(1) > panel-item:nth-child(1),
#main > div:nth-child(1) > addon-list:nth-child(1) > section:nth-child(2) > addon-card:nth-child(3) > div:nth-child(1) > plugin-options:nth-child(4) > panel-list:nth-child(1) > panel-item:nth-child(1) {
display: none !important;
}
/* fortlaufende Nummerierung installierter Erweiterungen, Themes, usw. */
body {
counter-reset: section;
}
#main > div:nth-child(1) > addon-list:nth-child(1) > section:nth-child(2) > addon-card:nth-child(n+2) > div:nth-child(1) > div:nth-child(2)::before,
#main > div:nth-child(1) > addon-list:nth-child(1) > section:nth-child(3) > addon-card:nth-child(n+2) > div:nth-child(1) > div:nth-child(2)::before {
color: red !important;
font-weight: bold !important;
counter-increment: section;
content: counter(section, decimal-leading-zero)".) ";
padding-right: 20px !important;
margin-top: -2px!important; /* Lage im Container */
margin-left: 5px !important; /* Abstand vom linken Rand */
}
/* Größenänderung der Button rechte Seite */
link:-moz-any([href$="panel-item.css"],[href$="panel-list.css"]) ~ button {
width: unset !important;
padding: 4px 25px !important; /* 4px ist die Höhe und 25px die Länge der rechten Button */
border: 1px solid grey !important; /* Umrandung */
}
/* Länge der Container unter Empfehlungen */
.card {
width: 800px!important; /* Länge */
background: white !important; /* Hintergrund */
}
/* Button mit dem Zahnrad */
.page-options-menu > .more-options-button {
fill: red !important; /* rotes Zahnrad */
border: 1px solid grey !important; /* farbige Umrandung */
border-radius: 15px !important; /* Abrundung */
width: 60px !important; /* Länge des Button */
height: 30px ! important; /* Höhe des Button */
box-shadow: inset 0 0 2px 2px grey; /* innerer Schatten */
}
/* Button oben mit dem Zahnrad bei Hover */
.page-options-menu > .more-options-button:hover {
fill: lime !important; /* Farbe des Zahnrades */
}
/* Aussehen des Menü hinter dem Zahnrad */
link:-moz-any([href$="panel-item.css"],[href$="panel-list.css"]) ~ button label[accesskey] {
margin-left: 6% ! important;
min-width: 350px !important;
width: 375px !important; /* Länge der einzelnen Felder */
background: white ! important; /* Farbe des Hintergrundes */
}
.sticky-container {
z-index: 1000 !important;
}
addon-page-options panel-list panel-item {
width: 425px !important; /* Länge der aktivierten Menü-Leiste */
background: none ! important;
}
addon-page-options panel-list panel-item:hover {
width: 425px !important;
background: lime ! important;
color: red !important;
}
addon-page-options panel-list {
min-width: unset !important;
width: auto !important;
max-width: 430px !important; /* Ausdehnung der Felder nach rechts */
background: #f8f8ff ! important; /* farbiger Hintergrund des Feldes */
padding-left: 8px !important; /* Ausdehnung nach links */
padding-right: 3px !important; /* Ausdehnung nach rechts */
z-index: 1000 !important;
}
/* Hintergrund der Box Updates automatisch aktualisieren */
addon-page-options panel-list panel-item[accesskey][checked] {
background: gold !important;
}
/* Zurückbutton bei geöffnetem Menü Einstellung/Verwalten */
.back-button {
background-color: silver !important;/*Hintergrundfarbe vom Button*/
width: 60px !important;
border-radius: 60px !important;/*Rundung vom Button*/
box-shadow: inset 0 0 3px 3px #888;
}
.back-button:hover {
color: white !important;
background-color: dodgerblue !important;
border-radius: 60px !important;
box-shadow: inset 0 0 3px 3px #888;
}
/* Aktiviert/Deaktiviert - Farbe */
.list-section-heading[data-l10n-id="extension-enabled-heading"],
.list-section-heading[data-l10n-id="theme-enabled-heading"],
.list-section-heading[data-l10n-id="plugin-enabled-heading"],
.list-section-heading[data-l10n-id="dictionary-enabled-heading"] {
font-weight: bold !important;
color: forestgreen !important;
text-indent: 15px;
}
.list-section-heading[data-l10n-id="extension-disabled-heading"],
.list-section-heading[data-l10n-id="theme-disabled-heading"],
.list-section-heading[data-l10n-id="plugin-disabled-heading"],
.list-section-heading[data-l10n-id="dictionary-disabled-heading"] {
font-weight: bold !important;
color: red !important;
text-indent: 15px;
}
/* Aktiviert/Deaktiviert - Farbe - ENDE */
Alles anzeigen
Mit Notepad++ geöffnet:
in Zeile 311 hinzugefügt "Container in der Breite anpassen"
in Zeile 313 >> obigen Code eingefügt - geändert z.B. auf 100 %
Bei Aufruf tut sich aber nichts! 