immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-02-05 00:30:57 +03:00
Code Issues 11 Packages Projects Releases 10 Wiki Activity

[BUG] Dialogs Overflow Screen Vertically #1145

New Issue
Closed
opened 2026-02-05 00:37:49 +03:00 by OVERLORD · 6 comments
OVERLORD commented 2026-02-05 00:37:49 +03:00
Owner
Copy Link

Originally created by @mark-monteiro on GitHub (Jul 23, 2023).

Originally assigned to: @amitkshatriya01 on GitHub.

The bug

On desktop, some dialogs appear to overflow the screen vertically, hiding some of the content. The screenshot below is an example, but I've notices this also happens on the 'Edit User' dialog as well. Possibly it affects all dialogs if they're sharing the same CSS.

image

The OS that Immich Server is running on

Docker (Ubuntu host)

Version of Immich Server

v1.68.0

Version of Immich Mobile App

N/A

Platform with the issue

  • Server
  • Web
  • Mobile

Your docker-compose.yml content

N/A

Your .env content

N/A

Reproduction steps

1. Open 'Add User' dialog on a desktop web browser
2. Resize the window to reduce the window height until the dialog overflows

Additional information

To fix the issue, the parent element of the dialog should have a max-height value set, and overflow-y: auto This will add a scroll bar when the screen is not tall enough to display the full dialog, but leave the scrollbar hidden when the dialog does not overflow the screen.

For example, adding the following CSS:

{
  max-height: 90vh;
  overflow-y: scroll;
}

Results in the following

image

Some additional work may be desired to make the scrollbar a little bit smaller, but as a quick fix this should work

Originally created by @mark-monteiro on GitHub (Jul 23, 2023). Originally assigned to: @amitkshatriya01 on GitHub. ### The bug On desktop, some dialogs appear to overflow the screen vertically, hiding some of the content. The screenshot below is an example, but I've notices this also happens on the 'Edit User' dialog as well. Possibly it affects all dialogs if they're sharing the same CSS. ![image](https://github.com/immich-app/immich/assets/2626103/4e04afe2-9aab-43b6-a29f-d22a1e5823f7) ### The OS that Immich Server is running on Docker (Ubuntu host) ### Version of Immich Server v1.68.0 ### Version of Immich Mobile App N/A ### Platform with the issue - [ ] Server - [X] Web - [ ] Mobile ### Your docker-compose.yml content ```YAML N/A ``` ### Your .env content ```Shell N/A ``` ### Reproduction steps ```bash 1. Open 'Add User' dialog on a desktop web browser 2. Resize the window to reduce the window height until the dialog overflows ``` ### Additional information To fix the issue, the parent element of the dialog should have a `max-height` value set, and `overflow-y: auto` This will add a scroll bar when the screen is not tall enough to display the full dialog, but leave the scrollbar hidden when the dialog does not overflow the screen. For example, adding the following CSS: ```css { max-height: 90vh; overflow-y: scroll; } ``` Results in the following ![image](https://github.com/immich-app/immich/assets/2626103/bc65ad00-1998-49cf-a382-67396233f2aa) Some additional work may be desired to make the scrollbar a little bit smaller, but as a quick fix this should work
OVERLORD added the good first issue🖥️web labels 2026-02-05 00:37:49 +03:00
OVERLORD commented 2026-02-05 00:37:53 +03:00
Author
Owner
Copy Link

@jrasm91 commented on GitHub (Jul 24, 2023):

Feel free to open a PR for this. There is an immich-scrollbar class I believe you can use as well.

@jrasm91 commented on GitHub (Jul 24, 2023): Feel free to open a PR for this. There is an immich-scrollbar class I believe you can use as well.
OVERLORD commented 2026-02-05 00:37:57 +03:00
Author
Owner
Copy Link

@mark-monteiro commented on GitHub (Jul 24, 2023):

As much as I'd like to contribute more, it's unlikely I'll be able to find the time to set up a development environment and put together a PR for this. If anyone else wants to tackle it, that'd be fine by me.

@mark-monteiro commented on GitHub (Jul 24, 2023): As much as I'd like to contribute more, it's unlikely I'll be able to find the time to set up a development environment and put together a PR for this. If anyone else wants to tackle it, that'd be fine by me.
OVERLORD commented 2026-02-05 00:38:00 +03:00
Author
Owner
Copy Link

@amitkshatriya01 commented on GitHub (Aug 14, 2023):

Can i take this one? I am looking to do something beginner friendly and this seems like a perfect fit. New immich user, love the product.

@amitkshatriya01 commented on GitHub (Aug 14, 2023): Can i take this one? I am looking to do something beginner friendly and this seems like a perfect fit. New immich user, love the product.
OVERLORD commented 2026-02-05 00:38:05 +03:00
Author
Owner
Copy Link

@amitkshatriya01 commented on GitHub (Aug 14, 2023):

Replicated this issue on version 1.72.2 as well using the edit user screen. I'll work to fix this.

@amitkshatriya01 commented on GitHub (Aug 14, 2023): Replicated this issue on version 1.72.2 as well using the edit user screen. I'll work to fix this.
OVERLORD commented 2026-02-05 00:38:07 +03:00
Author
Owner
Copy Link

@Ploonet commented on GitHub (Sep 18, 2023):

I think we can close this thanks to #3422, can't we ?

@Ploonet commented on GitHub (Sep 18, 2023): I think we can close this thanks to #3422, can't we ?
OVERLORD commented 2026-02-05 00:38:13 +03:00
Author
Owner
Copy Link

@mark-monteiro commented on GitHub (Sep 18, 2023):

Yep, looks like it. Closing.

@mark-monteiro commented on GitHub (Sep 18, 2023): Yep, looks like it. Closing.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
accessibility
changelog:enhancement
changelog:security
changelog:translation
cli
date-time
documentation
external-library
format
good first issue
needs-answer
nice to have
sharing
tech-debt
📱mobile
🖥️web
🗄️server
🧠machine-learning
No Label good first issue 🖥️web
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
OVERLORD
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: immich-app/immich#1145
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?