fix: some fixing against the refine UI task (#338)

* fix: some fixing agiant the refine UI task * chore: remove unused code * chore: remove unused dependencies Co-authored-by: Nick Charlton <[email protected]>
Greenstand · Jan 29, 2022 · 50ff2b9 · 50ff2b9
1 parent 7056d88
commit 50ff2b9
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 46 deletions.
diff --git a/src/components/CaptureMatching/CaptureImage.js b/src/components/CaptureMatching/CaptureImage.js
@@ -64,7 +64,7 @@ const useStyles = makeStyles((theme) => ({
   imgBox: {
     // height: '52vh',
     flexGrow: 1,
-    overflow: 'scroll',
+    overflow: 'auto',
   },
 
   imgContainer: {

diff --git a/src/components/CaptureMatching/CaptureMatchingView.js b/src/components/CaptureMatching/CaptureMatchingView.js
@@ -6,10 +6,9 @@ import CandidateImages from './CandidateImages';
 import Navbar from '../Navbar';
 
 import { makeStyles } from '@material-ui/core/styles';
-import { Grid, Box, Paper, Typography } from '@material-ui/core';
+import { Grid, Box, Paper } from '@material-ui/core';
 import NatureOutlinedIcon from '@material-ui/icons/NatureOutlined';
 import { documentTitle } from '../../common/variables';
-import Fab from '@material-ui/core/Fab';
 
 const useStyle = makeStyles((theme) => ({
   container: {
@@ -34,13 +33,7 @@ const useStyle = makeStyles((theme) => ({
   box2: {
     padding: theme.spacing(4, 4),
     width: '50%',
-    overflow: 'scroll',
-  },
-  fab: {
-    color: 'white',
-    position: 'absolute',
-    right: '16px',
-    backgroundColor: 'rgba(118, 187, 35, .8)',
+    overflow: 'auto',
   },
 }));
 
@@ -122,28 +115,6 @@ function CaptureMatchingView() {
     setImgCount(captureImages.length);
   }, [captureImages]);
 
-  // detect scroll
-  const refBox = React.useRef(null);
-  const [floatTreeIcon, setFloatTreeIcon] = useState(false);
-  useEffect(() => {
-    function checkPosition() {
-      const pos = refBox.current.scrollTop;
-      console.warn('ref:', pos);
-      if (parseInt(pos) > 144 && !floatTreeIcon) {
-        console.warn('show float icon');
-        setFloatTreeIcon(true);
-      }
-      if (parseInt(pos) < 144 && floatTreeIcon) {
-        console.warn('close float icon');
-        setFloatTreeIcon(false);
-      }
-    }
-
-    refBox.current.addEventListener('scroll', checkPosition);
-    checkPosition();
-    return () => window.removeEventListener('scroll', checkPosition);
-  }, []);
-
   // Capture Image Pagination function
   const handleChange = (e, value) => {
     setCurrentPage(value);
@@ -203,19 +174,7 @@ function CaptureMatchingView() {
             handleSkip={handleSkip}
           />
         </Paper>
-        <Box className={classes.box2} ref={refBox}>
-          {floatTreeIcon && (
-            <Fab
-              color="primary"
-              aria-label="add"
-              className={classes.fab}
-              onClick={() => {
-                refBox.current.scrollTo(0, 0);
-              }}
-            >
-              <Typography variant="h5">{treesCount}</Typography>
-            </Fab>
-          )}
+        <Box className={classes.box2}>
           <Box className={classes.candidateIconBox}>
             <CurrentCaptureNumber
               text={`Candidate Match${(treesCount !== 1 && 'es') || ''}`}

diff --git a/src/components/CaptureMatching/CurrentCaptureNumber.js b/src/components/CaptureMatching/CurrentCaptureNumber.js
@@ -30,7 +30,6 @@ const useStyles = makeStyles((t) => ({
   },
   box4: {},
   text: {
-    fontFamily: 'Roboto',
     fontSize: '12px',
     fontStyle: 'normal',
     fontWeight: '400',