parse-dashboard icon indicating copy to clipboard operation
parse-dashboard copied to clipboard

Make selected text visible on the Edit modal title

Open jadsonlourenco opened this issue 4 years ago • 1 comments

Sometimes we need to copy the objectId, now when we click on this row open the edit modal, but when selecting the text on this modal title, blue area, we can't see that the text is selected.

The fix is just to not set, or remove, this CSS:

::selection {
    color: white;
    background: #169cee;
}

So, will use the browser default style or set a different color for the background in this style.

Current: Screen Shot 2021-10-05 at 11 48 33

Should be: Screen Shot 2021-10-05 at 11 48 41

jadsonlourenco avatar Oct 05 '21 15:10 jadsonlourenco

Thanks for opening this issue!

  • ❌ Please edit your post and use the provided template when creating a new issue. This helps everyone to understand your post better and asks for essential information to quicker review the issue.

I think from a UI perspective, a copy icon next to the ID would be an expected control element. It also saves some clicks, as you don't have to double-click to select the text, then hit a shortcut to copy it.

Similar to: image

What do you think?

In general, the dashboard has some accessibility issues. The font sizes and text color to background color contrasts are sometimes not following accessibility standards. That is also the case with white text on light-blue background, or light-gray text on white background.

mtrezza avatar Nov 04 '22 19:11 mtrezza

I think that keeping the text without this "action icon" is better, keep the UI clean. If we want to copy the dates is easy, easy to use the mouse on the computer and select what the user wants, on mobile too.

Yes, about accessibility and even for design propose the dashboard can be better, the font size in some places, and other issues like #1832 to make the File UX better... We can make progress solving this issue with time, so, I think for now this one is good to have merged, and then we can open others to solve the accessibility.

jadsonlourenco avatar Nov 04 '22 23:11 jadsonlourenco

I was able to reproduce the color issue you described in Chrome: image

While in Safari it seems to override with default colors:

image

I think we can treat this is a bug, thanks for opening the PR.

mtrezza avatar Nov 05 '22 01:11 mtrezza