affichage onglets "bruyants" sans survol

[pitfolus]

Bonjour,
Existe il une solution simple pour que le haut parleur s'affiche à gauche d'un onglet qui diffuse du son, par exemple une video youtube?
Actuellement le haut parleur s'affiche seulement quand le curseur survole l'onglet. pas évident d'identifier l'onglet bruyant lorsqu'il y en a bcp d'ouvert.
Merci

[Agent virtuel]

Bonjour

viewtopic.php?t=148840 le code présenté par Freddy peut-il vous être utile

Code : Tout sélectionner

/*haut-parleur (son en cours)*/
tab.tabbrowser-tab .tab-icon-overlay[soundplaying="true"]{
  scale: 5
}

/* favicon*/
.tab-icon-stack {
  scale: 
}

/*texte "lecture en cours"*/
.tab-secondary-label {
  scale: 
}

Copier/coller le code (par exemple) dans un Bloc-notes
Enregistrer
Type : Tous les fichiers
userChrome.css

Créer un dossier chrome
Déplacer userChrome.css vers votre dossier chrome

Dirigez-vous vers votre dossier de profil
https://support.mozilla.org/fr/kb/profi ... mon-profil Ouvrir le dossier correspondant
Déplacer votre dossier chrome vers votre dossier de profil

about:config https://support.mozilla.org/fr/kb/edite ... on-firefox
Rechercher une préférence toolkit.legacyUserProfileCustomizations.stylesheets
Pour une préférence booléenne (true/false), cliquez sur le bouton Inverser lui donner la valeur true

Arrêt Firefox démarrer Firefox

[pitfolus]

Merci mais ça ne fonctionne pas. j'ai déjà un fichier userChrome.css dans le dossier chrome. j'ai rajouté le code de Freddy à la suite du code déjà présent mais ça ne change rien.
la transition entre les 2 codes dans le fichier:

Code : Tout sélectionner

.bookmark-item[container][query],
treechildren::-moz-tree-image(container, query) {

 fill: dimgray !important;

} 

/*haut-parleur (son en cours)*/
tab.tabbrowser-tab .tab-icon-overlay[soundplaying="true"]{
  scale: 5
}

[modération]
Merci d'utiliser les balises code (bouton </> ). Elles ont donc été ajoutées pour une meilleure lisibilité.
[/modération]lool-lauris

[pitfolus]

un haut parleur bcp gros que l'onglet apparait au survol, c'est pire qu'avant

[Agent virtuel]

Bonsoir

Le code présenté par Freddy, fonctionne
https://drive.google.com/file/d/1vKqp0h ... sp=sharing
Vous avez aussi la possibilité de Télécharger l'animation, si vous le souhaitez

À propos

un haut parleur bcp gros que l'onglet apparait au survol, c'est pire qu'avant

Code : Tout sélectionner

scale: 5

Jouer sur le scale, par exemple, essayer, scale: 2

[pitfolus]

Merci pour les précisions.
Avez vous une idée pourquoi ça ne fonctionne pas sur mon PC? Est ce la fait qu'il y ai déjà un code enregistré dans le fichier userChrome.css?

[Agent virtuel]

Brut d'information avec votre code

Code : Tout sélectionner

.bookmark-item[container][query],
treechildren::-moz-tree-image(container, query) {

 fill: dimgray !important;

} 

/*haut-parleur (son en cours)*/
tab.tabbrowser-tab .tab-icon-overlay[soundplaying="true"]{
  scale: 5
}

/* favicon*/
.tab-icon-stack {
  scale: 
}

/*texte "lecture en cours"*/
.tab-secondary-label {
  scale: 
}

Ça fonctionne
Alors, pour ma part, je ne sais pas que vous dire de plus
Et, ne pas oublier, arrêt Firefox démarrer Firefox, pour prise en compte du code
Lorsque que l'on modifie un code, alors, l'arrêt de Firefox et démarrer Firefox, est nécessaire

Et à titre informatif Firefox release notes https://www.mozilla.org/en-US/firefox/releases
Depuis Firefox 69 https://www.mozilla.org/en-US/firefox/69.0/releasenotes

Firefox no longer loads userChrome.css or userContent.css by default improving start-up performance. Users who wish to customize Firefox by using these files can set the toolkit.legacyUserProfileCustomizations.stylesheets preference to true to restore this ability

[Anonyme1]

Bonjour,

Avez vous une idée pourquoi ça ne fonctionne pas sur mon PC?

Chez moi, ne marche pas non plus.
Pour que cela fonctionne: il faut activer le mode compacte.
Dans la barre d'adresse tape → about:config et touche ENTRER du clavier, puis clique sur → Accepter le risque et poursuivre
Dans la barre de recherche (en haut) copier/coller ceci → browser.compactmode.show et double clic sur false pour le passer à true
Et ferme l'onglet about:config
Ensuite:
Clique sur le bouton de menu ☰ (en haut sur droite), puis sur Outils supplémentaires et choisir Personnaliser la barre d’outils…
En bas cliquer sur Densité et cliquer sur Compacte (non prise en charge)
Et ferme l'onglet Personnaliser...

