python-web-pdb icon indicating copy to clipboard operation
python-web-pdb copied to clipboard

Allow using a different PrismJS Theme

Open cb109 opened this issue 3 years ago • 8 comments

I have added support to choose from the builtin PrismJS Themes, with Okaidia still being the default. Technically it works by serving the css files for each and then adjusting the link.href dynamically when a theme is chosen, which is the same thing the https://prismjs.com/ website is doing.

Peek 2022-01-07 15-02

Let me know your thoughts, if this is something you could imagine to merge. I tried following existing coding conventions, but am happy to change anything if it helps adoption. I would also love to "remember" the chosen theme e.g. in localStorage, but since that's not done yet for anything else I thought I'd ask first.

Thank you for the tool, I :heart: it.

cb109 avatar Jan 07 '22 14:01 cb109

Thanks, I'll check it. BTW, you should add your name in the copyright notice of the new .js file.

romanvm avatar Jan 10 '22 09:01 romanvm

No idea why the 3.10 tests fail, as I haven't touched any of the backend, maybe you can have a look as currently it's not possible for me to easily test 3.10 on my machine :bow:

cb109 avatar Jan 11 '22 09:01 cb109

Regarding the failing 3.10 test, it's a know issue that I haven't been able to resolve yet. I guess I need to mark this test as skipped until I have enough time to investigate it.

romanvm avatar Jan 11 '22 11:01 romanvm

Sorry for the late reply. I've checked your PR. Looks intetesting. The only minor issue that I've noticed is that a mouse cursor inside the theme selection dropdown is a textual one (a vertical line) instead of a pointer (an arrow). Could you check this?

romanvm avatar May 08 '22 14:05 romanvm

Good catch, I did not notice that. It was because I did not use any href on the anchors and bootstrap 3 styles them a little differently then. It is probably debatable whether for javascript-anchors a href="#" or href="javascript:void(0)" or just omitting it and using some additional css is the best approach, I picked the latter for now. Let me know if there is more I can do 👋

cb109 avatar May 08 '22 16:05 cb109

I'm having some trouble fixing the conflicts, likely cause I am using a different nodejs version to run the npm dependency solver and build command (node 17.x seems bugged on windows, had to downgrade to 16.x). What nodejs and npm versions are you using exactly? Maybe using the same version and running the commands again will fix it.

cb109 avatar May 19 '22 20:05 cb109

Could you merge the current master into this? FYI: I'm using node v16.17.0 with the latest changes.

romanvm avatar Aug 23 '22 08:08 romanvm

@romanvm I did my best to resolve all conflicts, on my side the build looks good, using the same node version as you v16.17.0. I have added all build artifacts from the frontend to git, which means the themes are there as well, I hope that was correct. I would love to add that the web UI "remembers" my last theme choice, maybe via localStorage, what do you think?

EDIT: There seems to be a slight library conflict regarding [email protected] only being compatible with webpack 4.x but we are using 5.x. I was able to build by running npm run build --legacy-peer-deps anyway 🤷‍♂️

cb109 avatar Sep 07 '22 19:09 cb109