CapnKitten / Material-Discord

Material design theme for Discord
343 stars 153 forks source link

Color issues with Material You enabled #204

Closed s1nnohlakes closed 4 months ago

s1nnohlakes commented 4 months ago

I'm not sure if this change was intentional or not, but recently, I've noticed that texts and other elements are kind of hard to read when I'm using the Material You addon. The text and other elements used to be much more white-ish than the background, but recently it has sort of blended i, making it harder to read/notice. And yes, I am aware I'm using a gray palette for this, but it didn't affect anything before.

Screenshots: Before After
image Screenshot_155
Screenshot_156 Screenshot_157
CapnKitten commented 4 months ago

I changed the text variables to have a shade of the accent color in Material You, but since this is all just CSS, there's no way to check for how light or dark one's accent color is. The code below will revert the text color changes until I get it more dialed in. Placing it in the theme anywhere below the Material You import should work.

.theme-dark {
    --menu-item-text-color: hsl(0,0%,76%);

    --card-header-text-color: hsl(0,0%,93%);

    --channels-default: var(--primary-360);
    --channel-icon: var(--primary-400);
    --interactive-active: var(--white-500);
    --interactive-normal: var(--primary-330);
    --interactive-muted: var(--primary-500);

    --header-primary: var(--primary-130);
    --header-secondary: hsl(0,0%,92%);

    --text-normal: var(--primary-230);
    --text-muted: var(--primary-360);
}
CapnKitten commented 4 months ago

Scratch that, restart your Discord to get an update I just pushed and use the following code to adjust the text lightness. A higher number will result in a brighter text color, and vice versa.

.theme-dark {
    --text-lightness-modifier: 1.0;
}
s1nnohlakes commented 4 months ago

Thanks for providing an option! I figured it actually was intentional, and I'm glad I can change it. Looks much better now. Marking this issue as resolved.