Custom CSS stylesheets

[tfuxu]

These commits add a basic loading mechanism for custom CSS stylesheets, and an configurable option in preferences window. Fixes #4 and #13 I've also added a small fix for a stretched skip_taskbar_mode_toggle in preferences.

I'm setting this PR as a draft for now, because of a 2 main bugs in current implementation:

• The GtkFileChooserNative currently isn't transient to the preferences window, and it closes itself randomly, (Fixed in commit 240a6ec4059003c13c4db1d6a0d6af96eed8b422)
• There is a lock/unlock bug, I need to investigate on that more, but it looks the same as a log-out/log-in bug that I've fixed it the latest commit (before bugfix, it loaded both default and custom stylesheets during initialization). (Now it works as it should)

With the first one, I would need some help from someone who knows GJS better than me, and for a second bug I think I have a fix already, but I need to test it further.

There also could be a problem with that code I've added in init() function, because ego guidelines says "Your extension MUST NOT create any objects, connect any signals, add any main loop sources or modify GNOME Shell here." (link), and I'm doing probably two things from that rule currently. (Fix from a commit e5ebe2ca2474604a08f884616bf6ef3446bdcce3 removes any necessity for unloading stylesheets in init(), so extension review process shouldn't be a problem now)

[MichaelAquilina]

@tfuxu in general the idea and approach looks sensible to me. I'll wait for you to resolve the existing bugs and then give it a thorough review.

Thanks for contributing!

[tfuxu]

@MichaelAquilina Do you have any experience with FileChooserNative in GJS? This closing itself behavior is weird for me. I don't think that setting transient-for property would be crucial to get this working, because it wasn't required. Maybe I just forgot to add something?

[MichaelAquilina]

I'm afraid I'm not familiar with it myself. Might be worth reaching out to a forum or appropriate discord channel if you are having trouble with it?

[tfuxu]

@MichaelAquilina Just letting you know that I've sorted out all bugs in this PR

[tfuxu]

@MichaelAquilina Ping? I fixed that merge conflict so everything now should be ready for merge.

[tfuxu]

My one concern with this change is that while it works, it is not very easy to use and requires users to dig into the CSS.

I can write a guide in README, and maybe add a "help" button in prefs that will redirect to the guide. I'm also planning to revamp a preferences window in the near future, and with this I could add a new section for widget customization.

It also means that we need to maintain a stable CSS "API" over time in order not to break anyone's existing custom CSS

I think that IWI already has a solid shell widget, and it probably won't get that much structure changes in a future for this to be a issue.

[tfuxu]

I've created in 1da10ef8c3d5c963a16c5229a720091e28ed14b8 a simple guide for using custom CSS stylesheets in README, and added a new help button in custom CSS row.

You can check a guide here: https://github.com/tfuxu/improved-workspace-indicator/tree/custom-css#how-to-use-custom-css-stylesheet

And here's help button in preferences:

[tfuxu]

@MichaelAquilina Could you change a URL in: https://github.com/MichaelAquilina/improved-workspace-indicator/blob/b2fcbc48c0e32b1221f62d4da4aeac62a5a460a0/prefs.js#L214

To https://github.com/MichaelAquilina/improved-workspace-indicator/blob/main/docs/how_to_custom_css.md?