[Bug Report] Message components buttons not colored

[20Alexanderxx]

Did You Search Other Issues?

• [X] I have checked other issues

Describe The Bug

the buttons from the discord message components aren't colored accordingly to discord.

Reproduction Steps

1. get some buttons i guess
2. see the missing buttons: primary, secondary, success and link
3.
...

Screenshots

Buttons with ClearVision:

Buttons without ClearVision:

Additional Context

i saw the old bug report of the topic, but this is a few months old and the buttons are getting more and more importance, so if it is noww working as intended, it would be great to have an option to enable custom button colors or stay with the main one

[NyxIsBad]

We'll implement success, although I think that secondary and link are not necessary for now

[Leozard]

success button will be looked into, other buttons are working as intended

[20Alexanderxx]

i think secondary buttons are important, as they e.g show some things that are more important than others like in our example: they show what categories are required and still need some working...

[NyxIsBad]

First, let's remove Link from consideration because I don't have a variable for that and I think it's pretty obviously indicated by the link icon ~

As for secondary, while I do see your point, I believe that the usage of secondary is minimal enough that it's not worth the effort of fixing. It's effort because we don't have a secondary main color - we only have main color, success, and danger defined as accent colors. There just wasn't enough usage for a secondary main color, and we won't use the default discord grey for this.

While we could also theme this using some spin off of main color by applying some filter or some one off color, this would be bad precedent and design (only exists in one place, I'd rather not have isolated one off usage of colors).

Using these lines of reasoning, I am going to decline to theme link and secondary buttons. Of course, if usage of secondary buttons becomes significant enough that this matters, this is certainly worth reconsidering.

I do appreciate the effort put into submitting this request though!

[NyxIsBad]

I will leave this issue open for discussion,

Success was added in https://github.com/ClearVision/ClearVision-v6/commit/541d79f7233d5698fa40656fb2ff29f26a6fe27d

[20Alexanderxx]

Ok, I understand your point. Would it be obvious in the config, on how to add this for myself if I want to do so? In that case it seems like a solution that would satisfy both sides?

[NyxIsBad]

Ok, I understand your point. Would it be obvious in the config, on how to add this for myself if I want to do so? In that case it seems like a solution that would satisfy both sides?

If you want to mess with a fork of the repo directly, you're going to want to edit button.scss. Remember that this is in scss and you will need a precompiler

See line 32 for the format, secondary buttons are class %buttonFilledGrey or .lookFilled-yCfaCM.colorGrey-2iAG-B. Example,

...
%buttonFilledRed {
    background-color: cv("colors.danger");
}
%embedContainer %buttonFilledGreen {
    background-color: cv("colors.success");
}
//This
%embedContainer %buttonFilledGrey {
    background-color: grey;
}
%buttonFilledWhite {
    background: hsla(0, 0%, 100%, .1);
    > %buttonContents {
...

If you want to just use custom css,

.container-2sjPya .lookFilled-yCfaCM.colorGrey-2iAG-B {
  background-color: grey; /*change this to whatever the color is */
}

If you are further unfamiliar with how to edit your own preset/theme/fork of the repo, join our discord support server and I'll help you there, since it's probably not the best place to do this over github issues

[20Alexanderxx]

Yeah, seems fine. I guess, this has served its purpose now. Thanks!