diff --git a/js/components/datasets/inspirationDialog.js b/js/components/datasets/inspirationDialog.js index e018ae13c..23aa4c7c4 100644 --- a/js/components/datasets/inspirationDialog.js +++ b/js/components/datasets/inspirationDialog.js @@ -32,8 +32,8 @@ import GroupNglControlButtonsContext from '../preview/molecule/groupNglControlBu const useStyles = makeStyles(theme => ({ paper: { - width: 472, - height: 294, + width: 505, + // height: 294, overflowY: 'hidden' }, molHeader: { @@ -382,11 +382,11 @@ export const InspirationDialog = memo( <> - {Object.keys(moleculeProperty).map(key => ( + {/* {Object.keys(moleculeProperty).map(key => ( {moleculeProperty[key]} - ))} + ))} */} {allSelectedMolecules.length > 0 && ( ({ image: { border: 'solid 1px', borderColor: theme.palette.background.divider, - borderStyle: 'solid solid solid none', + borderStyle: 'none none none solid', position: 'relative' }, imageMargin: { @@ -1203,7 +1203,7 @@ const MoleculeView = memo( - + {/* Title label */} diff --git a/js/components/preview/molecule/observationCmpList.js b/js/components/preview/molecule/observationCmpList.js index c8df5b25f..8479bfb4c 100644 --- a/js/components/preview/molecule/observationCmpList.js +++ b/js/components/preview/molecule/observationCmpList.js @@ -225,6 +225,9 @@ const useStyles = makeStyles(theme => ({ //color: theme.palette.black } }, + selectButton: { + padding: '4px 2px !important' + }, formControl: { color: 'inherit', margin: theme.spacing(1), @@ -416,10 +419,29 @@ export const ObservationCmpList = memo(({ hideProjects }) => { const filterRef = useRef(); const tagEditorRef = useRef(); const scrollBarRef = useRef(); + const hitNavigatorRef = useRef(); const [tagEditorAnchorEl, setTagEditorAnchorEl] = useState(null); + const [hitNavigatorWidth, setHitNavigatorWidth] = useState(0); const areLSHCompoundsInitialized = useSelector(state => state.selectionReducers.areLSHCompoundsInitialized); + useEffect(() => { + if (hitNavigatorRef && hitNavigatorRef.current) { + + const resizeObserver = new ResizeObserver(() => { + if (hitNavigatorRef.current.offsetWidth !== hitNavigatorWidth) { + setHitNavigatorWidth(hitNavigatorRef.current.offsetWidth); + } + }); + + resizeObserver.observe(hitNavigatorRef.current); + + return function cleanup() { + resizeObserver.disconnect(); + } + } + }, [hitNavigatorRef, hitNavigatorWidth]); + if (directDisplay && directDisplay.target) { target = directDisplay.target; } @@ -1060,7 +1082,7 @@ export const ObservationCmpList = memo(({ hideProjects }) => { }; return ( - + { { - +