Changing icon of a gnome extension

Question

I can't figure out how to modify the icon of the gnome extension Adjust Brightness Icon https://extensions.gnome.org/extension/1388/adjust-brightness-icon/

The default one is not good, it looks crushed. So I took a look at the code of the file extension.js and noticed this line for the icon:

//usr/share/icons/gnome/scalable/actions/system-run-symbolic.svg
let icon = new St.Icon({ icon_name: 'dialog-information-symbolic',
                         style_class: 'panelItem' }); //system-status-icon

I took a look at the caffeine extension to see how the icon get initialized and so I tried this code for adjust.brightness but with no success:

let icon = new St.Icon({
    style_class: 'system-status-icon'
});
icon.gicon = Gio.icon_new_for_string(`${Me.path}/my-caffeine-off-symbolic.svg`);

How to update the icon of an extension for an svg one?

score 1 · Answer 1 · answered Aug 25 '21 at 17:14

Thanks to the command journalctl -f -o cat /usr/bin/gnome-shell I could debug this extension.

I had problems like Gio is not defined and had to define these 2 constants:

const Gio = imports.gi.Gio;
const Me = imports.misc.extensionUtils.getCurrentExtension();

I had to change the css style:

.panelItem {
    width: 15px;
    height: 15px;
    margin:8px;
}

And found an SVG icon from https://flathub.org/apps/details/org.gnome.design.IconLibrary

Changing icon of a gnome extension

1 Answers1