Merge pull request #68 from Chicago-Deep-Dish/fixSettings

Fix settings
Chicago-Deep-Dish · Jul 1, 2022 · 413e5e9 · 413e5e9
2 parents a46f125 + 045d4ee
commit 413e5e9
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 16 deletions.
diff --git a/src/components/HomePage/DashBoard/Graph1.js b/src/components/HomePage/DashBoard/Graph1.js
@@ -377,7 +377,8 @@ if ( graph==='totalTime'&&selection==='difficulty') {
           axisLabel: {
             formatter: (function(value){
                 return moment(value).format('MM/DD');
-            })
+            }),
+            hideOverlap: true
           }
         }
       ,
@@ -392,16 +393,14 @@ if ( graph==='totalTime'&&selection==='difficulty') {
 return (
   <Stack sx={{ alignItems: "start" }} direction="row" onMouseLeave={()=>{setSettingsVisible(false)}} onMouseEnter={()=>{setSettingsVisible(true)}}>
     {!settingsView?
-      <Box sx={{ '&:hover':{boxShadow:3},   width:'270px', ml:4, mr:4, mt:1,mb:2}}   onMouseEnter={()=>{setSettingsVisible(true)}}>
-        <ReactEcharts sx={{ '&:hover':{boxShadow:3},   width:'270px', height:'200px', ml:4, mr:4, mt:1,mb:2}} option={option} />
+      <Box sx={{ '&:hover':{boxShadow:3},   width:'270px', height:'300px', ml:4, mr:4, mt:1,mb:2}}   onMouseEnter={()=>{setSettingsVisible(true)}}>
+        <ReactEcharts sx={{ '&:hover':{boxShadow:3},   width:'270px', height:'300px', ml:4, mr:4, mt:1,mb:2}} option={option} />
       </Box>
       :
       <MenuBar graph={graph} setGraph={setGraph} subject= {subject} handleSubject={handleSubject} selection={selection} setSelection={setSelection} time={time} range={range} language={language} handleRange={handleRange} handleLanguage={handleLanguage} handleTime={handleTime} handleGraph={handleGraph} handleSelection={handleSelection}/>
     }
-    {settingsVisible?
-      <Settings setSettingsView={setSettingsView} settingsView={settingsView} ></Settings>:
-      null
-    }
+    <Settings setSettingsView={setSettingsView} settingsView={settingsView} settingsVisible={settingsVisible} ></Settings>
+
   </Stack>
 )
 }

diff --git a/src/components/HomePage/DashBoard/Graph2.js b/src/components/HomePage/DashBoard/Graph2.js
@@ -337,7 +337,8 @@ if ( graph==='totalTime'&&selection==='difficulty') {
       axisLabel: {
         formatter: (function(value){
             return moment(value).format('MM/DD');
-        })
+        }),
+        hideOverlap: true
       }
     },
     yAxis: {
@@ -348,16 +349,13 @@ if ( graph==='totalTime'&&selection==='difficulty') {
   return (
       <Stack   sx={{ alignItems: "start" }} direction="row" onMouseLeave={()=>{setSettingsVisible(false)}} onMouseEnter={()=>{setSettingsVisible(true)}}>
     {!settingsView?
-      <Box sx={{ '&:hover':{boxShadow:3},  width:'270px', height:'200px', ml:4, mr:4, mt:1,mb:2}}  onMouseEnter={()=>{setSettingsVisible(true)}}>
-        <ReactEcharts sx={{ '&:hover':{boxShadow:3},   width:'270px', height:'200px', ml:4, mr:4, mt:1,mb:2}} option={option} />
+      <Box sx={{ '&:hover':{boxShadow:3},  width:'270px', height:'300px', ml:4, mr:4, mt:1,mb:2}}  onMouseEnter={()=>{setSettingsVisible(true)}}>
+        <ReactEcharts sx={{ '&:hover':{boxShadow:3},   width:'270px', height:'300px', ml:4, mr:4, mt:1,mb:2}} option={option} />
       </Box>
       :
       <MenuBar  pagraph={graph} setGraph={setGraph} subject= {subject} handleSubject={handleSubject} selection={selection} setSelection={setSelection} time={time} range={range} language={language} handleRange={handleRange} handleLanguage={handleLanguage} handleTime={handleTime} handleGraph={handleGraph} handleSelection={handleSelection}/>
     }
-    {settingsVisible?
-      <Settings setSettingsView={setSettingsView} settingsView={settingsView} ></Settings>:
-      null
-    }
+    <Settings setSettingsView={setSettingsView} settingsView={settingsView} settingsVisible={settingsVisible} ></Settings>
   </Stack>
   )
 };
diff --git a/src/components/HomePage/DashBoard/SettingsPopOver.js b/src/components/HomePage/DashBoard/SettingsPopOver.js
@@ -3,11 +3,13 @@ import Stack from '@mui/material/Stack';
 import IconButton from '@mui/material/IconButton';
 import SettingsApplicationsIcon from '@mui/icons-material/SettingsApplications';
 
-export default function IconButtonSizes({setSettingsView, settingsView}) {
+export default function IconButtonSizes({setSettingsView, settingsView, settingsVisible}) {
+
   return (
     <Stack direction="row" alignItems="center" spacing={1}>
       <IconButton aria-label="delete" size="small" onClick={()=>{console.log(settingsView); setSettingsView(!settingsView)}}>
-        <SettingsApplicationsIcon fontSize="small" />
+
+      {settingsVisible? <SettingsApplicationsIcon  opacity={'1'} fontSize="small" />:<SettingsApplicationsIcon  opacity={'0'} fontSize="small" />}
       </IconButton>
     </Stack>
   );