dlasagno / vscode-wal-theme

A vscode theme generated with pywal color palette
MIT License
84 stars 18 forks source link

Consider using colors.json instead #11

Closed chrishoage closed 3 years ago

chrishoage commented 3 years ago

I notice that this imports ~/.cache/wal/colors

However this file does not include the "special" section found in colors.json which includes background and foreground.

It would be nice if this theme would import the json and used those properties if they exist to better match the actual background and foreground of the system when applied with wal.

Thank you!

dlasagno commented 3 years ago

I see your point, and I might change this one day, but in the near future probably I won't. If you want, you can send me a PR.

That said, I don't understand what do you mean with 'match the actual background and foreground', could you explain it to me?

chrishoage commented 3 years ago

If you want, you can send me a PR.

It seems like it might be a straightforward change, I'll look into it

That said, I don't understand what do you mean with 'match the actual background and foreground', could you explain it to me?

Sure!

As mentioned, the extension looks for ~/.cache/wal/colors. By default these only include colors 1-16

https://github.com/dlasagno/vscode-wal-theme/blob/ccc84e4944aa7b7512bc7f3c8ffb7cb98c906e78/src/extension.ts#L8

Here is an example of my wal colors file

› cat .cache/wal/colors
#1B2B34
#E15A60
#99C794
#FAC863
#6699CC
#C594C5
#5FB3B3
#C0C5CE
#65737E
#E15A60
#99C794
#FAC863
#6699CC
#C594C5
#5FB3B3
#D8DEE9

However, pywal supports a theme to have non Base16 colors defined, like background, foreground and cursor. These values are typically used for the background and foreground of the terminal, and other tools like polybar which can use pywal themes. Here is a predefined pywal theme that has these properties (though perhaps a poor example, since the bg and color0 happen to match). Pywal lets you override the background by passing -b

Below is an example of my colors.json which references these properties

› cat .cache/wal/colors.json
{
    "wallpaper": "None",
    "alpha": "80",

    "special": {
        "background": "#242B2E",
        "foreground": "#D4D4D4",
        "cursor": "#C0C5CE"
    },
    "colors": {
        "color0": "#1B2B34",
        "color1": "#E15A60",
        "color2": "#99C794",
        "color3": "#FAC863",
        "color4": "#6699CC",
        "color5": "#C594C5",
        "color6": "#5FB3B3",
        "color7": "#C0C5CE",
        "color8": "#65737E",
        "color9": "#E15A60",
        "color10": "#99C794",
        "color11": "#FAC863",
        "color12": "#6699CC",
        "color13": "#C594C5",
        "color14": "#5FB3B3",
        "color15": "#D8DEE9"
    }
}

Note that #242B2E (along with the other "special" colors) are not present in ~/.cache/wal/colors

Now in template.ts it uses color0 and color1/7 for the background/foreground.

https://github.com/dlasagno/vscode-wal-theme/blob/ccc84e4944aa7b7512bc7f3c8ffb7cb98c906e78/src/template.ts#L104-L105

To be more true to a pywal theme one might expect the VSCode theme to use the defined backround and foreground colors

To summarize, the background for VSCode with this theme would be based on #1B2B34 and not #242B2E making VSCode not match the rest of the system that uses #242B2E as a background color.

Hopefully I provided enough context! Please let me know if there are further clarifications I can make :slightly_smiling_face:

dlasagno commented 3 years ago

I know that 6 months passed since the issue was opened, but I'm finally looking back into this since I'm planning an update for the extension anyway. Before implementing this I was wondering what colors 0 and 7 would be used for after being replaced by background and foreground. @chrishoage, could you explain to me how they're used in a setup like yours?

chrishoage commented 3 years ago

They're generally not in my setup. I would imagine colors.json would be used to see if background and foreground are set, and otherwise fall back to the colors pulled from the colors object in colors.json

Looking at some image-generated themes from pywal background and foreground are set to color0 and color7 respectively.

However, pywal still allows these to be set independently from the normal base16 colors, where "black" (color0) can be a different color in the theme for background.

Please let me know if there are further clarifications I can help with!

dlasagno commented 3 years ago

At the moment to generate the theme I pass an array of 16 colors to a template. Do you think that setting colors 0 and 7 to the ones specified for background and foreground(if present) would achieve the desired outcome?

chrishoage commented 3 years ago

That's a good question, I'm uncertain with out seeing it. I think the desired outcome would be things that are "background" colors (e.g. the main editor background, perhaps the sidebar background, statusbar background) would all get the background color. Foreground things (like text, selection, etc) would get the foreground color.

Another thing that might be worth considering is to pull the alpha value from the colors.json and use it for the alpha value for the background colors.

dlasagno commented 3 years ago

Version 1.1.0 is now available and uses the custom background and foreground entries of colors.json.

In the end, I simply changed colors 0 and 7 with background and foreground respectively.