Command Palette - "..." Icon in header is not communicative (as is easily covered)

[tgeorgeux]

Command Pallette

UX Defficiency (1) Defect (2) - "..." Icon on headers in command palette

Context: When you mouse over a header in the command palette, a "..." Icon appears to indicate you can filter the command palette by clicking on the dots or the header. Clicking will filter the search as shown above.

Problem 1: I'm not sure "..." is the correct icon usage here. When I saw the "..." icon I thought it was going to open a menu with more options.

Solution 1: I think a "filter_list" icon makes more sense here.

Problem 2: If you're trying to click the icon that appears there's a very small window in which you can hit the icon without surfacing the slider. See the gif below.

Solution 2: This one's a bit trickier, one option would be to render the icons further left when the slider appears.

[jasongrout]

Solution 2: This one's a bit trickier, one option would be to render the icons further left when the slider appears.

I think the scrollbar appearing/disappearing/overlaying is a macos thing we have no control or knowledge of in the code. I find it really annoying personally and I turn that disappearing scrollbar off as soon as I get a new mac in the system preferences.

[jasongrout]

Solution 1: I think a "filter_list" icon makes more sense here.

Do we have the filter-list icon anywhere already? The code that adds the ... is here:

jupyterlab/packages/apputils/style/commandpalette.css

Lines 108 to 112 in fd18d01

	.p-CommandPalette-header:hover::before {
	content: '\2026'; /* ellipsis */
	float: right;
	margin-right: 4px;
	}

[ellisonbg]

Will wait for #6663 to be merged to do this follow on icon work. I will use the filter list icon from MD and move it away from the scroll bar area.

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related discussion.