jesus2099 / konami-command

power‐ups for various web sites
117 stars 25 forks source link

remove style from script #825

Open jerry-sileon opened 1 month ago

jerry-sileon commented 1 month ago

I would suggest removing any styles from the script. Functionality and UI should be separated, so style scripts (dark mode etc.) can focus on the UI part. There are several places in the script where elements are added with hard-coded styles. These should be removed, replaced by the css variables that are already available in the MB style (although there are not a lot yet) or existing classes. This also applies to the settings page which is quite unreadable when MusicBrainz Dark is installed, for example.

jesus2099 commented 1 month ago

Thank you for this ticket. Could you add some pictures of the culprit elements?

I don't think I can use variable because I guess, but didn't check yet, that they are some .less variables, that are later converted to .css values, at run time.

But I can use MB classes. I usually do so, but mostly in more recent scripts and also I don't use a dark mode CSS. Do I didn't include these tests in my mind, yet.

kellnerd commented 1 month ago

FWIW, this is how the settings look like with my userstyle companion: image But I have to use !important a lot to make some userscript elements readable at all. Maybe these are a good indicator where you can start looking for possible improvements.

jesus2099 commented 1 month ago

Thanks @kellnerd, I didn't find those css variables/custom properties like --background-accent. Neither in my devtools (F12) nor in https://github.com/search?q=repo%3Ametabrainz%2Fmusicbrainz-server%20background-accent&type=code Where are they? :) I'm sure I didn't search well enough...

kellnerd commented 1 month ago

Oh sorry, these are only defined in my userstyle, I should have mentioned that. I don't think MBS makes use of CSS variables in its bundled CSS currently.