Dark Mode Support

[redtripleAAA]

RFE for Dark Mode Support

[C-Fu]

This would be awesome!

[vMeph]

+ 1 for it :)

[WrDX]

It looks like Tabler supports it: https://preview.tabler.io/layout-dark.html

[jc21]

And it indeed looks sexy. I'm rewriting the UI with react for version 3, which which be much easier to integrate a dark mode.

[jonasled]

I've played a bit around with the SCSS and also implementing one without the tabler resources is not very difficult: https://gitlab.jonasled.de/jonasled/nginx-proxy-manager-dark/-/blob/master/frontend/scss/darkmode.scss

[TropicLegend]

Where can I change these files?

[root9191]

I've played a bit around with the SCSS and also implementing one without the tabler resources is not very difficult: https://gitlab.jonasled.de/jonasled/nginx-proxy-manager-dark/-/blob/master/frontend/scss/darkmode.scss

Hello, how Can i implent the Dark Mode in my Proxy Manager Version 2.9.7?

[FroggMaster]

I created a Dark Mode theme VIA CSS which can be easily applied VIA the Stylish Extension. Stylish will allow you to toggle the theme quickly if you so choose. In addition it will allow for you to make easy/live modifications if you'd like to change the theme to your preferences. I have heavily commented my CSS to give you some understanding of the areas I've changed.

You can find the Stylish theme that I created here:
https://userstyles.org/styles/220202/nginx-proxy-manager-dark-theme

You can also create a custom CSS then mount it within the NGINX Proxy Manager docker container. This I would consider to be a little bit more of an advanced method, but this would mean no matter where NGINX Proxy manager was accessed from it would display the custom theme; Unlike with the Stylish extension, where the extension must be installed for the theme to be visible. I'm honestly surprised there is no option within the GUI to provide custom CSS. Or instructions on simply mounting a CSS file within the container. Please note that the CSS for the Stylish theme I provided will only modify portions of the CSS I wanted to change. It is not a complete CSS for NGINX Proxy Manager and I would not recommend mounting it in your docker container.

NGINX Also allows for sub filters to be used when passing a webpage or server through it, which in turn can cause CSS to be loaded this way as well. If you were to pass NGINX Manager through itself, and apply a sub filter this would allow for modification of the CSS as well.

There are A LOT of ways themes/custom CSS could be implemented into this application and I would HIGHLY suggest it. Even if it's just VIA the ability to apply your own custom CSS overtop of the original CSS. User's will eventually create themes and there will be an immense variety of options. Until the develop opts to support this functionality though, I doubt we will see many themes developed for the application.

It's obvious that this is a sought after feature though. Within 24 hrs of me submitting my theme, there was thirteen separate user's whom had installed it. In such a short period of time, that screams to me others are deeply interested in a Dark Mode option.

[ItsNoted]

I created a Dark Mode theme VIA CSS [...]

Installing browser plugins is not an option for me.

[operinko]

I would love to see theme-park.dev support on nginx-proxy-manager, though that seems to imply requiring linuxserver.io builds

[FroggMaster]

I created a Dark Mode theme VIA CSS [...]

Installing browser plugins is not an option for me.

There are alternative suggestions in my post. Though, the most non-technical method would be to use an Extension.

• Apply CSS VIA NGINX itself (You will need to reverse proxy NPM to do this)
• Mount a new CSS file overtop of the existing CSS file VIA Docker

[root9191]

I created a Dark Mode theme VIA CSS [...]

Installing browser plugins is not an option for me.

There are alternative suggestions in my post. Though, the most non-technical method would be to use an Extension.

• Apply CSS VIA NGINX itself (You will need to reverse proxy NPM to do this)

• Mount a new CSS file overtop of the existing CSS file VIA Docker

Could you explain, how i can apply the CSS in Nginx? Do i need the Advanced Tab for this?

[Amoenus]

Here's my attempt to create dark theme CSS, it's very chatty but should cover almost everything
Dark Theme CSS
Comes with a dark scroll bar though ;)