Skip to content

fix(modal): add missing scrolling behavior for better user experience…#9647

Open
JanThiel wants to merge 2 commits intocoollabsio:nextfrom
JanThiel:fix/modal-add-content-scrolling
Open

fix(modal): add missing scrolling behavior for better user experience…#9647
JanThiel wants to merge 2 commits intocoollabsio:nextfrom
JanThiel:fix/modal-add-content-scrolling

Conversation

@JanThiel
Copy link
Copy Markdown

Changes

This PR introduces the ability to scroll the content slot of Dialogs.
If a dialog grows bigger than the screen height it currently is impossible to reach the parts that are outside of the viewport.

This fix is essential to allow #9646 to work on Laptop Screens like a Macbook Pro M4.

Issues

Category

  • Bug fix
  • Improvement
  • New feature
  • Adding new one click service
  • Fixing or updating existing one click service

Preview

This animated GIF shows the new Hetzner Create Server Dialog on a Mac Book Pro with the ability to scroll the content of the Dialog. Tested on Chrome and Safari.
chrome-capture-2026-04-17

AI Assistance

  • AI was NOT used to create this PR
  • AI was used (please describe below)

If AI was used:

  • Tools used: Codex with GPT-5.4 "High" Reasoning on an OpenAI "Plus" paid account with exclusion of data usage enabled for trainings.
  • How extensively:
    • Codex was used to identify the issue with the missing scrolling ability and provide a fix.

All code written by AI was manually reviewed and locally tested using PHPStorm.

Testing

  • Open any dialog (current "Hetzner Create Server" works fine)
  • Reduce the window size manually so that the dialog is higher than the window
  • Now you can scroll the content and reach even the parts outside of the viewport
  • Tested with Chrome on Mac & Windows and Safari on Mac

Contributor Agreement

Important

  • I have read and understood the contributor guidelines. If I have failed to follow any guideline, I understand that this PR may be closed without review.
  • I have searched existing issues and pull requests (including closed ones) to ensure this isn't a duplicate.
  • I have tested all the changes thoroughly with a local development instance of Coolify and I am confident that they will work as expected when a maintainer tests them.

… on smaller screens for modals with much content
Copilot AI review requested due to automatic review settings April 19, 2026 04:21
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds scrollability to the modal-input dialog content so large dialogs remain usable on smaller viewport heights (fixing inability to reach overflowing content, e.g. Hetzner create-server dialog on laptop screens).

Changes:

  • Make the modal viewport (fixed inset-0) scrollable.
  • Constrain modal height and introduce an internal scroll area for the slot content.
  • Adjust layout wrapper to support top-aligned dialogs on small screens and centered dialogs on larger screens.

Comment thread resources/views/components/modal-input.blade.php Outdated
Comment thread resources/views/components/modal-input.blade.php Outdated
…nt cuttoffs of the content area and restore close-outside click behaviour
@Cinzya Cinzya added the UI/UX label Apr 19, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants