Beiträge von FuchsFan

FuchsFan

Zitat von milupo

nach unten schiebst, haben wir wieder das Intereferenz-Problem

Gut, das will ich dir glauben. So , dann gibt es für mich nur die eine Möglichkeit, für den Code-Teil lege ich eine separate css mit @import an. So ist der Teil aus dem Code raus, und kann nicht mehr stören. Frage noch, trotzdem muss am Schluss dann wieder eine zweite Geschweifte sein?

Nun kam mir noch eine Idee, ich habe die Klammer in der Mitte raus genommen, und auch dann funktioniert es wieder wunderbar mit dem besagtem Code am Schluss, dazu die zweite Klammer. Frage bitte nicht warum?

Die Button auf den Seiten , z.B hier im Forum werden richtig angezeigt, rot original, schwarz bei Mauskontakt.

FuchsFan

Zitat von milupo

Probiere mal diesen korrigierten Code:

Wie gehabt, linke Seite keine Wirkung.

Jetzt habe ich diesen Block vom Anfang an das Ende gesetzt, ihn so eingefügt:

CSS

/**************** Versionsnummer des Addons wird angezeigt *************************************/
@-moz-document  url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
    
    /*restore version number */
    div:not([current-view="updates"]) .addon-name-link[title]::after,
    div:not([current-view="updates"]) .addon-name[title]::after {
      display: block !important;
      content: attr(title) !important;
      margin-top: -22px !important;
    }
}

Alles anzeigen

Und dann unter dem vorerst letzten Code-Teil auch die zweite Klammer gesetzt, dann wird alles sauber angezeigt.

So wie von dir gezeigt sieht es dann aus:

CSS

/**************** fortlaufende Nummerierung installierten Erweiterungen *******************/
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 {
    font-size:18px!important;  
    color: red !important;
    font-weight: bold !important;
    counter-increment: section;                 
    content: counter(section)".)  ";
    margin-left: -8px !important;
    padding-right: 8px !important; 
    margin-top:4px!important;
    } 
  
addon-list addon-card > .addon.card {
    width: 700px;
    }
}

Alles anzeigen

FuchsFan

Zitat von milupo

aber in Zeile 244 einfgefügt

Ja, milupo, bis dahin, dann funktionieren auch die Button auf der linken Seite. Ein Block tiefer nur noch unvollständig, und am Schluss dann auf der linken Seite überhaupt nichts mehr. Das ist ja der Haken, was ist da los?

FuchsFan

Achte mal bitte darauf, ich habe die Zweite Klammer im mittleren Teil platziert, dann funktioniert alles noch.

CSS

/************************ Ersten beiden Einträge aus dem alten Code *******************/

/*** Umrandung bei Hover breiter Rand und andere Farbe ****/ 
:root {
    --card-outline-color: DarkOrange !important;
    }

/**************** Versionsnummer des Addons wird angezeigt *************************************/
@-moz-document  url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
    
    /*restore version number */
    div:not([current-view="updates"]) .addon-name-link[title]::after,
    div:not([current-view="updates"]) .addon-name[title]::after {
      display: block !important;
      content: attr(title) !important;
      margin-top: -22px !important;
    }



/************************************************************************************************************************/
/*****  Code neu von hier: https://www.camp-firefox.de/forum/thema/128571-ansicht-erweiterungen-verwalten/?pageNo=1 *****/

addon-card:not([expanded]) .card-contents {
    white-space: normal !important;
    }

.addon-description {
    max-width: 1150px !important; /** Schrift in den Containern/ erlaubte Ausdehnung nach rechts in Pixel **/
    }
    
button:hover {    
    cursor: pointer !important;
    }

/************************************************************************************************************************************/
/*********************************** Ausrichtung der Button auf der rechten Seite ***************************************************/

/**** Button  Deaktivieren ****/    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] { 
    margin-left: -10px !important;
    padding-right: 20px !important;
    background: gainsboro !important; /* Hintergrundfarbe */
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"]:hover {
    background: magenta !important; /* Farbe bei Mauskontakt */
    color: white !important; /* Schriftfarbe bei Mauskontakt */
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] {
    position: absolute !important;
    top: 16px !important; /* Abstand vom oberen Rand */
    left: 780px !important; /* Entfernung zum rechten Rand hin */
    box-shadow: inset 0 0 4px 4px #888; /* innerer Schatten im Button/ 4px die Breite/ #888 die Farbe */
    }    

