Tab mit Audioinhalt: Ist diese Darstellung normal oder ein nicht mehr richtig funktionierendes Script?

Zitat von Zitronella

aber lediglich meinen Code aus der userChromeShadow.css in die userChrome.css zu schreiben funktioniert wohl nicht.

Richtig.

Zitat von Zitronella

Würde ich aber machen (mit Hilfe des Forums) wenn es Vorteile bringen würde. Gibt es denn Vorteile, außer dass man 2 Dateien weniger hat?

Wenn Du sowieso Userskripte nutzt, dann wohl keinen, aber ich hab das auch geschrieben für den Fall, dass irgendjemand anderes das liest.

Zitat von Zitronella

kannst du mir konkret an meinem Code sagen was ich weglassen könnte?

Aus meiner Sicht:

/* Lautsprechersymbol … ohne Hintergrundfarbe */
.tab-audio-button {
 border: none !important;
 background-color: transparent !important;
}

/* Lautsprechersymbol in ungelesenen Tabs, … und Hintergrundfarbe */
.tab-audio-button {
 #tabbrowser-tabs:is([orient="vertical"][expanded], [orient="horizontal"]) &:not([pinned]):not([crashed]) {
   &[activemedia-blocked]::part(button) {
     background-image: url("chrome://browser/skin/tabbrowser/tab-audio-blocked-circle-12.svg");
     background-color: transparent !important;
   }
 }
}

Oder: In der ersten hier zitierten Regel ist die Vergrößerung abweichend vom Standard, in der zweiten die Einfärbung.

Zitat von Zitronella

Bedeutet ich müsste wieder einiges umschreiben […] Würde ich aber machen (mit Hilfe des Forums)

Ausgehend von Beitrag #139 müsste das so aussehen, denke ich – ein lokaler Test sieht jedenfalls gut aus:

/*///////////////   Sound/Lautsprecher Symbol in Tabs ändern   ///////////////*/

/* Verhindern, dass Audio-Tabs die Tab-Breite ändern (wenn im Player der Ton aktiviert/deaktiviert wird und viele Tabs offen sind) */
.tabbrowser-tab {
    &:is([muted], [soundplaying], [activemedia-blocked]) {
        #tabbrowser-tabs[orient="horizontal"] &:not([pinned]) {
            --tab-min-width: unset !important;
        }
    }
}
#tabbrowser-tabs:is([orient="vertical"][expanded], [orient="horizontal"]) .tabbrowser-tab:not([pinned]):not([crashed]) {
  /* Verstecke das Favicon beim Abspielen (wie bei FF 135) außer bei geblockten Medien in ungelesenen Tabs[activemedia-blocked] */
  &:is([soundplaying], [muted]/* , [activemedia-blocked] */) .tab-content .tab-icon-image {
    display: none;
  }
  /* Lautsprechersymbol: Position, Größe, ohne Hintergrundfarbe bei Hovern */
  .tab-audio-button { /* Edit: 2 Regeln zusammengefasst */
    --button-size-icon-small: 18px !important;
    --button-min-height-small: var(--button-size-icon-small) !important; /* Edit */
    --button-background-color-ghost-hover: transparent !important; /* add. */
    --button-background-color-ghost-active: var(--button-background-color-ghost-hover) !important; /* add. */
    margin: auto 4.5px auto -1px !important;
    scale: 1.3 !important;
    transform: translateY(-2px);

    /* Lautsprechersymbol Farbe bei Sound */
    &[soundplaying] { /* add. */
      --button-icon-fill: green !important;
    }
    /* Lautsprechersymbol Farbe bei Stumm  */
    &[muted] { /* add. */
      --button-icon-fill: red !important;
    }
    /* Lautsprechersymbol Farbe in ungelesenen Tabs */
    &[activemedia-blocked] { /* add. */
      --button-icon-fill: orange !important;
    }
  }
}

Ich habe nach manchen Regeln in Kommentaren ein /* add. */ oder /* Edit */ angehängt. Diese Kommentare kann man natürlich entfernen, sie beziehen sich nur auf den verlinkten Regelsatz.

Zitat von Speravir

Wenn Du sowieso Userskripte nutzt, dann wohl keinen

Dann behalte ich die userChromeShadow.css, da ich eh Userscripte nutze.

