more cleanup

seung-lab · Nov 8, 2023 · 8b2efbd · 8b2efbd
1 parent 8fca6a0
commit 8b2efbd
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 36 deletions.
diff --git a/src/neuroglancer/datasource/graphene/frontend.ts b/src/neuroglancer/datasource/graphene/frontend.ts
@@ -61,10 +61,10 @@ import {Uint64} from 'neuroglancer/util/uint64';
 import {makeDeleteButton} from 'neuroglancer/widget/delete_button';
 import {DependentViewContext} from 'neuroglancer/widget/dependent_view_widget';
 import {makeIcon} from 'neuroglancer/widget/icon';
-import {MultiscaleAnnotationSource} from 'src/neuroglancer/annotation/frontend_source';
-import {removeChildren} from 'src/neuroglancer/util/dom';
-import {getDefaultAnnotationListBindings} from 'src/neuroglancer/ui/default_input_event_bindings';
-import {MouseEventBinder} from 'src/neuroglancer/util/mouse_bindings';
+import {MultiscaleAnnotationSource} from 'neuroglancer/annotation/frontend_source';
+import {removeChildren} from 'neuroglancer/util/dom';
+import {getDefaultAnnotationListBindings} from 'neuroglancer/ui/default_input_event_bindings';
+import {MouseEventBinder} from 'neuroglancer/util/mouse_bindings';
 
 function vec4FromVec3(vec: vec3, alpha = 0) {
   const res = vec4.clone([...vec]);
@@ -1849,7 +1849,7 @@ class MulticutSegmentsTool extends LayerTool<SegmentationUserLayer> {
 
     const {body, header} = makeToolActivationStatusMessageWithHeader(activation);
     header.textContent = 'Multicut segments';
-    body.classList.add('graphene-multicut-status');
+    body.classList.add('graphene-tool-status', 'graphene-multicut');
     body.appendChild(makeIcon({
       text: 'Swap',
       title: 'Swap group',
@@ -2120,7 +2120,7 @@ class MergeSegmentsTool extends LayerTool<SegmentationUserLayer> {
     });
     const {body, header} = makeToolActivationStatusMessageWithHeader(activation);
     header.textContent = 'Merge segments';
-    body.classList.add('graphene-merge-segments-status');
+    body.classList.add('graphene-tool-status', 'graphene-merge-segments');
     activation.bindInputEventMap(MERGE_SEGMENTS_INPUT_EVENT_MAP);
     const submitAction = async () => {
       if (merges.value.filter(x => x.locked).length) return;
@@ -2237,7 +2237,7 @@ class FindPathTool extends LayerTool<SegmentationUserLayer> {
 
     const {body, header} = makeToolActivationStatusMessageWithHeader(activation);
     header.textContent = 'Find Path';
-    body.classList.add('graphene-find-path-status');
+    body.classList.add('graphene-tool-status', 'graphene-find-path');
 
     const submitAction = () => {
       findPathState.triggerPathUpdate.dispatch();
@@ -2270,7 +2270,7 @@ class FindPathTool extends LayerTool<SegmentationUserLayer> {
     body.appendChild(label);
 
     const annotationElements = document.createElement('div');
-    annotationElements.classList.add('graphene-find-path-status-annotations');
+    annotationElements.classList.add('find-path-annotations');
     body.appendChild(annotationElements);
 
     const bindings = getDefaultAnnotationListBindings();

diff --git a/src/neuroglancer/datasource/graphene/graphene.css b/src/neuroglancer/datasource/graphene/graphene.css
@@ -10,28 +10,28 @@
   color: #4444ff;
 }
 
-/* .graphene-multicut-status {
+.graphene-tool-status {
   display: flex;
-  flex-direction: row;
-} */
+  gap: 10px;
+}
 
-.graphene-multicut-status > .activeGroupIndicator {
+.graphene-multicut > .activeGroupIndicator {
   padding: 2px;
   margin: auto 0;
   background-color: red;
   font: 12px sans-serif;
   font-weight: 900;
 }
 
-.graphene-multicut-status > .activeGroupIndicator.blueGroup {
+.graphene-multicut > .activeGroupIndicator.blueGroup {
   background-color: blue;
 }
 
-.graphene-multicut-status > .activeGroupIndicator::after {
+.graphene-multicut > .activeGroupIndicator::after {
   content: "Red";
 }
 
-.graphene-multicut-status > .activeGroupIndicator.blueGroup::after {
+.graphene-multicut > .activeGroupIndicator.blueGroup::after {
   content: "Blue";
 }
 
@@ -45,14 +45,7 @@
   gap: 10px;
 }
 
-.graphene-merge-segments-status, .graphene-multicut-status, .graphene-find-path-status{
-  display: flex;
-  gap: 10px;
-}
-
-.graphene-merge-segments-status .neuroglancer-icon,
-.graphene-multicut-status .neuroglancer-icon,
-.graphene-find-path-status .neuroglancer-icon
+.graphene-tool-status .neuroglancer-icon
  {
   height: 100%;
 }
@@ -76,26 +69,21 @@
   display: none;
 }
 
-.graphene-find-path-status {
+.graphene-find-path > label {
   display: flex;
-  flex-direction: row;
 }
 
-.graphene-find-path-status-annotations {
-  display: flex;
-  gap: 10px;
-}
-
-.graphene-find-path-status > label {
+.graphene-find-path > label > span {
   display: flex;
+  align-content: center;
+  flex-wrap: wrap;
 }
 
-.graphene-find-path-status > label > span {
+.find-path-annotations {
   display: flex;
-  align-content: center;
-  flex-wrap: wrap;
+  gap: 10px;
 }
 
-.graphene-find-path-status-annotations > .neuroglancer-annotation-list-entry {
+.find-path-annotations > .neuroglancer-annotation-list-entry {
   background-color: black;
 }
diff --git a/src/neuroglancer/ui/tool.css b/src/neuroglancer/ui/tool.css
@@ -68,7 +68,6 @@
 
 .neuroglancer-tool-status-header {
   align-self: center;
-  white-space: nowrap;
 }
 
 .neuroglancer-tool-status-body {