[GH-ISSUE #702] Menu is collapsed on mobile devices

kerem commented

2026-02-26 06:33:33 +03:00

Owner

Originally created by @Kipjr on GitHub (Nov 7, 2020).
Original GitHub issue: https://github.com/NginxProxyManager/nginx-proxy-manager/issues/702

Checklist

Have you pulled and found the error with jc21/nginx-proxy-manager:latest docker image? YES
Are you sure you're not using someone else's docker image? YES
If having problems with Lets Encrypt, have you made absolutely sure your site is accessible from outside of your network? YES

Describe the bug

Non-desktop (responsive design) does not show all tabs and features
What version of Nginx Proxy Manager is reported on the login page? 2.62

To Reproduce
Steps to reproduce the behavior:

get android phone and chrome
open NPM in browser
login
see the difference between desktop and smartphone

Expected behavior

Same options and tabs as on desktop

Screenshots

Operating System

Android + Chrome
Windows + Crome

Originally created by @Kipjr on GitHub (Nov 7, 2020). Original GitHub issue: https://github.com/NginxProxyManager/nginx-proxy-manager/issues/702 **Checklist** - Have you pulled and found the error with `jc21/nginx-proxy-manager:latest` docker image? YES - Are you sure you're not using someone else's docker image? YES - If having problems with Lets Encrypt, have you made absolutely sure your site is accessible from outside of your network? YES **Describe the bug** - Non-desktop (responsive design) does not show all tabs and features - What version of Nginx Proxy Manager is reported on the login page? 2.62 **To Reproduce** Steps to reproduce the behavior: - get android phone and chrome - open NPM in browser - login - see the difference between desktop and smartphone **Expected behavior** - Same options and tabs as on desktop **Screenshots** ![Screenshot_20201107-094655_Chrome.jpg](https://user-images.githubusercontent.com/12066560/98437216-c08a8a00-20e0-11eb-842b-71dc94a9eaf2.jpg) **Operating System** - Android + Chrome - Windows + Crome

kerem

2026-02-26 06:33:33 +03:00

closed this issue
added the
bug
label

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@erraticallyefficient commented on GitHub (Dec 7, 2020):

Can confirm I'm seeing the same issue.

Using the latest chrome browser on a pixel. Doesn't matter if you view the page in mobile mode or desktop mode.

@erraticallyefficient commented on GitHub (Dec 7, 2020): Can confirm I'm seeing the same issue. Using the latest chrome browser on a pixel. Doesn't matter if you view the page in mobile mode or desktop mode.

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@NuttCorp commented on GitHub (Feb 6, 2021):

Having same issue. Unable to access SSL section from mobile web browser. Tried Chrome and Firefox. Switching to desktop view makes no difference. Definitely gonna buy you a coffee. Love the tool.

@NuttCorp commented on GitHub (Feb 6, 2021): Having same issue. Unable to access SSL section from mobile web browser. Tried Chrome and Firefox. Switching to desktop view makes no difference. Definitely gonna buy you a coffee. Love the tool.

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@infeeeee commented on GitHub (May 2, 2021):

This is an issue on all mobile devices. This is reproducible in any browser's dev tools' responsive design mode

On the UI a collapse class is added to the menu, so it collapses on small screens. This class is also applied on the tabler demo page, but there is no button to uncollapse the menu on npm's frontend.

Quick and dirty fix on your instance:

inside the container edit this file: /app/frontend/css/main.css
find and delete this section: .collapse{display:none};

This is just a temporary fix, it will be overwritten on next update. Create a backup of this file before editing if you don't know what you are doing.

More permanent fix should be to fix it in the repo, but I couldn't find a documentation how to set up a build environment for this project, and I don't want to create an untested PR, so if anyone can test this, please create a PR:

Easy solution: do not collapse the menu at all, as npm is not 100% responsive, I think this won't be a big problem.
Just simply delete the word 'collapse' from this line: github.com/jc21/nginx-proxy-manager@b42cc9ed3e/frontend/js/app/ui/menu/main.js (L9)

The page should look something like this with this fix:

Better solution should be to create a button for uncollapsing, as it's on tabler's demo page, but I have no idea how to do that.

@infeeeee commented on GitHub (May 2, 2021): This is an issue on all mobile devices. This is reproducible in any browser's dev tools' [responsive design mode](https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_Mode) On the UI a _collapse_ class is added to the menu, so it collapses on small screens. This class is also applied on the [tabler demo page](https://preview.tabler.io/), but there is no button to uncollapse the menu on npm's frontend. Quick and dirty fix on your instance: - inside the container edit this file: `/app/frontend/css/main.css` - find and delete this section: `.collapse{display:none};` This is just a temporary fix, it will be overwritten on next update. Create a backup of this file before editing if you don't know what you are doing. More permanent fix should be to fix it in the repo, but I couldn't find a documentation how to set up a build environment for this project, and I don't want to create an untested PR, so if anyone can test this, please create a PR: Easy solution: do not collapse the menu at all, as npm is not 100% responsive, I think this won't be a big problem. Just simply delete the word 'collapse' from this line: https://github.com/jc21/nginx-proxy-manager/blob/b42cc9ed3ef3a875feae5026c8f7b8b71b7856e9/frontend/js/app/ui/menu/main.js#L9 The page should look something like this with this fix: ![kép](https://user-images.githubusercontent.com/1271737/116827954-204b8480-ab9c-11eb-9223-34f2a120e296.png) Better solution should be to create a button for uncollapsing, as it's on tabler's demo page, but I have no idea how to do that.

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@thunderclap82 commented on GitHub (Sep 10, 2021):

I'm surprised this hasn't been fixed yet considering it's been nearly a year. Looking at the suggestion it seems like a fairly straightforward fix. This isn't to belittle the developer -- real world life gets in the way, I get it -- but more of a reminder bump. :)

Overall, I really appreciate the work on this project.

@thunderclap82 commented on GitHub (Sep 10, 2021): I'm surprised this hasn't been fixed yet considering it's been nearly a year. Looking at the suggestion it seems like a fairly straightforward fix. This isn't to belittle the developer -- real world life gets in the way, I get it -- but more of a reminder bump. :) Overall, I really appreciate the work on this project.

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@threehappypenguins commented on GitHub (Oct 14, 2021):

