CTalvio / Ultrachromic

The final form, the true evolution of the chromic theme saga!
MIT License
609 stars 36 forks source link

[Question] Hosting the theme locally #53

Closed DexLuther closed 2 years ago

DexLuther commented 2 years ago

This theme is beautiful. I love all the customizability with all the options. The only small issue is that when using it, it adds a small delay to every page load, which gets mildly annoying.

I've saved the files and then changed the import URLs to local paths. (ex: @import url('D:\Jellyfin\Jellyfin CSS\fixes.css');) When doing this, some things work, but other things such as setting accent color and transparent header don't seem to want to work.

Are there plans to provide a version that can be hosted locally on servers and/or is there a way to do it correctly?

CTalvio commented 2 years ago

That should work, I think, but not everywhere. It's not the server that loads the external resources and sends them to the client, but the client that loads them directly.

That means a file path like that will only work when accessing the server on the very machine on which it is running. As soon as you go to a phone or another PC, it will try to access a path that leads nowhere.

That said, there is one simple way to do this. Assemble your theme the way you want it, then go through each @import and copy paste the code from behind the URL into a file, one after another, until you have ALL the code for your particular config in one file. You can add accent colors and the other parameters at the end.

Then, copy paste the whole mess into the Custom CSS field in general. Now, the whole theme is stored on the server itself, and will load alongside the Web UI without the client going to a bunch of other URLs to load it up.

This is how the themes I made originally worked.

sambartik commented 2 years ago

Hello Dex, I had a similar issue as you. I went a different route than self-hosting to speed it up even further. I created a nodejs script that resolves all CSS imports, prefixes, minifies styles at build-time. It was meant to use just by me, but you can check it out at https://github.com/sambartik/jellyfin-transpile-branding-css.