Use colors from the system colorscheme for the Task Manager's accent color in Breeze Light/Dark desktop themes
Closed, ResolvedPublic

Description

The Breeze Light/Dark desktop themes' highlight, hover, positive, neutral and negative colors are set in their colors files. If those colors came from system colorscheme, then the user could customize the look of their desktop even more, without needing to make a custom desktop theme. The BackgroundAlternate, BackgroundNormal, ForegroundInactive and ForegroundNormal colors would remain since the Breeze Light/Dark desktop themes are meant to force a light or dark color for widgets and panels.

Strange I thought it use the color from the scheme

This is just for the accent colors used on the Task Manager.

Anyway, +1, we should do this. It should actually be pretty easy since I believe the SVGs already have support for reading data from the color scheme. So maybe all we need to do is wire that up rather than using a hardcoded color.

@ndavis, do you know if this is possible?

ngraham renamed this task from Allow user to change Breeze accent to Use colors from the color scheme for the Task Manager's accent color.May 20 2019, 5:00 PM
ngraham triaged this task as Normal priority.

I'm not sure if the taskbar is the only place that is hardcoded, it's the only one I tracked down manually.

Here are examples of how Windows 10 generates a palette based around the selected accent color and MacOS also slightly adjusts the colors, both lets user select the accent color.

Ideally we would have an accent color picker in KCM and lighter and darker shades can be generated automatically. (Of course all configurable)

I agree that a more user-friendly way to choose the "accent color" would be nice. A simple enough UI for this would be to add a combobox to the top of the colors KCM that maps to the current theme's highlight color and allows that to be quickly changed without editing the theme.

As usual, we've had this feature for ages, it's just not exposed as nicely in the UI as it could be.

Anyway, +1, we should do this. It should actually be pretty easy since I believe the SVGs already have support for reading data from the color scheme. So maybe all we need to do is wire that up rather than using a hardcoded color.

@ndavis, do you know if this is possible?

Actually, it should work already. It's possible that the stylesheets don't work on transparent elements. For instance, here's the code for the blue bar that is used for the focused application:

<g
    id="focus-top"
    transform="matrix(1,0,0,-1,0,51)">
    <rect
        class="ColorScheme-ButtonFocus"
        transform="scale(1,-1)"
        style="opacity:0.72000002;fill:currentColor;fill-opacity:1;stroke:none"
        id="rect4997-3-9"
        width="26"
        height="2"
        x="5"
        y="-28.000002" />
    <rect
        y="-29"
        x="5"
        height="1"
        width="26"
        id="rect4999-2-9"
        style="opacity:0.72000002;fill:currentColor;fill-opacity:1;stroke:none"
        transform="scale(1,-1)"
        class="ColorScheme-ButtonFocus" />
</g>

Actually, the opacity and stylesheets work fine for the drive-multipartition icon. Maybe the stylesheets don't work because of the conflicting opacity and fill-opacity values? Maybe it's opacity in particular that's the problem? drive-multipartition uses fill-opacity.

Tangentially related: This article on designing systemic colours explores some of the challenges faced with colour design. Example implementation in JS

I mention this because in the theming documentation it's not defined in terms of accent and a palette around it but as distinct colors, to get the desired effect we would need some code to generate a palette.

ndavis added a comment.EditedMay 20 2019, 9:13 PM

Never mind, turns out they worked fine from the start, so opacity was never an issue and they weren't hardcoded. @lavender I'm not sure what you're actually requesting now. Are you asking for a utility that will generate colorschemes that are based around a single color?

If you change the colour scheme the taskbar among others don't change with it, that's what he OP is about.

Hmm, I just tested this out again and it's working as expected in Plasma 5.15.5:

Are you using an older Plasma or Frameworks version, perchance?

It seems that it works with Breeze but not Breeze Dark, which stays blue regardless of color scheme. I am on Plasma 5.12 LTS admittedly.

ndavis added a comment.EditedMay 20 2019, 10:39 PM

It seems that it works with Breeze but not Breeze Dark, which stays blue regardless of color scheme. I am on Plasma 5.12 LTS admittedly.

This is because the Breeze Light and Breeze Dark desktop themes come with their own built-in colorschemes. If you want your desktop theme to be the same as your system colorscheme, use Breeze, even if you're using a dark colorscheme.

The reason why there are 2 desktop themes with built-in colors is that a user may want to have something like a dark panel with light applications.

ngraham closed this task as Resolved.May 20 2019, 11:04 PM
ngraham claimed this task.

Sounds like this is one of those "Behaves Correctly" situations, but where we can make it more obvious because it's too complicated. Given that we now have Look And Feel packages, I wonder if we even need to keep around the separate Breeze Light and Breeze Dark Plasma themes anyway. Maybe what might make more sense is to just have a single "Plasma" theme that follows the colors in the color scheme by default, with a semi-hidden advanced option to have differing color schemes between Plasma and Apps.

Is there any reason Breeze Dark couldn't follow the color scheme just as Breeze does? Recreating Breeze Dark along with the accent color changes as a Breeze color scheme is a lot of unnecessary work (that I couldn't figure out after having extensively researched it). There should be a user-friendly way to change the main color used by the themes we ship with Plasma.

To answer your previous question; this specific task isn't about a program to generate color palettes, that was an aside as I think it might be worth exploring if we settle on this concept of 'accent color' because usually we would want a few similar colors to indicate different states, we want there to be enough contrast, and so on. I

Is there any reason Breeze Dark couldn't follow the color scheme just as Breeze does? Recreating Breeze Dark along with the accent color changes as a Breeze color scheme is a lot of unnecessary work (that I couldn't figure out after having extensively researched it). There should be a user-friendly way to change the main color used by the themes we ship with Plasma.

There is: just use the "Breeze" Plasma theme, rather than the "Breeze Light" or Breeze Dark" theme. Then it will follow the color scheme. I agree that we need to expose this functionality in a much more user-friendly way.

It seems that it works with Breeze but not Breeze Dark, which stays blue regardless of color scheme. I am on Plasma 5.12 LTS admittedly.

This is because the Breeze Light and Breeze Dark desktop themes come with their own built-in colorschemes. If you want your desktop theme to be the same as your system colorscheme, use Breeze, even if you're using a dark colorscheme.

The reason why there are 2 desktop themes with built-in colors is that a user may want to have something like a dark panel with light applications.

Why does the blue color need to be hardcoded is my question

lavender added a comment.EditedMay 20 2019, 11:17 PM

Is there any reason Breeze Dark couldn't follow the color scheme just as Breeze does? Recreating Breeze Dark along with the accent color changes as a Breeze color scheme is a lot of unnecessary work (that I couldn't figure out after having extensively researched it). There should be a user-friendly way to change the main color used by the themes we ship with Plasma.

There is: just use the "Breeze" Plasma theme, rather than the "Breeze Light" or Breeze Dark" theme. Then it will follow the color scheme. I agree that we need to expose this functionality in a much more user-friendly way.

I'm asking if there was any reason why Breeze Dark has the accent color in the taskbar hardcoded to blue, not if it's possible :) And I understand that people might want a dark taskbar, I do too, but I'm talking about the accent color not the dark background. I want to be able to change the accent color of Breeze Dark by changing the color scheme.

ndavis added a comment.EditedMay 20 2019, 11:21 PM

It seems that it works with Breeze but not Breeze Dark, which stays blue regardless of color scheme. I am on Plasma 5.12 LTS admittedly.

This is because the Breeze Light and Breeze Dark desktop themes come with their own built-in colorschemes. If you want your desktop theme to be the same as your system colorscheme, use Breeze, even if you're using a dark colorscheme.

The reason why there are 2 desktop themes with built-in colors is that a user may want to have something like a dark panel with light applications.

Why does the blue color need to be hardcoded is my question

TBH, I just copied the Breeze Dark colorscheme and pasted it here: https://cgit.kde.org/plasma-framework.git/tree/src/desktoptheme/breeze-dark

Maybe if I removed the color settings for everything except the background and text colors, it would get the rest from the system colorscheme, but I don't know.

It seems that it works with Breeze but not Breeze Dark, which stays blue regardless of color scheme. I am on Plasma 5.12 LTS admittedly.

This is because the Breeze Light and Breeze Dark desktop themes come with their own built-in colorschemes. If you want your desktop theme to be the same as your system colorscheme, use Breeze, even if you're using a dark colorscheme.

The reason why there are 2 desktop themes with built-in colors is that a user may want to have something like a dark panel with light applications.

Why does the blue color need to be hardcoded is my question

TBH, I just copied the Breeze Dark colorscheme and pasted it here: https://cgit.kde.org/plasma-framework.git/tree/src/desktoptheme/breeze-dark

Maybe if I removed the color settings for everything except the background and text colors, it would get the rest from the system colorscheme, but I don't know.

From what I can gather that would work!

ndavis added a comment.EditedMay 21 2019, 12:32 AM

From what I can gather that would work!

It does work, but unlike the Breeze desktop theme, changing the colorscheme doesn't work right away. You have to set the colorscheme, then either change to a different desktop theme and change back or restart plasmashell. I suppose it wouldn't hurt to make this change though.

filipf added a subscriber: filipf.May 21 2019, 12:39 AM

It would be really cool if we could have some icon that would signalize that a particular desktop theme is color-scheme aware.

ndavis renamed this task from Use colors from the color scheme for the Task Manager's accent color to Use colors from the color scheme for the Task Manager's accent color in Breeze Light/Dark desktop themes.EditedMay 21 2019, 4:01 AM
ndavis claimed this task.
ndavis reopened this task as Open.
ndavis updated the task description. (Show Details)

@lavender

If you want to test the change, extract this archive so that both desktop themes are placed in ~/.local/share/plasma/desktoptheme.

Please report back if you find any problems.

ndavis renamed this task from Use colors from the color scheme for the Task Manager's accent color in Breeze Light/Dark desktop themes to Use colors from the system colorscheme for the Task Manager's accent color in Breeze Light/Dark desktop themes.May 21 2019, 4:03 AM

@ndavis I can confirm that it works

Side note: I've noticed that for some reason changes in the color scheme didn't get registered unless I changed the desktop theme to something else and back

lavender moved this task from Backlog/Planned to Sent to dev on the VDG board.May 24 2019, 1:04 AM
lavender moved this task from To Do to Work in Progress on the Plasma board.

Side note: I've noticed that for some reason changes in the color scheme didn't get registered unless I changed the desktop theme to something else and back

Yes, I mentioned that already.

@Zren Since you have experience with https://github.com/Zren/plasma-applet-alphablackcontrol I'm interested in your thoughts about how it could be upstreamed in some form. Eventually we can maybe get to an experience like we were talking about:

Here are examples of how Windows 10 generates a palette based around the selected accent color and MacOS also slightly adjusts the colors, both lets user select the accent color.

Ideally we would have an accent color picker in KCM and lighter and darker shades can be generated automatically. (Of course all configurable)

If you're interested we can move this into a new task and hash it out, I have some more ideas about how to expand the colors KCM module and how we can tie that into themes/Breeze

Zren added a comment.May 30 2019, 1:00 AM

The widget basically switches to breeze-dark by editing ~/.config/plasmarc, waits a few seconds, then switches back to breeze-alphablack.

https://github.com/Zren/breeze-alphablack/blob/master/desktoptheme.py#L176

Ideally, a dbus signal would be created to force the current desktop theme to reload without needing to switch to a 2nd theme. You'd have to make sure it notify's plasmashell, krunner, latte-dock, etc as they all use plasma theme SVGs. We need the QML Plasma SVG to re-generate the stylesheet injected into the SVG.

To have a separate accent color for the panel we would need to create a new desktop theme in ~/.local/share/plasma/desktoptheme/. We'd need to first create:

  • .../desktoptheme/BreezeCustom/metadata.desktop which should inherit default, just like like Breeze Dark.
  • .../desktoptheme/BreezeCustom/colors which is generated from our accent color.

Then switch to BreezeCustom if we're not already using it.