Skip to content

fix(manager): increase Package Manager drag-and-drop image visibility#16899

Open
Ibochkarev wants to merge 2 commits intomodxcms:3.xfrom
Ibochkarev:fix/15989-package-manager-drag-image-visibility
Open

fix(manager): increase Package Manager drag-and-drop image visibility#16899
Ibochkarev wants to merge 2 commits intomodxcms:3.xfrom
Ibochkarev:fix/15989-package-manager-drag-image-visibility

Conversation

@Ibochkarev
Copy link
Copy Markdown
Collaborator

@Ibochkarev Ibochkarev commented Feb 25, 2026

What does it do?

Increases the opacity of the drag-and-drop hint image in the Package Manager from the default (effectively ~0.1) to 0.25 for the #modx-panel-packages.drag-n-drop::before pseudo-element in _build/templates/default/sass/index.scss. The compiled CSS is produced by grunt sass during build; this PR only changes the SCSS source.

Why is it needed?

With the previous opacity, the dragndrop.svg hint was barely visible and could be mistaken for a visual bug or artifact. Making the hint clearly visible (while still subtle) improves UX and matches the intent of the drag-and-drop zone.

image

How to test

  1. Open the Package Manager in the MODX manager.
  2. Ensure the packages list is in a state where the drag-and-drop overlay can appear (e.g. empty or when dragging).
  3. Confirm the drag-and-drop hint image is visibly present and looks intentional, not like a bug.

Related issue(s)/PR(s)

Resolves #15989

Set opacity to 0.25 for #modx-panel-packages.drag-n-drop::before so the
dragndrop.svg hint is visible as an intentional UI cue instead of
appearing as a bug or artifact.

Resolves modxcms#15989
@Ibochkarev Ibochkarev marked this pull request as ready for review February 25, 2026 03:43
@biz87
Copy link
Copy Markdown

biz87 commented Feb 25, 2026

Code Review

Summary

Adds opacity: 0.25 to the drag-and-drop hint SVG in Package Manager. Single SCSS change, +1/-0.

Assessment

Minimal CSS change, correct and harmless. Improves visibility of the drag-and-drop hint without being intrusive.

Verdict

Approve

Copy link
Copy Markdown
Member

@mkschell mkschell left a comment

Choose a reason for hiding this comment

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

Simple scss/css change, no superfluous whitespace changes, manually verified working.
Thanks!

@Ruslan-Aleev
Copy link
Copy Markdown
Collaborator

Ruslan-Aleev commented Mar 11, 2026

I would also add the another one SVG, since user can only drag and drop archives, and here the images are in SVG.
Or make the icon a little more neutral, without creating a separate one for the package manager. But that might be unnecessary.

@smg6511
Copy link
Copy Markdown
Collaborator

smg6511 commented Mar 11, 2026

Guys - I'm of the mind that in the normal state there should be no icon shown. I believe the typical pattern out there is to indicate the drop zone when dragging an object over it. The other thing is, and maybe this is what Ruslan's getting at, the icon itself indicates the movement of literal images — if a graphic is to be shown (preferably on an over state) it should communicate the type of content that's droppable.

I do appreciate the effort to fix what's currently showing — it's a little thing that's bothered me for a while ;-)

@mkschell
Copy link
Copy Markdown
Member

@smg6511 Any harm in leaving this visibility improvement in flow to be merged for now, and we get a new Issue logged with the additional thoughts raised above? I think those are excellent points and agree with moving to more common patterns. (I don't mind adding the new Issue if you agree.)

@smg6511
Copy link
Copy Markdown
Collaborator

smg6511 commented Mar 18, 2026

@mkschell - Hey Mike - not gonna block it ;-) Go for it on posting new issue...

@mkschell mkschell self-assigned this Mar 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[3.0.0-rc1] Image in package manager

5 participants