Closed yaycupcake closed 1 year ago
Can You do a bigger screenshot because I cannot reproduce it and maybe I'm not looking at right place? This is what I see at my browser: It looks fine but completely different that Your's. Is this because of new layout? New version should correct all issues with new Youtube layout but I'm not sure if everyone has new layout already.
I'm on the newer layout, which I didn't opt into or anything. Might be some AB testing. That said, this is just the controls right under the video. Also, it was working perfectly fine until earlier today, and I've had that new layout with the more rounded buttons since maybe a week or so ago now. Catppuccin was working fine on it for that time. What I see in your screenshot is how YouTube used to look for me, so maybe your account just didn't get the update yet...?
It looks like this other issue is the same as mine, just using a different theme: https://github.com/catppuccin/youtube/issues/21 Seems the issue may persist across all themes?
Same issue on Mocha
This is my fix:
- .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled,
+ .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled {
+ color: var(--second-background)
+ }
.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal,
tp-yt-paper-button.ytd-subscribe-button-renderer {
- color: var(--second-background) !important;
+ color: var(--yt-spec-text-primary) !important;
}
My YouTube setting is on light theme. I have been using Catppuccin Latte for months with no issue, but today the style got updated, and seems to have broken the contrast on buttons below the video player, including the subscribe button.
YouTube with no extra CSS, for comparison:
YouTube with Catppuccin Latte:
YouTube with a band-aid code fix that I wrote, that is what I would expect it to look like:
The code I used in an extra style to band-aid patch the issue:
I'm unsure which color(s) would be ideal for usage out of the Catppuccin palette, or if this is pulling the correct color with that variable (I haven't had a moment to dig into the code myself to see what's what) but hopefully the selectors (which I just pulled out of the inspector) should help make it easy to fix. I think it's actually just the second one that matters in this case -- again, I just did a quick band-aid fix and grabbed the entire selector from the inspector.
Let me know if any further context is needed, I'd be happy to provide any information I can. Thanks.