Skip to content

Debug icon polish #45432

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

Merged
merged 9 commits into from
Mar 9, 2018
Merged

Debug icon polish #45432

merged 9 commits into from
Mar 9, 2018

Conversation

chryw
Copy link
Contributor

@chryw chryw commented Mar 9, 2018

@isidorn

  • breakpoint-hint icon back
  • start icons in dropdown and toolbar are the same size now
  • breakpoint icons in viewlet are set to 16x16 (the original size at 100%).
  • restart icon is slightly smaller now.
  • breakpoint icons in margin size - there is an inline css rule that has calculated icon size based on editor line height. The default line height is 19px. That's why they look bigger than before (hard-coded size inside svg files). I personally don't mind this. If you think this is an issue, maybe we can add a css rule to force the margin icon size at 16x16 at all time?
    image

#45406

@isidorn isidorn merged commit a7e0321 into microsoft:master Mar 9, 2018
@isidorn
Copy link
Contributor

isidorn commented Mar 9, 2018

Good work. Some feedback:

  • imho the continue button is too smal compared to the other in the debug toolbar, might need a bit more size, or the step over should be shrinked a bit. This is personal preference so if you disagree no action is needed

screen shot 2018-03-09 at 22 44 15

  • Breakpoint still looks larger than before in this screenshot I am comparing latest to stable. Edit: sorry only now saw your comment - yeah I think in stable it is already too prominent so increasing the size will just make it worse, so I would hardcode the size. Or leave it dynamic but that it takes a smaller portion of the line height

screen shot 2018-03-09 at 22 47 00

  • Breakpoint-hint icon still taking priority. Might be just some css tweaking - I can look into it if you want (I would try to add less specific rules to the hint so it loses to everyone else)

@chryw
Copy link
Contributor Author

chryw commented Mar 9, 2018

@isidorn

  • Agree. I'll balance these two. I made the red square bigger when I re-worked the "disconnect" icon to fit the little plug. The green arrow is actually the same height but being a triangle makes it look smaller.
  • Let me reduce the base size even more and keep them dynamic.
  • I haven't figured out how breakpoint-hint icon works. The svg is same as the regular breakpoint.svg except the path has 40% opacity. I'll leave this one to you.

@isidorn
Copy link
Contributor

isidorn commented Mar 12, 2018

@chryw sounds good, you can provide a PR for the first two, and I will take care of the breakpoint-hint. Thanks a lot

@isidorn
Copy link
Contributor

isidorn commented Mar 12, 2018

We forgot to update the css rules regarding breakpoint-hint. I have fixed this via b564529
Now all is good regarding breakpoint-hint

@github-actions github-actions bot locked and limited conversation to collaborators Mar 27, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants