Message Window colors aren't contrasting in dark themes

[carlos157oliveira]

I have noticed that the colors for the message window (comprising status, compiler, messages, scribble and terminal) are hard-coded. I think it is possible to do some basic calculations to detect light and dark themes and set the colors for the messages accordingly. I will be trying to fix this issue.

[elextr]

Colours are configurable, see the manual

[carlos157oliveira]

Wouldn't it be nice to implement an functional default for dark themes?

[carlos157oliveira]

I have tried to use @media (prefers-color-scheme: dark), but it says

(geany:17276): Geany-WARNING **: 18:47:50.165: Failed to load custom CSS: geany.css:1:0unknown @ rule

Maybe it is a gtk version thing. Since it must be configured through CSS, i don't think it is a good idea change the source code to implement dark defaults. Would someone have a idea?

[elextr]

Yes, you need to check what your particular GTK version supports.

The basic premise is that (apart from the editor window) all theming should use the normal GTK mechanism, so having code play with colours is a "bad idea"™. Anything that doesn't is a bug.

Of course that leaves Geany users at the "mercy" of the desktop theme creators, some of which are fine (Linux Mint dark themes work for me), and some of which are clearly mad :). But thats the way the project has decided to go.

Improvements to Geany GTK CSS are welcome so long as they work with many common themes (particularly those used by the Geany contributors) and don't need bleeding edge GTK versions.

[carlos157oliveira]

Even when I use stable dark themes, the colors aren't that good to be read for me. I have looked some other mechanisms, but it would involve advanced GTK versions and a little bit of code tweak. I thought i would be able to contribute to Geany project, but it may have to be a next time.

[elextr]

Thanks for the offer, I guess advanced GTK versions can be required so long as the CSS is properly guarded so olde versions ignore it and don't give errors.

I'm no expert on GTK CSS and I don't know if it can determine if a theme is "dark" to only apply in that case, but perhaps its possible. Clearly applying dark colours when the theme is light might not work either.

Note that Geany loads its own CSS file so it overrides the system CSS and so users don't have to wrangle the system CSS files.

[codebrainz]

Duplicate of at least #1376, #1737, #2293, etc.

[b4n]

One workaround that has been implemented in e.g. MATE's file manager Caja is the ability to load custom CSS based on theme name. E.g., we could imagine try and load geany-$THEME.css, if it exists. That would clearly not be perfect, but could allows us (or the user) to provide support for some specific themes.

Ideally themes would support Geany's custom classes (given we did that properly, but I think we did), but that's probably a tiny bit unlikely.

This said, you could also possibly make a custom theme in your user's dir, import the original CSS, and add a couple of rules for Geany's own stuff, that might work as well.

[carlos157oliveira]

I had a idea. It would involve a little bit code. As my original idea, we would do some basic calculations to detect light and dark themes through GtkStyleContext, then load geany.css or geany-dark.css accordingly. I think this solution is more maintainable than caring for every theme. It wouldn't add colors that are beautiful in the current theme, just colors that are easy to read. If the user wants, he would still tweak the css in a similar fashion as current implemented.

[codebrainz]

I wonder if it's possible to access the colours based on GtkMessageType like GtkInfoBar does, so they come from the theme? This is sort of like web CSS frameworks that provide basic colours for ex. warning, danger, primary, etc.

[b4n]

I think there are style classes for that yes.

[elextr]

I wonder if it's possible to access the colours based on GtkMessageType like GtkInfoBar does, so they come from the theme? This is sort of like web CSS frameworks that provide basic colours for ex. warning, danger, primary, etc.

Good idea for the default if no user custom colour is defined in geany.css

[b4n]

@elextr well, yes and no; in theory you can't really get any color from CSS, as there might not be any -- could be image, gradient or whatnot, although it's less true for text. What you would normally do is use the appropriate CSS class and it'd be styled the right way whatever that is. In this case maybe we could indeed do so with reasonable expectations, not sure.

[elextr]

@b4n, ok, so long as whatever mechanism is simple for users to override if the theme is inappropriate, not all themes are done well, and when it comes to colours peoples vision differs markedly.

And the override is documented in the Geany manual!!! [getting in ahead of time]

[carlos157oliveira]

I thought of something. I guess people in this community are really geek and like to tweak a CSS file. But I believe most users of dark themes don't really want to think of colours to customize geany.css so the contrast between the letters and background is reasonable. My solution would be to add comments to the CSS file so that the users of dark themes only have to uncomment to have a functional contrast.

[codebrainz]

My solution would be to add comments to the CSS file so that the users of dark themes only have to uncomment to have a functional contrast.

I guess that still has the problem that we have no idea what GTK+ theme the user will choose, so it's not really possible to pick properly contrasting colours.

[carlos157oliveira]

I guess that still has the problem that we have no idea what GTK+ theme the user will choose, so it's not really possible to pick properly contrasting colours.

Its true, but we can pick bright colours instead of the dark ones currently implemented. Its very likely that it will give a contrast that is acceptable to use with dark themes (if it is beautiful or not, I don't judge). As a last resort, the user can still edit the CSS file. To complicate a little more, we can mount these ready-to-use themes to give more options too. If one isn't suitable, comment it and uncomment the next in the CSS file.

[codebrainz]

Real CSS has a property like this:

filter: invert(1) hue-rotate(180deg);

But since GTK+ CSS is not real/complete CSS, I doubt it works.

[carlos157oliveira]

I will leave it here in case it helps someone. I am using the following style in my geany.css:

#geany-compiler-error {
    color: #FF7987;
}

#geany-compiler-message {
    color: #DFDBFF;
}

#geany-compiler-context {
    color: #FEC0E0;
}

It has been easy to read the compiler messages on the dark themes I tested it with.

[JLuc]

I can't read the first line of a search result in the Message pane due to low contrast on ubuntu with dark theme (dark blue on black, see screenshot on https://github.com/geany/geany-themes/issues/40#issuecomment-1115851929)

It's a chance I coud ALSO change the Message's pane's colors (so as to change the first line to light blue instead of darkblue) using @carlos157oliveira's explained here hack.

Used CSS selectors mention "compiler" but these are also efficient for other not-compiler panes.

NOTE : "Tools / Update configuration" had no effect. I had to close and restart geany for the new css to be activated.

[kavaiyy]

Colours are configurable, see the manual

No info on that issue, except section "Customizing Geany's appearance using GTK+ CSS" [1] in which there are 8 IDs (geany-compiler-context, geany-compiler-error, geany-compiler-message, and etc.). So the question which IDs and classes should I use to change background colors of the message window (comprising status, compiler, messages, scribble and terminal) and tree view for the files, If threre are some ?

For example, I can with ID #geany-compiler-message { color: #MyCustomColor; } change color of the text, but I can't the same way change background-color #geany-compiler-message { backround-color: #MyCustomColor; }. Is any way to change these colors, except by changing theme on OS ?

1. https://www.geany.org/manual/current/index.html#toc-entry-190

[elextr]

If the OS theme can change it then geany.css should be able to change it, its "just" a matter of divining what selector to use. Unfortunately when the UI was created in Glade the widget names were left at the default so "treeview3", "treeview4", and "treeview5" are respectively the status, message, and compiler window contents. You could try those.

Changing the names now would break every use of them, in Geany, in Geany plugins, and in external plugins we can't see. Essentially nobody is brave enough :wink:.

The compiler colours are handled differently because Geany parses the messages to detect errors and warnings and sets colours for individual messages to match, so CSS cannot be used since it doesn't know which message is which, and named colours are provided for Geany to apply by code. But only the foreground colour is set that way.