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

CC-177 Give neuroglancer layers a tag dependent on their type #67

Open
wants to merge 12 commits into
base: master
Choose a base branch
from

Conversation

Aiga115
Copy link

@Aiga115 Aiga115 commented Jan 24, 2025

Issue #CC-177
Problem: Give neuroglancer layers a tag dependent on their type
Solution:

  1. Change size of layer list panel items (checkbox, neuroglancer icon and .etc) to make it look aligned
  2. Add layer type indicator tag to layer list panel item

Result:

Recording.2025-01-24.130409.mp4

@Aiga115 Aiga115 requested a review from seankmartin January 24, 2025 12:05
@@ -33,6 +48,13 @@
stroke: #999;
}

.neuroglancer-layer-side-panel-name {

Choose a reason for hiding this comment

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

It would be better if we modify the CSS only for the name item when it is in the layer list panel. This is too broad and affects the name when it is in the layer side panel, and when it is part of a tool.

For example, we could add a class for this. Or update the selector

src/ui/layer_list_panel.css Show resolved Hide resolved
.neuroglancer-layer-list-panel-item input[type="checkbox"] {
width: 1rem;
height: 1rem;
margin: 4px;

Choose a reason for hiding this comment

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

I think this margin is too much, might need to review design

Copy link
Author

Choose a reason for hiding this comment

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

I see, in the design the checkbox itself is 16x16 and has margin of 4px and a gap between items is 4px:
image
but if it looks too much we can ask @syamace-metacell to reduce the size
What do you think @seankmartin?

margin: 4px;
}

.neuroglancer-layer-list-panel-item .neuroglancer-icon {

Choose a reason for hiding this comment

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

Is this targeting just the eye icon? If so it would be better to give that a class to make this more explicit

src/widget/layer_type_indicator.ts Show resolved Hide resolved
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants