GNOME Bugzilla – Bug 664204
workspace switcher - have a visual effect on hover
Last modified: 2021-07-05 14:08:24 UTC
The workspace thumbnails in the switcher should visually react when the pointer is positioned above them. This will act as a hint that they are actionable. It is also useful when dragging objects onto the thumbnail, since it indicates at what point the object can be released to complete a drag and drop operation.
This is closely related to bug #662087. I recommend making the active workspace thumbnail border to be "4px solid rgba(255,255,255,.7)" and when it prelights #fff as drop target.
Created attachment 202247 [details] [review] workspaceThumbnail: draw an indicator around a drop target We draw an indicator similiar to the active workspace indicator around a thumbnail when it is a drop target
(In reply to comment #2) > Created an attachment (id=202247) [details] [review] > workspaceThumbnail: draw an indicator around a drop target > > We draw an indicator similiar to the active workspace indicator > around a thumbnail when it is a drop target This patch depends on the ones attached at bugs #662087 and #664201
Note that there is some updated artwork that is relevant to this bug: http://git.gnome.org/browse/gnome-shell-design/plain/mockups/static/overview-window-picker-6-workspaces.png
(In reply to comment #4) > Note that there is some updated artwork that is relevant to this bug: > > http://git.gnome.org/browse/gnome-shell-design/plain/mockups/static/overview-window-picker-6-workspaces.png The cursor isn't over the workspace switcher, so I don't see how this is relevant.
(In reply to comment #5) > (In reply to comment #4) > > Note that there is some updated artwork that is relevant to this bug: > > > > http://git.gnome.org/browse/gnome-shell-design/plain/mockups/static/overview-window-picker-6-workspaces.png > > The cursor isn't over the workspace switcher, so I don't see how this is > relevant. The visual effect that is applied to the window thumbnail (see bug 665310) could be applied to the workspace thumbnail.
Review of attachment 202247 [details] [review]: Why not add/remove the pseudo class on the actual indicator when it becomes a drop target? Then we can use CSS transitions on the border-color. ::: js/ui/workspaceThumbnail.js @@ +203,3 @@ this._slidePosition = 0; // Fully slid in this._collapseFraction = 0; // Not collapsed + this.isDropTarget = false; You don't seem to read back isDropTarget, so I'm not sure what it's for.
Work on this bug seems to have halted; I assume that it is fair game if anyone wants to pick it up.
FYI, I'm working on this one.
I simplified the patch a lot and added :hover transition, but that is not what is asked in the first place: the point is to have a visual effect on hover. I've got two questions. First, while I played with my patch working only on dnd, I found dragging vertically is weird because sometimes you have a border, sometimes not, and it's difficult to understand how the drop works. Wouldn't it be better to also add a border to the placeholder, maybe even replace the image altogether? Second, about the implementation, there certainly is a good reason, but why isn't the indicator in WorkspaceThumbnail itself? couldn't it have a transparent border that goes to grey if selected/hover, and even brighter #fff on both? IMHO it would simplify things a lot, including positioning on allocate. If this can not be used, I'd like the best strategy to achieve this: we need to have up to two indicators, what about .workspace-thumbnail-indicator.selection and .workspace-thumbnail-indicator.hover (not as a pseudo selector since it's not a state, its a purpose) and use :hover on both (sure, .hover:hover looks bad). How can I handle enter/leave events to add the :hover pseudo-selector?
For the first point, here's a video explaining the "problem" (do not take care of the wrong border colors): http://zzrough.free.fr/files/public/gnome-shell-664204-Workspace-switcher-visual-effect-on-hover/workspace-hover-highlight.webm I think it might make sense to also have the border on the placeholder.
(In reply to comment #11) > For the first point, here's a video explaining the "problem" (do not take care > of the wrong border colors): > http://zzrough.free.fr/files/public/gnome-shell-664204-Workspace-switcher-visual-effect-on-hover/workspace-hover-highlight.webm > > I think it might make sense to also have the border on the placeholder. Looks good to me. :)
Any progress on this?
I'll try to finish that in the next days.
Created attachment 256427 [details] [review] Add a visual effect on hover for workspace thumbnails Hope nobody minds me taking over this bug :)
Created attachment 256573 [details] [review] workspaceThumbnail: add visual effect on hover for workspace thumbnails updated patch.
Hi Tarun, Do you mind updating the patch so I can test it and try to review it? I tried to update it quick and I saw some visual errors, so maybe it needs some work than just merge the changes.
GNOME is going to shut down bugzilla.gnome.org in favor of gitlab.gnome.org. As part of that, we are mass-closing older open tickets in bugzilla.gnome.org which have not seen updates for a longer time (resources are unfortunately quite limited so not every ticket can get handled). If you can still reproduce the situation described in this ticket in a recent and supported software version, then please follow https://wiki.gnome.org/GettingInTouch/BugReportingGuidelines and create a new ticket at https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/ Thank you for your understanding and your help.