/**** Button  Entfernen ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"] {  
    margin-left: 8px !important;
    padding-right: 13px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"]:hover {
    background: red !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="remove"] {
    position: absolute !important;
    top: 16px !important;
    left: 950px !important;
    box-shadow: inset 0 0 4px 4px #888;
    }    

/**** Button  Einstellungen ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"] {  
    margin-left: 32px !important;
    padding-right: 18px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"]:hover {
    background: blue !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="preferences"] {
    position: absolute !important;
    top: 16px !important;
    left: 550px !important;
    box-shadow: inset 0 0 4px 4px #888; 
    }    

/**** Button  Aktualisieren ****/    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="install-update"] {
    margin-left: 60px !important;
    padding-right: 17px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }
    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="install-update"]:hover {
    background: lime !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="install-update"] {
    position: absolute !important;
    top: 72px !important;
    left: 900px !important;
    box-shadow: inset 0 0 4px 4px #888;
    }    
    
    

/**** Button  Verwalten ausgeblendet ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="expand"] {  
    display: none !important;
    }

/*** Button Melden wird ausgeblendet ****/
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="report"] {
    display: none !important;
    }
    
/*** hiermit wird der Hintergrund bei Klick auf das Zahnrad-Symbol ausgeblendet ***/
button:-moz-focusring {
    box-shadow: none !important;
    outline: 0px dotted !important;
    outline-offset: 0px !important;
    }    

/*** hiermit wird der Hintergrund bei Klick auf Buttons auf der rechten Seite ausgeblendet ***/
button.more-options-button:focus, button.more-options-button:enabled:hover { /* neuer Code-Teil von milupo */
    background-color: transparent !important;
    border: none !important;
    }

/*** hiermit werden unter Themes die Grafiken ausgeblendet ****/
.card-heading-image {
    display: none !important;
    }

/******** Suchfeld für Erweiterungen wird ausgeblendet *****/
#header-search,#search-label {
    display: none !important;
    }

/*** Text Suche nach Erweiterungen wird ausgeblendet ******/
#search-label {
    display: none !important;
    }

#header-search input.textbox-input::placeholder {
    color: transparent !important;
    }

/***********************************************************************************************/
/****************** 70er Nightly Addon Manager by @.DeJaVu *************************************/

addon-list addon-card > .addon.card {
    width: 94vw  !important;  /* Ausdehnung der Container (weiße Boxen) zum rechten Rand hin */
    margin-bottom: 5px !important;  /* Abstand zwischen den Containern */
    height: 65px !important;  /* Höhe der Container */
    border: 1px solid grey !important; /* Umrandung der Container mit Farbauswahl */
    }

addon-list section addon-card,
addon-list section addon-card .card.addon {
    cursor: default !important;
    }

addon-list section addon-card .card.addon .addon-card-collapsed {
    cursor: pointer !important;
    }

#addons-page #heading hbox.heading-inner #heading-name.header-name {
    -moz-box-ordinal-group: 2 !important;
    padding-left: 10px !important;
    }

.addon-badge-private-browsing-allowed {
    width: 230px !important;
    background-position: left !important;
    }

.addon-badge-private-browsing-allowed::after {
    content: "(In privaten Fenstern erlaubt)" !important;
    margin-left: 20px !important;
    } 

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu {
    position: absolute !important;
    margin: 0 !important;
    margin-inline-end: 0 !important;
    left: 520px !important;
    }

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options {
    margin-left: 0 !important;
    margin-inline-end: 0 !important;
    }

/*** die drei Punkte werden im Container-Feld ausgeblendet *****/
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu button.more-options-button.ghost-button {
    display: none !important;
    }

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list {
    display: block !important;
    visibility: visible !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    --in-content-button-background: none !important;
    top: -25px !important;
    }

.arrow, .arrow.top, .arrow.bottom,
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item-separator {
    display: none !important;
    }

.message-bar {
    display:none;
     }

/* Hintergrundfarbe auf allen Seiten hellgrau*/
#headered-views,
#category-box,
.App,
.DiscoPane,
.Footer {
    background:lightgrey!important;
    }
    
}    

/* Die großen Button auf der linken Seite */
#categories > .category,
#preferencesButton,
#helpButton,
#addonsButton {
    margin-left:1px!important; /*Abstand der Button zum linken Rand*/
    }

#categories > .category:not([disabled]){
    background-color: gainsboro !important;/*Hintergrundfarbe vom Button*/
    margin-top:1px!important; /*Abstand zum Button darüber*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 5px 5px #888;
    }
    

/*** Aktiver Button rot, Schrift weiß ****/
#categories > .category[selected]{
    color:white!important;
    background-color: red !important;
    margin-top:1px!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 5px 5px #888; 
    }

