Voilà, suite aux précieuses indications de
MicP ci-dessus (post #8), je reposte comme promis pour montrer mes premiers essais de personnalisation de xfce4-notify-4.0
J’ai réussi à mettre en place un fond multicolore fixe ainsi qu’un fond multicolore animé.
Ca fonctionne mais ça doit être encore amélioré car ce n’est pas très esthétique pour l’instant.
Comme expliqué par
MicP dans le post #8, je suis parti du thème Greybird de base (celui situé /usr/share/themes/Greybird) dont j’ai placé 2 copies du fichier xfce-notify-4.0/gtk.css :
- une dans un dossier ~/.local/share/themes/essai_fond_fixe/ nouvellement créé pour l’occasion ;
- une autre dans un dossier ~/.local/share/themes/essai_fond_animé/ également créé pour l’occasion.
Et ensuite, je n’ai fait que modifier à la marge le fichier gtk.css qui se trouve à l’intérieur des dossiers essai_fond_fixe et essai_fond_animé.
Il y a cependant une chose que je n'ai pas réussi à faire : ajouter un background-image à #XfceNotifyWindow qui se situe au tout début des fichiers gtk.css
Je pense que les développeurs ont fait en sorte d’interdire ce genre de manip’ à cet endroit précis. Ils ont sûrement une bonne raison à cela mais c’est rageant !
Les premiers résultats donc :
1°)
avec un fond multicolore fixe :
Voici le message de notification qui s’affiche pour la mise en place du compositeur compton :
Et ci-dessous le fichier ~/.local/share/themes/essai_fond_fixe/xfce-notify-4.0/gtk.css que j’ai modifié pour parvenir à mes fins :
#XfceNotifyWindow {
background-color: #EED1E2;
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow .osd {
background-color: #111111;
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow:hover {
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow .osd:hover {
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow image {
background-image: none;
color: #eeeeee;
}
#XfceNotifyWindow label#summary,
#XfceNotifyWindow label#body {
background-image: linear-gradient( to right, #d0d2ff, #ffd0d2, #fffdd0, #d0fffd );
box-shadow: 10px 10px 5px rgba(0,0,0,0.6);
color: #000000;
font-weight: Bold;
}
#XfceNotifyWindow button {
border-style: none;
background-image: linear-gradient(90deg, #e91e63 0%, #e91e63 20%, #03a9f4 20%, #03a9f4 40%, #8bc34a 40%, #8bc34a 60%, #ffeb3b 60%, #ffeb3b 80%, #ff5722 80%, #ff5722 100%);
background-color: #EED1E2;
color: #000000;
background-repeat: repeat-x;
animation: movebar 0.8s linear infinite;
}
@keyframes movebar {
from { background-position: 0 0; }
to { background-position: 100px 0; }
}
#XfceNotifyWindow button:hover {
border-style: none;
background-image: none;
background-color: #444444;
color: #ffffff;
}
#XfceNotifyWindow progressbar {
border-radius: 1px;
}
#XfceNotifyWindow progressbar progress {
min-height: 8px;
background-image: none;
background-color: shade(#4084D6, 1.2);
}
#XfceNotifyWindow progressbar trough {
min-height: 10px;
background-image: none;
background-color: #000000;
border: 1px solid shade(#000000, 0.6);
border-radius: 1px;
}
NB: dans le code ci-dessus, #XfceNotifyWindow button est également modifié de façon à animer le bouton lorsqu'il est inactif (barre multicolore qui défile sans fin). Par contre, le survol du bouton par le curseur de la souris arrête l'animation et remet immédiatement le bouton traditionnel.
Ce bouton animé n'est pas visible lorsque c'est notify-send qui émet le message de notification. Par contre, il l'est lorsque c'est le daemon xfce-notify-4.0 qui s'en charge.
2°)
avec un fond multicolore animé :
Voici le message de notification qui s’affiche pour la mise en place du compositeur compton. Pour ce post, je ne mets que la copie d’écran fixe mais vous pouvez voir l’animation en cliquant
ici.
Et ci-dessous le fichier ~/.local/share/themes/essai_fond_animé/xfce-notify-4.0/gtk.css que j’ai modifié pour parvenir à mes fins :
#XfceNotifyWindow {
background-color: #111111;
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow .osd {
background-color: #111111;
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow:hover {
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow .osd:hover {
border: 0px solid #4084D6;
border-radius: 0px;
}
#XfceNotifyWindow label#body {
background-image: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55);
color: #eeeeee;
animation: colorAnimation 1s infinite;
}
@keyframes colorAnimation {
0% {
background-image:
linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55);
}
20% {
background-image:
linear-gradient(to right, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55, #4cd964);
}
40% {
background-image:
linear-gradient(to right, #007aff, #7DC8E8, #5856d6, #ff2d55, #4cd964, #5ac8fa);
}
60% {
background-image:
linear-gradient(to right, #7DC8E8, #5856d6, #ff2d55, #4cd964, #5ac8fa, #007aff);
}
100% {
background-image:
linear-gradient(to right, #5856d6, #ff2d55, #4cd964, #5ac8fa, #007aff, #7DC8E8);
}
}
#XfceNotifyWindow image {
background-image: none;
color: #eeeeee;
}
#XfceNotifyWindow label#summary {
background-image: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55);
color: #eeeeee;
font-weight: Bold;
animation: colorAnimation 1s infinite;
}
@keyframes colorAnimation {
0% {
background-image:
linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55);
}
20% {
background-image:
linear-gradient(to right, #5ac8fa, #007aff, #7DC8E8, #5856d6, #ff2d55, #4cd964);
}
40% {
background-image:
linear-gradient(to right, #007aff, #7DC8E8, #5856d6, #ff2d55, #4cd964, #5ac8fa);
}
60% {
background-image:
linear-gradient(to right, #7DC8E8, #5856d6, #ff2d55, #4cd964, #5ac8fa, #007aff);
}
100% {
background-image:
linear-gradient(to right, #5856d6, #ff2d55, #4cd964, #5ac8fa, #007aff, #7DC8E8);
}
}
#XfceNotifyWindow button {
border-style: none;
background-image: linear-gradient(90deg, #e91e63 0%, #e91e63 20%, #03a9f4 20%, #03a9f4 40%, #8bc34a 40%, #8bc34a 60%, #ffeb3b 60%, #ffeb3b 80%, #ff5722 80%, #ff5722 100%);
background-color: #000000;
color: #ffffff;
background-repeat: repeat-x;
animation: movebar 0.8s linear infinite;
}
@keyframes movebar {
from { background-position: 0 0; }
to { background-position: 100px 0; }
}
#XfceNotifyWindow button:hover {
border-style: none;
background-image: none;
background-color: #444444;
color: #ffffff;
}
#XfceNotifyWindow progressbar {
border-radius: 1px;
}
#XfceNotifyWindow progressbar progress {
min-height: 8px;
background-image: none;
background-color: shade(#4084D6, 1.2);
}
#XfceNotifyWindow progressbar trough {
min-height: 10px;
background-image: none;
background-color: #000000;
border: 1px solid shade(#000000, 0.6);
border-radius: 1px;
}
NB: dans le code ci-dessus, #XfceNotifyWindow button est également modifié de façon à animer le bouton lorsqu'il est inactif (barre multicolore qui défile sans fin). Par contre, le survol du bouton par le curseur de la souris arrête l'animation et remet immédiatement le bouton traditionnel.
Ce bouton animé n'est pas visible lorsque c'est notify-send qui émet le message de notification. Par contre, il l'est lorsque c'est le daemon xfce-notify-4.0 qui s'en charge.
Merci encore
MicP, sans ton aide je n’aurai jamais eu l’idée de tenter de personnaliser les messages de notification gérés par notify-send et le daemon xfce-notify-4.0 !
PS : je m’absente pour 3 semaines. Merci de votre compréhension si je ne réponds pas à un éventuel message ...
