Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Open Editors widget UI #10940

Merged
merged 1 commit into from
Jun 2, 2022
Merged

Conversation

msujew
Copy link
Member

@msujew msujew commented Mar 28, 2022

What it does

Minor changes to focus and hovering effects for the "Open Editors" widget and tree views in general, which were missing their outlines.

How to test

  1. Open the "Open Editors" view container and add a few files to it
  2. The left padding of all nodes should align to vscode
  3. The selected node should always display its close icon
  4. Hovering over the close icon should show the usual rounded border
  5. Hovering over a dirty node should show the close icon.

Review checklist

Reminder for reviewers

@msujew msujew added ui/ux issues related to user interface / user experience open-editors issues related to the open-editors view labels Mar 28, 2022
@colin-grant-work
Copy link
Contributor

@msujew, with your tabbar work merged, this should be good to go after a rebase?

@msujew msujew force-pushed the msujew/improve-open-editors-ui branch from 79bb933 to bb856a2 Compare April 13, 2022 16:13
@msujew
Copy link
Member Author

msujew commented Apr 13, 2022

@colin-grant-work Thanks for the reminder, I rebased my changes 👍

@colin-grant-work colin-grant-work self-requested a review May 11, 2022 21:52
@colin-grant-work colin-grant-work removed their request for review May 31, 2022 21:35
@colin-grant-work
Copy link
Contributor

@msujew, I believe the scenario I described in my comment above is still causing trouble. I've removed my self-review request just for bookkeeping purposes - ping me when it's ready for another look.

@msujew msujew force-pushed the msujew/improve-open-editors-ui branch from bb856a2 to 1d0d2b2 Compare June 1, 2022 11:16
@msujew msujew force-pushed the msujew/improve-open-editors-ui branch from 1d0d2b2 to 80808eb Compare June 1, 2022 11:17
@msujew
Copy link
Member Author

msujew commented Jun 1, 2022

@colin-grant-work I had time to get back to this. I removed the functional change and kept it limited to purely visual changes. In my newest change I also corrected the left padding of the tree nodes, which wasn't quite correct.

@colin-grant-work colin-grant-work self-requested a review June 1, 2022 16:10
Copy link
Contributor

@colin-grant-work colin-grant-work left a comment

Choose a reason for hiding this comment

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

Changes and new interactions look good to me. 👍

Copy link
Member

@vince-fugnitto vince-fugnitto left a comment

Choose a reason for hiding this comment

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

@msujew I noticed a couple of things when quickly trying out the functionality:

  1. It seems as though the selection is not maintained similarly to the explorer, and vscode. In the case of the open-editors widget the selection is always passive:
open-editors-selection.mov
  1. I noticed we did not have ellipsis for overflowing content in the open-editors, but it seems to be a regression as it used to work (tree-view: update styling when the tree row content cannot be fully displayed #7145). Not related to your changes but I thought I'd mention it here for visibility:

Screen Shot 2022-06-01 at 12 47 37 PM

@msujew
Copy link
Member Author

msujew commented Jun 1, 2022

@vince-fugnitto Thanks for chiming in!

  1. Yeah, that was originally the reason I created this PR, in my first draft (see this comment). However, that lead to some unexpected consequences, which is why I reverted the change. In the case of the file system explorer, the same thing actually happens. Double clicking a file removes focus from the file tree and puts it on the editor. The same thing is happening in the case of the open editors widget, just with a single click.
  2. I see, that's good to know. We can fix this in a separate PR.

Copy link
Member

@vince-fugnitto vince-fugnitto left a comment

Choose a reason for hiding this comment

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

The styling updates look much better 👍
I confirm that:

  • the padding works well
  • different file-icon themes display properly
  • selection is maintained, and so is the close icon
  • the close icon has consistent styling with other clickable icons present in the framework

@msujew msujew merged commit 9b1f414 into master Jun 2, 2022
@msujew msujew deleted the msujew/improve-open-editors-ui branch June 2, 2022 13:42
@github-actions github-actions bot added this to the 1.27.0 milestone Jun 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
open-editors issues related to the open-editors view ui/ux issues related to user interface / user experience
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants