search

Tech-How / Light-Theme-for-YouTube-Music

A refreshing new look for YouTube Music.
23 stars 2 forks source link

problem with shadows #2

Closed kikiyoi closed 1 year ago

kikiyoi commented 2 years ago

image can you then change the title to black？

Tech-How commented 2 years ago

Hi! I've actually already replaced the logo. You can update to the latest version here, it should fix it. https://github.com/Tech-How/Light-Theme-for-YouTube-Music/releases

Also, I see the shadow issue on the artwork. Can you let me know which browser you're using? Also, if the logo isn't fixed, can you see if your computer can reach this page? https://i.ibb.co/DLjn7YZ/ytm-logo-beta.png

kikiyoi commented 2 years ago

Hi! I've actually already replaced the logo. You can update to the latest version here, it should fix it. https://github.com/Tech-How/Light-Theme-for-YouTube-Music/releases

Also, I see the shadow issue on the artwork. Can you let me know which browser you're using? Also, if the logo isn't fixed, can you see if your computer can reach this page? https://i.ibb.co/DLjn7YZ/ytm-logo-beta.png

Thank you for your reply The version I am using is the latest version I use google chrome（102.0.5005.49 beta ） The logo link can be accessed normally

Tech-How commented 2 years ago

Ok, thanks for the info. When you installed the theme, did you install it with the Stylish extension from this page, or did you use a different style manager?

kikiyoi commented 2 years ago

Ok, thanks for the info. When you installed the theme, did you install it with the Stylish extension from this page, or did you use a different style manager?

Yes，But in home page，shadow normal Problems only on the play pagee 01 02 03

Tech-How commented 2 years ago

Hmm... I see what's happening. It looks like something is pushing the borders or margins of the album artwork. I can't seem to replicate this, and I've never seen this happen before, but here are some things I would try:

As for the logo, my first thought was that a different style extension was being used, since it does misbehave with other extensions. But it is the official extension, so I thought it could be a firewall or anti-virus, or network filtering? Although this wouldn't make much sense if the link can be accessed normally. The "ibb.co" link I sent earlier is where the theme points to for the logo. The theme works by hiding the actual logo and replacing it though, so it's crazy that my code that hides the logo doesn't work for some reason 🤔

If all else fails, you could remove the artwork shadow from the player page like this: https://drive.google.com/file/d/1ycFnvw0mSZBqqPXFfdCzt6fz_Yk0UVx4/view?usp=sharing

I'll definitely leave this open and update the thread if I'm able to re-create the issue sometime!

kikiyoi commented 2 years ago

Hmm... I see what's happening. It looks like something is pushing the borders or margins of the album artwork. I can't seem to replicate this, and I've never seen this happen before, but here are some things I would try:

  • Make sure the page zoom is set to 100%
  • Check if any other chrome extensions modify websites, like any YouTube extensions or themes
  • Try on another computer or another browser

As for the logo, my first thought was that a different style extension was being used, since it does misbehave with other extensions. But it is the official extension, so I thought it could be a firewall or anti-virus, or network filtering? Although this wouldn't make much sense if the link can be accessed normally. The "ibb.co" link I sent earlier is where the theme points to for the logo. The theme works by hiding the actual logo and replacing it though, so it's crazy that my code that hides the logo doesn't work for some reason 🤔

If all else fails, you could remove the artwork shadow from the player page like this: https://drive.google.com/file/d/1ycFnvw0mSZBqqPXFfdCzt6fz_Yk0UVx4/view?usp=sharing

I'll definitely leave this open and update the thread if I'm able to re-create the issue sometime!

Thank you very much！

kikiyoi commented 2 years ago

Ok, thanks for the info. When you installed the theme, did you install it with the Stylish extension from this page, or did you use a different style manager?

Hei.I have a new discovery When i log out, problem disappears But Just log in，problem reappears In the end, logo question solved，I switched from Chinese to English in the settings, the problem is solved https://drive.google.com/file/d/14G2d5fERG-fJBvHOP5LD-vB3IACt64lI/view 1

Tech-How commented 2 years ago

Wow, that's interesting. I actually tried switching my browser to Chinese earlier figuring it would be larger and push something out of the way, but it didn't work for me. Glad it's resolved!

LucasN0611 commented 1 year ago

Hi, I'm having the same issue. When I'm logged out, the shadow looks fine, but once I log in the grey square around the album art is back. I've disabled all other extensions and tried another browser but it's still there.

Tech-How commented 1 year ago

Thanks for bringing this to my attention. I'll investigate this soon and try to find a solution. Do you mind telling me if you are on Windows or Mac, and which browser you're using? Also, do you have YouTube Music Premium?

LucasN0611 commented 1 year ago

I'm on Windows, using the latest version of Chrome and I do have Premium

Tech-How commented 1 year ago

This appears to be a margin error with the audio/video switcher, which is only available to premium users. Could you try installing this beta theme to see if it resolves the issue while logged in? Just make sure to uninstall the current style first: https://userstyles.org/styles/256419/beta-style-82010475039

And could you also screenshot the result?

LucasN0611 commented 1 year ago

That doesn't seem to work either, it just leaves the switcher dark

image

Tech-How commented 1 year ago

I see. I've updated the beta style in that link, could you try updating it and seeing if that makes a difference? Also I apologize for the audio/video switcher, I don't have premium myself so I'm not able to style that element at the moment.

LucasN0611 commented 1 year ago

That didn't work either. It completely removed the audio/video switcher though and defaults to playing video sometimes, it seems like randomly

Tech-How commented 1 year ago

I don't think it would default to playing video, that usually happens if you click the "top result", or if you click on a song from the official album page it will play the video. If you click the song under the songs tab via search it will play the song. I removed the audio video switcher for the time being because I don't have the necessary resources to style that element, but the new fix should remove the gray border around the album artwork. Does it fix that on your end, or is the gray border still there?

LucasN0611 commented 1 year ago

No, the grey border is still there

Tech-How commented 1 year ago

If you right-click on that border and select inspect, you should get a DevTools window to open. In the bottom you should see a styles pane similar to the one below. Could you send me a screenshot of that? It should have the element that is causing problems. image

LucasN0611 commented 1 year ago

image

Tech-How commented 1 year ago

That's odd, the second yt-img-shadow property is the one I forced to be transparent in hopes to fix it, but it appears it did not. I've updated the beta style to have it remove shadowing and rounded corners until I'm able to get a premium subscription and investigate this further. You can install that for now if you'd like, I hope to get this fixed eventually.

LucasN0611 commented 1 year ago

I think I've fixed it. After messing about in the styles menu, I found that there are two backgrounds. I made the one you forced to be transparent red here, but there is still a bit of grey in the corners: image

I went up a few elements and found the other background there. And when I made both of them transparent, it seemed to be working: image

Tech-How commented 1 year ago

I see! I actually noticed the second overriding "ytmusic-player" class earlier, but I can't get the CSS to dynamically change it, however I can get it to change by manually setting it in the DevTools window. I'll update this as soon as I can get it to be changed by means outside of inspect element.

LucasN0611 commented 1 year ago

I think I figured it out; I just added this to the theme and is seems to be working fine now.

ytmusic-player {
    background-color: transparent;
}
Tech-How commented 1 year ago

Interesting, when I had tried that in Stylish it didn't carry over to the DevTools window, it was either crossed out or kept the default. I just updated this beta style again, do you mind confirming that this without any extra tweaks, works and solves the issue? Then I can get it pushed to the main update channel. Cheers! 🙌

https://userstyles.org/styles/256419/beta-style-82010475039

LucasN0611 commented 1 year ago

Yeah, that works. Thanks for taking the time to update it!

Tech-How commented 1 year ago

Yeah and thanks for your cooperation! I'll release version 1.8 in the near future and include some other fixes hopefully.