/* Hintergrund der Button blau, Schrift weiß bei hover mit der Maus*/
#categories > .category:hover,
#preferencesButton:hover,
#helpButton:hover,
#addonsButton:hover{
    color:white!important;
    background-color: blue!important;
    margin-top:1px!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 5px 5px #888; 
    }
    
    
/* Die Breite der Felder unter Add-ons entdecken im rechten Fensterteil */
.App,           
.DiscoPane,
.Footer{
    max-width: initial !important;
    }
    
/* Kleiner Pfeil nach unten in einem Button, bei hover weiß */
.addon-control:hover .menulist-dropmarker{
    fill:white!important;
    }
    
/* Button oben mit dem Zahnrad */
#header-utils-btn{
    background-color: silver !important;/*Hintergrundfarbe vom Button*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }

/* Button oben mit dem Zahnrad bei hover blau */
#header-utils-btn:hover{
    color:white!important;
    background-color: lime!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
/* Zurückbutton bei geöffneter Einstellung einer Erweiterung */
#go-back{
    background-color: silver !important;/*Hintergrundfarbe vom Button*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
#go-back:hover{
    color:white!important;
    background-color: lime!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 3px 3px #888;
    }
    
/* Kleiner Pfeil nach unten in einem Button unter Plugins, bei hover weiß */
#detail-state-menulist:hover .menulist-dropmarker{
    fill:white!important;
    }
    

/* Button Nach Updates suchen */
#updates-view.view-pane vbox#updates-list-empty.alert-container vbox.alert button{
    background-color: silver !important;
    border-radius:60px!important;
    }
    
#updates-view.view-pane vbox#updates-list-empty.alert-container vbox.alert button:hover{
    color:white!important;
    background-color: blue!important;
    border-radius:60px!important;
    }
    
/**************** fortlaufende Nummerierung installierten Erweiterungen *******************/
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 {
    font-size:18px!important;  
    color: red !important;
    font-weight: bold !important;
    counter-increment: section;                 
    content: counter(section)".)  ";
    margin-left: -8px !important;
    padding-right: 8px !important; 
    margin-top:4px!important;
    } 
  
addon-list addon-card > .addon.card {
    width: 700px;
    }

Alles anzeigen

FuchsFan

Zitat von milupo

eine davon muss dort weg und am Ende des gesamten Codes eingefügt werden

Nehme ich die Zweite oben weg , dein Bild in #193 Zeile 11, und füge ganz am Schluss die zweite geschweifte ein, dann funktionieren die Button auf der linken Seite nicht mehr.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

vielleicht schiebt er mal ein Stück Kuchen durch die Leitung.

Hast du einen 3D-Drucker? Kirschtorte, oder was möchtest du?

Grüße

FuchsFan

FuchsFan

Zitat von 2002Andreas

Dann muss er zur Strafe 1x um den Block laufen

Das mache ich ganz locker

Den Code habe ich irgendwann einmal hier aus dem Forum so übernommen, weiß aber nicht mehr woher.

So, dann bitte den berichtigten hier einstellen, dass alle ihn neu einfügen (ersetzen) können.

Das war der Code, ich habe nur die Überschriften eingefügt.

CSS

/**************** verbreitert unter Addons die Einträge zum rechten Rand **********************/

addon-list addon-card > .addon.card,
addon-card[expanded] >.addon.card
{
    width: 90vw !important;
}

:root {
    --card-outline-color: LimeGreen !important;
}

/**************** Versionsnummer des Addons wird angezeigt *************************************/

@-moz-document  url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
    
    /*restore version number */
    div:not([current-view="updates"]) .addon-name-link[title]::after,
    div:not([current-view="updates"]) .addon-name[title]::after {
      display: block !important;
      content: attr(title) !important;
      margin-top: -22px !important;
    }

}

Alles anzeigen

Grüße

FuchsFan

FuchsFan

Zitat von Boersenfeger

Falls Bedarf an einem an deinem Code angelegten Stil besteht...

Danke für den Hinweis, ich habe schon vorbei geschaut. Ich hoffe ja auch, dass da früher oder später unsere Spezialisten sich dazu was einfallen lassen. Bis dahin haben wir ja nooooch viel Zeit, im 71 funktioniert es ja noch. Für dich schon nicht mehr so gut, aber ich beobachte im Nightly auch alle Änderungen.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

nur auf den Add-on-Manager beschränken müsste

Ja, nun wissen wir, dass es nicht so ist. Dazu dann noch eine Frage, der angesprochene "Antworten"-Button ist rot, bei Mauskontakt wird er schwarz, klickt man drauf wird er rot mit schwarzem Rand (geht alles sehr schnell). Wird das Letzte jetzt auch durch den Code beeinflusst, und ist der schwarze Hintergrund so vorgesehen? Die Leiste oben ist ja auch schwarz.

Grüße

FuchsFan

FuchsFan

Zitat von 2002Andreas

Aber gerne doch, er ist allerdings nicht kompl. von mir erstellt.

Danke, Andreas, mich interessieren darin nur einige Code-Schnipsel, möchte wieder etwas dazulernen.

Grüße

FuchsFan

FuchsFan

@2002Andreas

Hallo Andreas!

Wärst du so freundlich und stellst mir mal bitte den Code zur Verfügung, der zu dem Bild aus #170 gehört.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

spielt hier eigentlich keine Rolle, denn es handelt sich hier ja um Webseiten

Das ist verständlich, milupo. Mir ist es erst bewusst geworden, nachdem du den Hinweis dazu gegeben hast. Als Beispiel dazu dieses Forum. Immer wenn ich einen Beitrag schrieb, und dann unten mit der Maus über "Antworten" (Feld ist ja rot) kam, so konnte ich nur noch die Richtung halten und drauf klicken, vom Button war nämlich nichts mehr zu sehen.

Wenn ich jetzt drüberfahre , so wird der Button schwarz (Schrift bleibt weiß). Wie gesagt, ich hatte der Sache keine Bedeutung beigemessen, nur gewundert hat es mich, weil es auch auf anderen Seiten vorkam.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

Da wirst du wohl keinen Erfolg haben

Na, und ob ich das kann. Also es ist tatsächlich so, wie du es beschrieben hast, denn ich habe im 71 Beta das Phänomen beobachten können.

Im 70 mit deinem Code ist es dann nicht mehr aufgetreten. Prima, das hast du sehr gut erkannt, und danke für den neuen Code dazu.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

more-options-button. Die habe ich der Zeile 80 hinzugefügt und das Problem mit der anderen Seite war behoben.

Hallo milupo!

Ich kann das Problem jetzt nicht nachvollziehen, weil es bisher keine gab. Ich habe aber mal den Code von dir übernommen, es läuft weiter ohne Schwierigkeiten. Das werde ich mal beobachten.

Grüße

FuchsFan

FuchsFan

Zitat von milupo

Leute, es verwirrt m. E. Barbara nur, wenn ihr hier eure eigenen Codes zeigt.

Hallo milupo, du hast ja recht, deshalb habe ich ihr auch ihren eigenen erstellten Code mit der Berichtigung rein gestellt. Habe ihn im 71er getestet, läuft wieder. Siehe Beitrag #152.

Grüße

FuchsFan

FuchsFan

Der Code funktioniert im Nightly sowieso nicht mehr. Und wenn , dann wäre es der Button "Verwalten" auf der rechten Seite im Container.

Für alles andere i.M. nichts Neues nach dem letzten Update.

FuchsFan

Oder die Code-Blöcke aus Beitrag #150 kopieren und überschreiben lassen, auch dann isi alles wie gehabt.

Grüße

FuchsFan

Edit:

Oder den Code nehmen (ist von dir) , da habe ich es schon eingefügt.

CSS

/*AddonMenu Text statt Punkte*/

/*** Umrandung bei Hover breiter Rand und andere Farbe ****/ 
:root {
    --card-outline-color: DarkOrange !important;
    }

/*https://www.camp-firefox.de/forum/thema/128571-ansicht-erweiterungen-verwalten/?pageNo=1*/

addon-card:not([expanded]) .card-contents {
    white-space: normal !important;
    }

.addon-description {
    max-width: 1150px !important;
    }
    
button:hover {    
    cursor: pointer !important;
    }
    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] { /* Deaktivieren */
    margin-left: -10px !important;
    padding-right: 20px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"]:hover {
    background: magenta !important;
    color: white !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"] {  /* Entfernen */
    margin-left: 8px !important;
    padding-right: 13px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"]:hover {
    background: red !important;
    color: white !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"] {  /* Einstellungen */
    margin-left: 32px !important;
    padding-right: 18px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"]:hover {
    background: blue !important;
    color: white !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="expand"] {  /* Verwalten */
    margin-left: 60px !important;
    padding-right: 20px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }
    

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="expand"]:hover {
    background: green !important;
    color: white !important;
    }
    
    
