How to add icons to the context menus of Thunderbird 68
Hi, in Firefox (currently version 72) I have added icons to the context menu entries with simple CSS code. This also worked in Thunderbird until version 60. Now in version 68 I can change the buttons in the bars and the app menu but I don't find a way to get the icons back in the context menus. Can someone give me an example how this can be accomplished in Thunderbird 68? Thank you very much
bege দ্বারা পরিমিত
সমাধান চয়ন করুন
This https://www.digitalocean.com/community/tutorials/how-to-access-elements-in-the-dom description lead me to a solution. I don't know whether it will have unwanted side effects, at the moment it has the wanted effect.
This little code does what I wrote in the previous post and the icons provided by CSS code and grafik files are displayed in front of the context menus in Thunderbird :-)
Edit: I have added to the code to prevent menu entries that already have the needed CSS class to get a wrong class name. This code now also works in Firefox.
setTimeout(function() { var ucjsAC = { init : function () { const menu = document.querySelectorAll('menu'); menu.forEach(query => { if (query.className != 'menu-iconic') query.className += 'menu-iconic'; }); const menuitem = document.querySelectorAll('menuitem'); menuitem.forEach(query => { if (query.className != 'menuitem-iconic') query.className += 'menuitem-iconic'; }); }, } ucjsAC.init(); }, 1000);
প্রেক্ষাপটে এই উত্তরটি পড়ুন। 👍 0All Replies (2)
I found out a first step: The menus and menuitems in the context menus don't have the classes menu-iconic or menuitem-iconic. They place the icons I defined with CSS to the entries. So the next question is how I can add these classes to the entries. For one CSS-ID I tested:
setTimeout(function() {
var ucjsAC = { init : function () { var d = document.getElementById("mailContext-editAsNew"); d.className += "menu-iconic"; }, } ucjsAC.init(); }, 1000);
and look there - the first icon is in a context menu :-D Now I cannot write this function for each and every menu entry and I don't have a clue of Javascript programming, I only can try to put together examples from others. I'd need a script that cycles through all menus and assigns the menu-iconic class menu entries and to all menuitems the menuitem-iconic class.
But I wonder why the Thunderbird team did not assign these classes to the menu entries
bege দ্বারা পরিমিত
চয়ন করা সমাধান
This https://www.digitalocean.com/community/tutorials/how-to-access-elements-in-the-dom description lead me to a solution. I don't know whether it will have unwanted side effects, at the moment it has the wanted effect.
This little code does what I wrote in the previous post and the icons provided by CSS code and grafik files are displayed in front of the context menus in Thunderbird :-)
Edit: I have added to the code to prevent menu entries that already have the needed CSS class to get a wrong class name. This code now also works in Firefox.
setTimeout(function() { var ucjsAC = { init : function () { const menu = document.querySelectorAll('menu'); menu.forEach(query => { if (query.className != 'menu-iconic') query.className += 'menu-iconic'; }); const menuitem = document.querySelectorAll('menuitem'); menuitem.forEach(query => { if (query.className != 'menuitem-iconic') query.className += 'menuitem-iconic'; }); }, } ucjsAC.init(); }, 1000);
bege দ্বারা পরিমিত