Quick and dirty fix on your instance:

inside the container edit this file: /app/frontend/css/main.css

find and delete this section: .collapse{display:none};

Sorry for the noob question, but I am on Linux and I can't find /app/frontend/css/main.css

I looked in /var/lib/docker/containers and also in my Nginx Proxy Manager data folder, but can't find any css files. Where do I find them?

@threehappypenguins commented on GitHub (Oct 14, 2021): > Quick and dirty fix on your instance: > > * inside the container edit this file: `/app/frontend/css/main.css` > * find and delete this section: `.collapse{display:none};` Sorry for the noob question, but I am on Linux and I can't find /app/frontend/css/main.css I looked in /var/lib/docker/containers and also in my Nginx Proxy Manager data folder, but can't find any css files. Where do I find them?

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@infeeeee commented on GitHub (Oct 14, 2021):

The issue is fixed, it should be included in one of the future versions, you you shouldn't do anything, just wait.

Btw the mentioned file is inside the container, not visible on the host's filesystem. You have to use docker exec -it <mycontainerid> sh to enter the container, or if you use portainer click on the "Exec console" button. There you can traverse the container's filesystem. https://stackoverflow.com/questions/30172605/how-do-i-get-into-a-docker-containers-shell

@infeeeee commented on GitHub (Oct 14, 2021): The issue is fixed, it should be included in one of the future versions, you you shouldn't do anything, just wait. Btw the mentioned file is inside the container, not visible on the host's filesystem. You have to use `docker exec -it <mycontainerid> sh` to enter the container, or if you use portainer click on the "Exec console" button. There you can traverse the container's filesystem. https://stackoverflow.com/questions/30172605/how-do-i-get-into-a-docker-containers-shell

kerem commented

2026-02-26 06:33:34 +03:00

Author

Owner

@threehappypenguins commented on GitHub (Oct 14, 2021):

I can't wait for a future version. I really needed it fixed right now since I need access on my phone since my kids are always using my laptops for school or my husband is on the gaming laptop playing games. Lol

In ConnectBot on my phone I did docker exec -it nginx-proxy-manager bash and then had to install vim-tiny . I tried nano at first, but it kept freezing everything up. I had no idea how to use vim, but this helped . Anyways, it's all sorted now, and I have access to the menu on my phone.

@threehappypenguins commented on GitHub (Oct 14, 2021): I can't wait for a future version. I really needed it fixed right now since I need access on my phone since my kids are always using my laptops for school or my husband is on the gaming laptop playing games. Lol In ConnectBot on my phone I did `docker exec -it nginx-proxy-manager bash` and then had to install [vim-tiny](https://forums.docker.com/t/cannot-use-vim-vi-nano-yum-inside-docker-container/14905/8) . I tried nano at first, but it kept freezing everything up. I had no idea how to use vim, but [this helped](https://success.trendmicro.com/solution/1113864-editing-configuration-files-of-linux-based-products) . Anyways, it's all sorted now, and I have access to the menu on my phone.

kerem referenced this issue

2026-02-26 06:33:39 +03:00

[GH-ISSUE #717] I am try to upload a custom Certificate #607

kerem referenced this issue

2026-02-26 06:33:39 +03:00

[GH-ISSUE #717] I am try to upload a custom Certificate #607

kerem referenced this issue

2026-02-26 06:33:41 +03:00

[GH-ISSUE #728] 2.7.0 not starting #618

Rows
Columns

[GH-ISSUE #702] Menu is collapsed on mobile devices #594