Vielen Dank Speravir für deine ganze Mühe.

Zitat von Zitronella

Vielen Dank Speravir für deine ganze Mühe.

Wie gesagt, vielleicht hilft es ja anderen.

Zitat von Speravir

Wie gesagt, vielleicht hilft es ja anderen.

Genau so hatte ich es auch verstanden. Wollte mich aber trotzdem bedanken
-----------------------------------------------------------------------------------------------

Gestern hatte ich mal wieder viele Tabs offen u.a. einen Discord Tab, bei dem immer mal wieder Sound war, wenn jemand etwas schrieb und da sah ich, wie meine Tabs in der Leiste wieder hin und her sprangen. Das hat mich echt kirre gemacht.

Zum Glück fand ich auf Reddit die Lösung:

Statt dem Code

/* verhindern, dass Audio-Tabs die Tab-Breite ändern (wenn im Player der Ton aktiviert/deaktiviert wird und viele Tabs offen sind) */
.tabbrowser-tab {
    &:is([muted], [soundplaying], [activemedia-blocked]) {
        #tabbrowser-tabs[orient="horizontal"] &:not([pinned]) {
            --tab-min-width: unset !important;
        }
    }
}

die eine Zeile 5 folgendermaßen verändern. Sieht dann so aus:

/* verhindern, dass Audio-Tabs die Tab-Breite ändern (wenn im Player der Ton aktiviert/deaktiviert wird und viele Tabs offen sind) */
.tabbrowser-tab {
    &:is([muted], [soundplaying], [activemedia-blocked]) {
        #tabbrowser-tabs[orient="horizontal"] &:not([pinned]) {
			min-width: max(var(--tab-min-width-pref, var(--tab-min-width))) !important;
        }
    }
}

Und danach ist Ruhe mit dem rum gespringe der Tabs. Vielleicht hilft es ja jemandem.

Eine nette Ergänzung zu #117 (Einfärbung der Audio-Icons, beachte Zeilenzahlen):

.tab-audio-button[soundplaying-scheduledremoval]:not([muted]) {
	--button-icon-fill: #0060df !important;/* var(--blue-60) */
}

Das färbt das Symbol blau, wenn man einen Medieninhalt mit Audioteil pausiert, aber auch, wenn er fertig abgespielt ist.

Damit man das überhaupt bemerkt, muss man den Standard der Symboleinblendung deutlich verlängern: In about:config die Einstellung browser.tabs.delayHidingAudioPlayingIconMS finden und den Standardwert 3000 (= 3000ms) deutlich erhöhen. Beispielsweise steht 86400000 für 1 Tag (24h à 60min à 60s), was für die meisten effektiv bedeuten sollte, dass das Symbol gar nicht ausgeblendet wird (und diese Flackerei, wie sie etwa Zitronella störte, auch nicht mehr auftreten dürfte).

Ich hab mir das Symbol auch noch geändert, aber, wie oben mehrfach bemerkt, muss die entsprechende Regel in die UserChromeShadow-Stildatei eingetragen werden:

/* Anzeige des Pausenmodus in Tabs mit Medieninhalten */
.tab-audio-button {
    #TabsToolbar #tabbrowser-tabs[orient="horizontal"] &:not([pinned]):not([crashed]),
    :root:not([sidebar-expand-on-hover]) #tabbrowser-tabs[orient="vertical"][expanded] &:not([pinned]):not([crashed]) {
        &[soundplaying-scheduledremoval]:not([muted])::part(button) {
            background-image: url("chrome://global/skin/media/pause-fill.svg") !important;
        }
    }
}

Das ist eine abgewandelte Kopie des originalen Codes, ich hatte nur damit Erfolg. Das zeigt das Pausensymbol auch bei bis zum Ende abgespielten Medientabs, aber das sit mir lieber als das Symbol für einen aktiven Medientab.

Es gibt übrigens im Firefox noch schlankere Pausensymbole an anderer Stelle (bzw. wie es scheint das optisch selbe Symbol an zwei Stellen), bei Interesse könnte ich eine Adresse angeben.

Apropos Zitronella: Zu deinem Beitrag #145 siehe auch Antwort von krystian3w in Audio is expanding/collapsing/resizing tab, want to act like before FireFox 136 (Issue #755 · Aris-t2/CustomCSSforFx).