8 hours ago
Hi:
I was tweaking some things of Jellyfin-web's source code just for aesthetic purposes, and wanted to know if this can be done.
I like the JF's logo that is displayed when connecting to my server (Splash logo), so I don't want to change it, but I want it to fade in, and also to be larger (so that it looks like an animation of a larger logo fading in).
I managed to modify the index.html file before building from source, increasing the width of the banner-light... png to 100% and added an animation line with ease-in. I built from source once modified, and it works just as expected (the JF logo is displayed on the entire screen and smoothly fades in before going into the UI), but only when I use build:development when building. If I use build:production, it doesn't work and the logo is displayed as always (no fade in and it's a lot smaller).
The code must be ok since it works exactly as expected with build:development, but is there a way to accomplish the same using build:production? I understand build:production optimizes JF web for general use (and it shows, the UI seems more responsive with production and also it's half the size), and I don't want to lose those optimizations by using build:development. I don't know why the index.html file is "processed" differently when using build:production, but apparently it doesn't have to do with the pngs, since they (and their resolutions) are preserved with either build:development and build:production, it's just that my modded index.html doesn't appear to have any effect with build:production. Or is that a limitation of production because it could impact performance somehow?
Thanks in advance!
I was tweaking some things of Jellyfin-web's source code just for aesthetic purposes, and wanted to know if this can be done.
I like the JF's logo that is displayed when connecting to my server (Splash logo), so I don't want to change it, but I want it to fade in, and also to be larger (so that it looks like an animation of a larger logo fading in).
I managed to modify the index.html file before building from source, increasing the width of the banner-light... png to 100% and added an animation line with ease-in. I built from source once modified, and it works just as expected (the JF logo is displayed on the entire screen and smoothly fades in before going into the UI), but only when I use build:development when building. If I use build:production, it doesn't work and the logo is displayed as always (no fade in and it's a lot smaller).
The code must be ok since it works exactly as expected with build:development, but is there a way to accomplish the same using build:production? I understand build:production optimizes JF web for general use (and it shows, the UI seems more responsive with production and also it's half the size), and I don't want to lose those optimizations by using build:development. I don't know why the index.html file is "processed" differently when using build:production, but apparently it doesn't have to do with the pngs, since they (and their resolutions) are preserved with either build:development and build:production, it's just that my modded index.html doesn't appear to have any effect with build:production. Or is that a limitation of production because it could impact performance somehow?
Thanks in advance!