Feature: Enable an option to change the Pico CSS theme

[ruruchiii]

Heya,

I manually edited the css to change the theme but an option or environment variable to set the locally saved Pico CSS stylesheet would be a nice feature.

Thanks!

[C4illin]

Hello! Sounds like a cool idea. What changes or type of changes did you make?

[ruruchiii]

I just overwrote the color variables of the pico lime stylsheet using the stylus extension. I downloaded all the pico stylesheets from their main website and I tried mounting it like this in the compose file after renaming it but that approach didn't seem to work.

volumes :
  - convertx/app/src/public/pico.lime.min.css:/app/src/public/pico.lime.min.css

[ruruchiii]

I just checked the mount path in the container and the pico.lime.min.css file does contain the code from the modified and renamed one on my host machine, however the webpage does not seem to be affected. I tried refreshing everything and clearing the caches.

(I have no idea what I'm doing)

[C4illin]

Now it is a bit easier to customize the default theme! add

volumes:
      - ./theme:/app/src/theme

and then edit the theme.css that will be in the folder

[fruitwerks]

If you just want to do a few overrides and happen to use nginx as a proxy front end, you can do this in the location / block;

        sub_filter_types text/html;
        sub_filter_once off;
        sub_filter '</head>' '<link rel="stylesheet" href="/custom_css/convertx-dark.css"></head>';

But the above solutions are indeed more direct - at the time I didn't want to touch the codebase and I haven't looked back.