/*** hiermit wird der Hintergrund bei Klick auf das Zahnrad-Symbol ausgeblendet ***/
button:-moz-focusring {
    box-shadow: none !important;
    outline: 0px dotted !important;
    outline-offset: 0px !important;
}    

/*** hiermit wird der Hintergrund bei Klick auf Buttons auf der rechten Seite ausgeblendet ***/
button:focus, button:enabled:hover {
    background-color: transparent !important;
    border: none !important;
}

/*** hiermit werden unter Themes die Grafiken ausgeblendet ****/
.card-heading-image {
    display: none !important;
}

/***********************************************************************************************/
/* Addon Manager by @.DeJaVu */

addon-list addon-card > .addon.card
{
    width: 94vw  !important;  /* bringt die Container bis zum rechten Rand */
    margin-bottom: 5px !important;
    height: 65px !important; /* Höhe der Container */
    border: 1px solid yellow !important; /* Umrandung */
    
}

addon-list section addon-card,
addon-list section addon-card .card.addon
{
    cursor: default !important;
}

addon-list section addon-card .card.addon .addon-card-collapsed
{
    cursor: pointer !important;
}

#addons-page #heading hbox.heading-inner #heading-name.header-name
{
    -moz-box-ordinal-group: 2 !important;
    padding-left: 10px !important;
}

.addon-badge-private-browsing-allowed {
    width: 230px !important;
    background-position: left !important;
}
.addon-badge-private-browsing-allowed::after
{
    content: "(In privaten Fenstern erlaubt)" !important;
    margin-left: 20px !important;
    
} 

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu
{
    position: absolute !important;
    margin: 0 !important;
    margin-inline-end: 0 !important;
    left: 120px !important;
    
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options
{
    margin-left: 0 !important;
    margin-inline-end: 0 !important;
}

/*** die drei Punkte werden im Container-Feld ausgeblendet *****/
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu button.more-options-button.ghost-button
{
    display: none !important;
    
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list
{
    display: block !important;
    visibility: visible !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    --in-content-button-background: none !important;
    top: -25px !important;
    
}

.arrow, .arrow.top, .arrow.bottom,
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item-separator
{
    display: none !important;
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] /* Deaktivieren */
{
    position: absolute !important;
    top: 16px !important;
    left: 565px !important; /* Lage des Button Deaktivieren in Pixel vom linken Rand */
    box-shadow: inset 0 0 4px 4px #888;
    }

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="remove"] /* Entfernen */
{
    position: absolute !important;
    top: 16px !important;
    left: 700px !important; /* Lage des Button Entfernen in Pixel vom linken Rand */
    box-shadow: inset 0 0 4px 4px #888;
}


addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="preferences"] /* Einstellungen */
{
    position: absolute !important;
    top: 16px !important;
    left: 800px !important; /* Lage des Button Einstellungen in Pixel vom linken Rand */
    box-shadow: inset 0 0 4px 4px #888; 
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="report"]
{
    display: none !important;
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="expand"] /* Verwalten */
{
    position: absolute !important;
    top: 16px !important;
    left: 925px !important; /* Lage des Button Verwalten in Pixel vom linken Rand */
    box-shadow: inset 0 0 4px 4px #888; 
}


.message-bar{
    display:none;
}


/* Hintergrundfarbe auf allen Seiten hellgrau*/
#headered-views,
#category-box,
.App,
.DiscoPane,
.Footer{
    background: lightgrey !important;
    }

/* Die großen Button auf der linken Seite */

#categories > .category,

#preferencesButton,

#helpButton,

#addonsButton{

margin-left:1px!important; /*Abstand der Button zum linken Rand*/

}


#categories > .category:not([disabled]){

background-color: gainsboro !important;/*Hintergrundfarbe vom Button*/

margin-top:1px!important; /*Abstand zum Button darüber*/

border-radius:60px!important;/*Rundung vom Button*/

box-shadow: inset 0 0 5px 5px #888;

}



/*** Aktiver Button rot, Schrift weiß ****/

#categories > .category[selected]{

color:white!important;

background-color: red !important;

margin-top:1px!important;

border-radius:60px!important;

box-shadow: inset 0 0 5px 5px #888;

}


/* Hintergrund der Button blau, Schrift weiß bei hover mit der Maus*/

#categories > .category:hover,

#preferencesButton:hover,

#helpButton:hover,

#addonsButton:hover{

color:white!important;

background-color: blue!important;

margin-top:1px!important;

border-radius:60px!important;

box-shadow: inset 0 0 5px 5px #888;

}
    
    
/* Die Breite der Felder unter Add-ons entdecken im rechten Fensterteil */
.App,           
.DiscoPane,
.Footer{
    max-width: initial !important;
    }
    
/* Kleiner Pfeil nach unten in einem Button, bei hover weiß */
.addon-control: hover .menulist-dropmarker{
    fill: white !important;
    }
    
/* Button oben mit dem Zahnrad */
#header-utils-btn{
    background-color: cornflowerblue !important; /*Hintergrundfarbe vom Button*/
    border-radius: 60px !important; /*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }

/* Button oben mit dem Zahnrad bei hover blau */
#header-utils-btn: hover{
    color: white ! important;
    background-color: lime !important;
    border-radius: 60px !important;
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
/* Zurückbutton bei geöffneter Einstellung einer Erweiterung */
#go-back{
    background-color: cornflowerblue !important; /*Hintergrundfarbe vom Button*/
    border-radius: 60px !important; /*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
#go-back:hover{
    color: white !important;
    background-color: lime !important;
    border-radius: 60px !important;
    box-shadow: inset 0 0 3px 3px #888;
    }
    
/* Kleiner Pfeil nach unten in einem Button unter Plugins, bei hover weiß */
#detail-state-menulist: hover .menulist-dropmarker{
    fill: white !important;
    }

Alles anzeigen

FuchsFan

Hallo!

Das dürfte es sein:

Spoiler anzeigen

/* Die großen Button auf der linken Seite */

#categories > .category,

#preferencesButton,

#helpButton,

#addonsButton{

margin-left:1px!important; /*Abstand der Button zum linken Rand*/

}

#categories > .category:not([disabled]){

background-color: gainsboro !important;/*Hintergrundfarbe vom Button*/

margin-top:1px!important; /*Abstand zum Button darüber*/

border-radius:60px!important;/*Rundung vom Button*/

box-shadow: inset 0 0 5px 5px #888;

}

/*** Aktiver Button rot, Schrift weiß ****/

#categories > .category[selected]{

color:white!important;

background-color: red !important;

margin-top:1px!important;

border-radius:60px!important;

box-shadow: inset 0 0 5px 5px #888;

}

/* Hintergrund der Button blau, Schrift weiß bei hover mit der Maus*/

#categories > .category:hover,

#preferencesButton:hover,

#helpButton:hover,

#addonsButton:hover{

color:white!important;

background-color: blue!important;

margin-top:1px!important;

border-radius:60px!important;

box-shadow: inset 0 0 5px 5px #888;

}

Grüße

FuchsFan

FuchsFan

Zitat von BarbaraZ-

Hast gut gemacht und verdienst ein * Sternchen.

Herzlichen Dank, ich verneige mich.

Grüße

FuchsFan

FuchsFan

Unser Mitstreiter @Büssen hat mich zu dem Code auf eine Idee gebracht ( nach seinem Bild zu urteilen hat er diese schon umgesetzt). Wieso brauche ich den Button "Verwalten" ? Überhaupt nicht, weil ein einfacher Linksklick in das Container-Feld die gleiche Aufgabe erfüllt. Außerdem , um alles etwas geordneter darzustellen, habe ich den anderen Button neue Positionen zugewiesen. Entfernen ganz rechts, links daneben Deaktivieren/Aktivieren,und davon links dann Einstellungen. Warum das denn? Weil in allen Rubriken (Erw., Themes,Wörterbücher, usw.) immer Entfernen und Deaktivieren vorkommt, bei Einstellungen nicht. Nach meiner Meinung (fragt eh keiner nach) sieht die Sache so kompakter aus. Für 1920x1080 (volle Bildschirmbreite) ist der folgende Code vorbereitet.

CSS

/************************ Ersten beiden Einträge aus dem alten Code *******************/

/*** Umrandung bei Hover breiter Rand und andere Farbe ****/ 
:root {
    --card-outline-color: DarkOrange !important;
    }

/**************** Versionsnummer des Addons wird angezeigt *************************************/
@-moz-document  url-prefix(chrome://mozapps/content/extensions/aboutaddons.html) {
    
    /*restore version number */
    div:not([current-view="updates"]) .addon-name-link[title]::after,
    div:not([current-view="updates"]) .addon-name[title]::after {
      display: block !important;
      content: attr(title) !important;
      margin-top: -22px !important;
    }

}    

/************************************************************************************************************************/
/*****  Code neu von hier: https://www.camp-firefox.de/forum/thema/128571-ansicht-erweiterungen-verwalten/?pageNo=1 *****/

addon-card:not([expanded]) .card-contents {
    white-space: normal !important;
    }

.addon-description {
    max-width: 1150px !important; /** Schrift in den Containern/ erlaubte Ausdehnung nach rechts in Pixel **/
    }
    
button:hover {    
    cursor: pointer !important;
    }

/************************************************************************************************************************************/
/*********************************** Ausrichtung der Button auf der rechten Seite ***************************************************/

/**** Button  Deaktivieren ****/    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] { 
    margin-left: -10px !important;
    padding-right: 20px !important;
    background: gainsboro !important; /* Hintergrundfarbe */
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="toggle-disabled"]:hover {
    background: magenta !important; /* Farbe bei Mauskontakt */
    color: white !important; /* Schriftfarbe bei Mauskontakt */
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="toggle-disabled"] 
{
    position: absolute !important;
    top: 16px !important; /* Abstand vom oberen Rand */
    left: 780px !important; /* Entfernung zum rechten Rand hin */
    box-shadow: inset 0 0 4px 4px #888; /* innerer Schatten im Button/ 4px die Breite/ #888 die Farbe */
    }    

/**** Button  Entfernen ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"] {  
    margin-left: 8px !important;
    padding-right: 13px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="remove"]:hover {
    background: red !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="remove"] 
{
    position: absolute !important;
    top: 16px !important;
    left: 950px !important;
    box-shadow: inset 0 0 4px 4px #888;
}    

/**** Button  Einstellungen ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"] {  
    margin-left: 32px !important;
    padding-right: 18px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }

addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="preferences"]:hover {
    background: blue !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="preferences"] 
{
    position: absolute !important;
    top: 16px !important;
    left: 550px !important;
    box-shadow: inset 0 0 4px 4px #888; 
}    

/**** Button  Aktualisieren ****/    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="install-update"] {
    margin-left: 60px !important;
    padding-right: 17px !important;
    background: gainsboro !important;
    border-radius: 60px !important;
    }
    
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="install-update"]:hover {
    background: lime !important;
    color: white !important;
    }
    
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="install-update"] 
{
    position: absolute !important;
    top: 72px !important;
    left: 900px !important;
    box-shadow: inset 0 0 4px 4px #888;
}    

/**** Button  Verwalten ausgeblendet ****/
addon-list section addon-card div.card.addon div.addon-card-collapsed div.more-options-menu addon-options panel-list panel-item[action="expand"] {  
    display: none !important;
}

/*** Button Melden wird ausgeblendet ****/
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item[action="report"] {
    display: none !important;
}
    
/*** hiermit wird der Hintergrund bei Klick auf das Zahnrad-Symbol ausgeblendet ***/
button:-moz-focusring {
    box-shadow: none !important;
    outline: 0px dotted !important;
    outline-offset: 0px !important;
}    

/*** hiermit wird der Hintergrund bei Klick auf Buttons auf der rechten Seite ausgeblendet ***/
button:focus, button:enabled:hover {
    background-color: transparent !important;
    border: none !important;
}

/*** hiermit werden unter Themes die Grafiken ausgeblendet ****/
.card-heading-image {
    display: none !important;
}

/******** Suchfeld für Erweiterungen wird ausgeblendet *****/
#header-search,#search-label {
  display: none !important;
}

/*** Text Suche nach Erweiterungen wird ausgeblendet ******/
#search-label {
  display: none !important;
}

#header-search input.textbox-input::placeholder {
    color: transparent !important;
}

/***********************************************************************************************/
/****************** 70er Nightly Addon Manager by @.DeJaVu *************************************/

addon-list addon-card > .addon.card
{
    width: 94vw  !important;  /* Ausdehnung der Container (weiße Boxen) zum rechten Rand hin */
    margin-bottom: 5px !important;  /* Abstand zwischen den Containern */
    height: 65px !important;  /* Höhe der Container */
    border: 1px solid grey !important; /* Umrandung der Container mit Farbauswahl */
    
}

addon-list section addon-card,
addon-list section addon-card .card.addon
{
    cursor: default !important;
}

addon-list section addon-card .card.addon .addon-card-collapsed
{
    cursor: pointer !important;
}

#addons-page #heading hbox.heading-inner #heading-name.header-name
{
    -moz-box-ordinal-group: 2 !important;
    padding-left: 10px !important;
}

.addon-badge-private-browsing-allowed {
    width: 230px !important;
    background-position: left !important;
}
.addon-badge-private-browsing-allowed::after
{
    content: "(In privaten Fenstern erlaubt)" !important;
    margin-left: 20px !important;
    
} 

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu
{
    position: absolute !important;
    margin: 0 !important;
    margin-inline-end: 0 !important;
    left: 520px !important;
    
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options
{
    margin-left: 0 !important;
    margin-inline-end: 0 !important;
}

/*** die drei Punkte werden im Container-Feld ausgeblendet *****/
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu button.more-options-button.ghost-button
{
    display: none !important;
}

addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list
{
    display: block !important;
    visibility: visible !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    --in-content-button-background: none !important;
    top: -25px !important;
}

.arrow, .arrow.top, .arrow.bottom,
addon-list section addon-card .card.addon .addon-card-collapsed .more-options-menu addon-options panel-list panel-item-separator
{
    display: none !important;
}

.message-bar{
    display:none;
}

/* Hintergrundfarbe auf allen Seiten hellgrau*/
#headered-views,
#category-box,
.App,
.DiscoPane,
.Footer{
    background:lightgrey!important;
    }

/* Die großen Button auf der linken Seite */
#categories > .category,
#preferencesButton,
#helpButton,
#addonsButton{
    margin-left:1px!important; /*Abstand der Button zum linken Rand*/
    }

#categories > .category:not([disabled]){
    background-color: gainsboro !important;/*Hintergrundfarbe vom Button*/
    margin-top:1px!important; /*Abstand zum Button darüber*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 5px 5px #888;
    }
    

/*** Aktiver Button rot, Schrift weiß ****/
#categories > .category[selected]{
    color:white!important;
    background-color: red !important;
    margin-top:1px!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 5px 5px #888; 
    }

/* Hintergrund der Button blau, Schrift weiß bei hover mit der Maus*/
#categories > .category:hover,
#preferencesButton:hover,
#helpButton:hover,
#addonsButton:hover{
    color:white!important;
    background-color: blue!important;
    margin-top:1px!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 5px 5px #888; 
    }
    
    
/* Die Breite der Felder unter Add-ons entdecken im rechten Fensterteil */
.App,           
.DiscoPane,
.Footer{
    max-width: initial !important;
    }
    
/* Kleiner Pfeil nach unten in einem Button, bei hover weiß */
.addon-control:hover .menulist-dropmarker{
    fill:white!important;
    }
    
/* Button oben mit dem Zahnrad */
#header-utils-btn{
    background-color: silver !important;/*Hintergrundfarbe vom Button*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }

/* Button oben mit dem Zahnrad bei hover blau */
#header-utils-btn:hover{
    color:white!important;
    background-color: lime!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
/* Zurückbutton bei geöffneter Einstellung einer Erweiterung */
#go-back{
    background-color: silver !important;/*Hintergrundfarbe vom Button*/
    border-radius:60px!important;/*Rundung vom Button*/
    box-shadow: inset 0 0 3px 3px #888; 
    }
    
#go-back:hover{
    color:white!important;
    background-color: lime!important;
    border-radius:60px!important;
    box-shadow: inset 0 0 3px 3px #888;
    }
    
/* Kleiner Pfeil nach unten in einem Button unter Plugins, bei hover weiß */
#detail-state-menulist:hover .menulist-dropmarker{
    fill:white!important;
    }
    

/* Button Nach Updates suchen */
#updates-view.view-pane vbox#updates-list-empty.alert-container vbox.alert button{
    background-color: silver !important;
    border-radius:60px!important;
    }
    
#updates-view.view-pane vbox#updates-list-empty.alert-container vbox.alert button:hover{
    color:white!important;
    background-color: blue!important;
    border-radius:60px!important;
    }
    
/**************** fortlaufende Nummerierung installierten Erweiterungen *******************/
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 {
  font-size:18px!important;  
  color: red !important;
  font-weight: bold !important;
  counter-increment: section;                 
  content: counter(section)".)  ";
  margin-left: -8px !important;
  padding-right: 8px !important; 
  margin-top:4px!important;
  } 
  
addon-list addon-card > .addon.card {
  width: 700px;
  }

Alles anzeigen

Grüße

FuchsFan

Beiträge von FuchsFan

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"

Ansicht "Erweiterungen verwalten"