Et dans ton code userChrome.css, mettre seulement ceci:

Code : Tout sélectionner

/* Taille icône haut-parleur (son en cours) */
tab.tabbrowser-tab .tab-icon-overlay[soundplaying="true"]{
  scale: 2
}

Autre code: Couleur de l'onglet et haut-parleur (toujours avec le mode Compacte)

Code : Tout sélectionner

/* Couleur de l'onglet en cour */
tab:not([selected])[soundplaying="true"] {
  background:  Lime !important; 
  color: black !important;
  border: 2px red solid !important;
}

/* Taille icône haut-parleur (son en cours) */
tab.tabbrowser-tab .tab-icon-overlay[soundplaying="true"]{
  scale: 2
}

Il doit certainement exister un code CSS sans à avoir à activer le mode compacte.( si Freddy pouvait passer par ici)
A+

[Agent virtuel]

Bonjour

Compacte (non prise en charge)

En addition de, Compacte (non prise en charge)
Après, si vous souhaitez obtenir un mode compact plus complet, alors, dirigez-vous vers viewtopic.php?p=933060#p933060

[Freddy]

Bonjour,

Il doit certainement exister un code CSS sans à avoir à activer le mode compacte.( si Freddy pouvait passer par ici)

Oui coucou, me voilà, j'arrive j’accours, tel Zorro... euh j'vous préviens j'ai pas de masque, ni cape, et ni de chapeau, ...euh pis encore moins de cheval Bon ben on va essayer de faire avec, enfin avec sans

Bon après analyse de quesque je viens de lire, je dirai que la solution est de se diriger vers un bon opticien, paceque il faut bien lire le topic mis en lien au début par Agent Virtuel, et surtout jusqu'au bout; car la solution qui fonctionne se trouve dans mon dernier post

Après ce n'est pas obligatoire de modifier la couleur ni l'échelle.
Et c'est aussi possible de faire disparaître le favicon pour ne laisser que le haut-parleur:

Code : Tout sélectionner

/*haut-parleur (son en cours) dans onglet-s non sélectionné*/
tab:not([selected])[soundplaying="true"] .tab-icon-overlay{ 
  opacity: 1 !important;
  scale: 2;
  fill:aqua !important;
}

/*suppression du favicon (n'est plus superposé avec le h-p)*/
tab:not([selected])[soundplaying="true"] .tab-icon-image{ 
  opacity: 0 !important;
}

Et sinon je rappel aussi que:

Gloops a écrit : ↑11 juin 2022 13:29
Il reste à parcourir les onglets avec le curseur de la souris, puisque ce haut-parleur n'apparaît que lorsque le curseur est sur l'onglet

Freddy a écrit :
Si tu as suffisamment d'onglet ouvert, tu peux voir celui qui joue du son en ouvrant le bouton tout à droite de la barre d'onglets (la flèche dirigée vers le bas)

[Anonyme1]

bonjour,

Oui coucou, me voilà, j'arrive j’accours, tel Zorro... euh j'vous préviens j'ai pas de masque, ni cape, et ni de chapeau, ...euh pis encore moins de cheval

Salut Freddy, toujours pas guéri, toujours plusieurs dans ta tête

Question:
Est t'il possible de faire apparaitre un haut-parleur pour un Firefox version 56.0 ?
J'utilise encore un Firefox 56.0 pour des extensions qui ne son plus mise a jour sur les Firefox suivant.
A+ (Bonne guérison )

[Freddy]

Salut GlopGlop,

Que veux-tu, rien que de penser à devoir me soigner ça me rend malade

Et pis j'ai un autre problème.
Comment veux tu que j'aille mieux quand on essaie de me rendre taré ?
et d'une, tu me provoque un choc neuro-sismique en me télétranstorpant vers une époque oubliée
(sérieux, c'est vrai que ça fait drôle de se retrouver avec cette version, on oublie vite finalement)

et de deux, tu veux me faire chauffer mes pauvres ptits neurones pour un travail déjà fait...
Parce que perso, chez moi (Fx 56 linux) sans rien toucher j'ai ça:

Et comme tu peux voir, le h-p reste aussi visible même quand on est pas sur l'onglet concerné.

Ou alors j'suis vraiment atteint et j'ai pas compris ta demande...

[Anonyme1]

Bonjour,
J'ai de trouver le problème, dans about:config la ligne browser.tabs.showAudioPlayingIcon était sur false
Remisse la valeur en true et le haut-parleur est revenu. (je n'ai pas souvenir d'avoir changé cette valeur)
Je prends les devants, suis tous seul dans ma tête et pas alzheimer.

Chez moi l'icône du haut-parleur est bien pâle (manque de couleur) Elle serait bien plus visible dans une autre couleur.

Concentre-toi et rassemble tes neurones

Que veux-tu, rien que de penser à devoir me soigner ça me rend malade
Et pis j'ai un autre problème.
Comment veux tu que j'aille mieux quand on essaie de me rendre taré ?
et d'une, tu me provoque un choc neuro-sismique en me télétranstorpant vers une époque oubliée
et de deux, tu veux me faire chauffer mes pauvres ptits neurones pour un travail déjà fait...

Moi te rendre taré ,non, non, ce n'est pas le genre de la maison
Loin de moi l'idée, que si j’avais pansé une seule seconde que j'allai anéantir des années de thérapie en te demandant si tu n'étais toujours pas guéri
A+

[Freddy]

Ah oui, ce fameux about:config, c'est lui qui nous met à l'envers, mais si nous on le met à l'envers le config:about on en vient à bout

Chez moi l'icône du haut-parleur est bien pâle (manque de couleur) Elle serait bien plus visible dans une autre couleur.

lui aussi tombe malade

Bon après une injection d'un ptit css, ça devrait aller mieux:
pour la couleur (au choix bien entendu)

Code : Tout sélectionner

.tab-icon-sound {
  fill: red !important;
}

et si le besoin s'en fait ressentir, pourquoi pas lui administrer en plus:

Code : Tout sélectionner

.tab-icon-sound {
  opacity: 1 !important;
  transform: scale(1.7);
}

(les deux ou un seul)

A prolonger sans avis médical, et sans risque d'effet-s secondaire-s

[Anonyme1]

A prolonger sans avis médical, et sans risque d'effet-s secondaire-s

Bonjour docteur Freddy
Aucun effet avec les deux codes. (Il y a une c*****e dans le potage, mais où ?)
Certainement un problème dans le profil ou dans about:config ?
Tester sur un Firefox portable 56.0 (profil neuf sans rien importer) les codes fonctionnent.
Même avec ce code inspirer des deux codes.

Code : Tout sélectionner

/*==== Couleur et taille Haut-parleur (son en cours) onglet-s ====*/
.tab-icon-sound {
  fill: fuchsia !important;
  transform: scale(1.5);
}
/*==== Fin - Couleur et taille Haut-parleur (son en cours) onglet-s ====*/

Je continue de chercher le pourquoi du comment ?

Edit:
Trouver ce code qui change l’icône et qui fonctionne.(avec adresse URL)(pas terrible l'icône)

Code : Tout sélectionner

.tab-icon-sound[soundplaying] {
  list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAF9SURBVHjajJO9SwNBEMXfnTEqIilsrMQiiGgvdn40Iig2iqRIYRBRwRC1TWGphUUwpLa2sLCwskqCkICoUclfIIhdwEYhrm8me/EIZ5IdfrNfb+buZm+Bzm3QN+4TZ4xp0qntMlxUK2Se4TJ+JnudEkyRHMMNboijgZc0w3CDNZ3nSH9Q8A4iFGSJWEnFJfSwnyNXdv2gmQRFUrZsY5obT1YklldhHhn2FyRkg8WWZa9IV7YkyIMvWKygCQrYYF8j1zp/pNnkfrE85aUlgfcGwAkW7Nok2SffMC7qvq//IvV/C3uMO/pPMkNeSS/govUknMC5+IjWXKiRoca2y6L8tbD3qwS0EN6R0gjgliyRD1k+4uDHiuRLR8i4L9BYf0afJJv2QQly3pAckpRlFgMUn5J6SxHX2a+SCVvoqq5Xg152jGSxSMEbqaiwQjJ6SmL3ZFTXk+3uQRpRitLNXzlOM4iRsM63urlMUU0EDNt5nMSkCt5lcrrJ0q79CjAAedTA3tg2ji8AAAAASUVORK5CYII=) !important;
}

J'ai juste ajouter transform: scale(1.7); !important;

Code : Tout sélectionner

.tab-icon-sound[soundplaying] {
  list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAF9SURBVHjajJO9SwNBEMXfnTEqIilsrMQiiGgvdn40Iig2iqRIYRBRwRC1TWGphUUwpLa2sLCwskqCkICoUclfIIhdwEYhrm8me/EIZ5IdfrNfb+buZm+Bzm3QN+4TZ4xp0qntMlxUK2Se4TJ+JnudEkyRHMMNboijgZc0w3CDNZ3nSH9Q8A4iFGSJWEnFJfSwnyNXdv2gmQRFUrZsY5obT1YklldhHhn2FyRkg8WWZa9IV7YkyIMvWKygCQrYYF8j1zp/pNnkfrE85aUlgfcGwAkW7Nok2SffMC7qvq//IvV/C3uMO/pPMkNeSS/govUknMC5+IjWXKiRoca2y6L8tbD3qwS0EN6R0gjgliyRD1k+4uDHiuRLR8i4L9BYf0afJJv2QQly3pAckpRlFgMUn5J6SxHX2a+SCVvoqq5Xg152jGSxSMEbqaiwQjJ6SmL3ZFTXk+3uQRpRitLNXzlOM4iRsM63urlMUU0EDNt5nMSkCt5lcrrJ0q79CjAAedTA3tg2ji8AAAAASUVORK5CYII=) !important;
  transform: scale(1.7); !important;
}

Je me demande donc, si il est possible de mettre une icône (de taille 16px × 16px ou autre ) dans le dossier chrome et de lui mettre l'adresse dans le CSS ?
A+