Skip to content

Make image cropper container responsive#556

Merged
Soare-Robert-Daniel merged 4 commits intodevelopmentfrom
bugfix/210
Apr 14, 2026
Merged

Make image cropper container responsive#556
Soare-Robert-Daniel merged 4 commits intodevelopmentfrom
bugfix/210

Conversation

@girishpanchal30
Copy link
Copy Markdown
Contributor

Summary

Updated the boundary width and height based on the viewport to make the image cropper container responsive.

Check before Pull Request is ready:

Closes #210

@girishpanchal30 girishpanchal30 requested a review from Copilot April 3, 2026 11:52
@girishpanchal30 girishpanchal30 added the pr-checklist-skip Allow this Pull Request to skip checklist. label Apr 3, 2026
@pirate-bot pirate-bot added the pr-checklist-complete The Pull Request checklist is complete. (automatic label) label Apr 3, 2026
@pirate-bot
Copy link
Copy Markdown
Contributor

pirate-bot commented Apr 3, 2026

Plugin build for 65d6090 is ready 🛎️!

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

Makes the Croppie-based image cropper UI adapt to smaller viewports by sizing the cropper boundary to the available container width.

Changes:

  • Set the crop-size <select> to use width: 100% instead of a fixed pixel width.
  • Capture the cropper container width at preview time and apply responsive scaling to Croppie boundary/viewport options.
  • Added a helper (get_responsive_croppie_options) to compute scaled Croppie options.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.

File Description
templates/frontend/inputs/cropper.php Makes the crop-size select responsive via width:100%.
js/file-upload.js Scales Croppie boundary/viewport based on the container width to improve mobile layout.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread templates/frontend/inputs/cropper.php Outdated
Comment thread js/file-upload.js Outdated
Comment thread js/file-upload.js Outdated
Comment thread js/file-upload.js Outdated
@Soare-Robert-Daniel Soare-Robert-Daniel merged commit b812576 into development Apr 14, 2026
11 checks passed
@Soare-Robert-Daniel Soare-Robert-Daniel deleted the bugfix/210 branch April 14, 2026 15:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

pr-checklist-complete The Pull Request checklist is complete. (automatic label) pr-checklist-skip Allow this Pull Request to skip checklist.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

The Image cropper container is not responsive on mobile

4 participants