macfeaster/play-music-black

Style seems to be broken as of late.

Closed this issue ยท 9 comments

vhns commented

The style seems to no longer be working properly. Pic related.
image

Used it last night, works fine ๐Ÿ™‚ How did you install it, what browser do you run it in?
Unless they have rolled out changes to a few users really recently, nothing has really happened with GPM for the last year or so.

vhns commented

Thanks for answering! I'm using the Stylus extension (version: 1.5.6) on Firefox ESR (version: 68.2.0). I installed it through Github using the "Install with stylus" button.

Could you try to to debug using web inspector why e.g. the drawer is partially white? There is a style rule for it, and it works great in Chrome. You write "as of late", did you use this before? Are the class names different for Spanish? ๐Ÿ˜‚

vhns commented

Did you use this before?

I used to use it and it seemed to work fine up until 1-2 months ago. (Only got around to opening an issue now)

Could you try to debug using web inspector?

I don't really know how to use it/what to look for but I'd be glad to try and help if you can help me figure out what to look for. This is what I could get out of "styles" when inspecting that section (sorry if this doesn't really help) https://p.teknik.io/0UNW1

Are the class names different for Spanish?

I am using it in Portuguese and AFAIK they aren't.
Just tell me any other info you might need or ways I can help and I'd be glad to do so. I just don't really know much about CSS.

I use Opera 65.0.3467.42 on Linux Mint with Stylus 1.5.5 and I have same problem. Please, fix it!
image

I'm still completely unable to reproduce this, so you'll have to come up with some new/changed selectors if I'm gonna be able to issue a fix ๐Ÿ™‚

@macfeaster, these are the styles that fix this problem for me:

gpm-detail-page-header div.gpm-detail-page-header > [slot="title"] {
    color: #ddd;
}
gpm-detail-page-header div.gpm-detail-page-header > [slot="subtitle"],
gpm-detail-page-header div.gpm-detail-page-header > [slot="description"],
gpm-detail-page-header div.gpm-detail-page-header > [slot="metadata"] {
    color: #bbb;
}
gpm-detail-page-header div.gpm-detail-page-header > [slot="buttons"] {
    color: #bbb;
}
gpm-detail-page-header[description-overflows] #descriptionWrapper.gpm-detail-page-header:hover {
    background: inherit;
}
#drawer.paper-drawer-panel {
    background-color: #161616;
}

Colors are roughly chosen, so you will need to make them better...

@sidelong44 Thanks! Weird thing is that those seem to be just a slightly more general version of some of the current selectors. Thanks anyways, added them to the style now, so hopefully they should accommodate for whatever test/update broke styles for some of you.

@macfeaster
Oh, sorry. I didnโ€™t notice that the styles now work with usercss, and not with the Stylus store.
Everything works great. I'm just inattentive ๐Ÿ˜„

UPD: This is still not all. There are places where the text is not visible.
I'll try to create PR.