Merge remote-tracking branch 'remotes/origin/#435' into allfunctionality

m2ms · Oct 7, 2020 · f462da8 · f462da8
2 parents 8a25e91 + 8242847
commit f462da8
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 21 deletions.
diff --git a/js/components/funders/fundersModal.js b/js/components/funders/fundersModal.js
@@ -18,11 +18,15 @@ const useStyles = makeStyles(theme => ({
     display: 'block',
     maxWidth: '72%',
     maxHeight: '100%'
+  },
+  customModal: {
+    width: '80%'
   }
 }));
 
 export const FundersModal = memo(({ openModal, onModalClose }) => {
   const classes = useStyles();
+  const columnLayout = 3;
 
   if (openModal === undefined) {
     console.log('undefined openModal');
@@ -87,72 +91,82 @@ export const FundersModal = memo(({ openModal, onModalClose }) => {
   const openMolsoft = () => {
     openLink('https://www.molsoft.com/');
   };
+  const openCovidMoonshot = () => {
+    openLink('https://covid.postera.ai/covid');
+  };
 
   return (
-    <Modal open={openModal} onClose={() => onModalClose()}>
+    <Modal otherClasses={classes.customModal} open={openModal} onClose={() => onModalClose()}>
       <Typography variant="h5">Funded by:</Typography>
-      <Grid container justify="center" alignItems="center">
-        <Grid item xs={4} md={4} className={classes.image}>
+      <Grid container justify="flex-start" alignItems="center">
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/xchemLogo.png')} className={classes.img} onClick={() => openXchem()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/dlsLogo.png')} className={classes.img} onClick={() => openDls()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/sgcLogo.png')} className={classes.img} onClick={() => openSgc()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/mrcLogo.png')} className={classes.img} onClick={() => openMrc()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/wtLogo.png')} className={classes.img} onClick={() => openWt()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/inextLogo.png')} className={classes.img} onClick={() => openInext()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/jffLogo.jpg')} className={classes.img} onClick={() => openJff()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/ultraddLogo.png')} className={classes.img} onClick={() => openUltradd()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/nfLogo.png')} className={classes.img} onClick={() => openNf()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/imiLogo.png')} className={classes.img} onClick={() => openImi()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/horizon2020Logo.jpg')} className={classes.img} onClick={() => openHorizon()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/janssenLogo.png')} className={classes.img} onClick={() => openJanssen()} />
         </Grid>
       </Grid>
       <Typography variant="h5">Contributors and collaborators:</Typography>
-      <Grid container justify="center" alignItems="center">
-        <Grid item xs={4} md={4} className={classes.image}>
+      <Grid container justify="flex-start" alignItems="center">
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/m2msLogo.png')} className={classes.img} onClick={() => openM2ms()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img
             src={require('../../img/informaticsLogo.png')}
             className={classes.img}
             onClick={() => openInformatics()}
           />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/acelleraLogo.png')} className={classes.img} onClick={() => openAcellera()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/oxrseLogo.png')} className={classes.img} onClick={() => openOxrse()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/molsoftLogo.png')} className={classes.img} onClick={() => openMolsoft()} />
         </Grid>
-        <Grid item xs={4} md={4} className={classes.image}>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
           <img src={require('../../img/janssenLogo.png')} className={classes.img} onClick={() => openJanssen()} />
         </Grid>
+        <Grid item xs={columnLayout} md={columnLayout} className={classes.image}>
+          <img
+            src={require('../../img/covidMoonshotLogo.png')}
+            className={classes.img}
+            onClick={() => openCovidMoonshot()}
+          />
+        </Grid>
       </Grid>
     </Modal>
   );

diff --git a/js/components/header/index.js b/js/components/header/index.js
@@ -115,6 +115,11 @@ export default memo(
       window.open('https://www.janssen.com/', '_blank');
     };
 
+    const openCovidMoonshot = () => {
+      // window.location.href = 'https://covid.postera.ai/covid';
+      window.open('https://covid.postera.ai/covid', '_blank');
+    };
+
     let authListItem;
 
     let username = null;
@@ -244,6 +249,14 @@ export default memo(
                     onClick={openJanssen}
                   />
                 </Grid>
+                <Grid item>
+                  <img
+                    src={require('../../img/covidMoonshotLogo.png')}
+                    height="20"
+                    className={classes.clickableImage}
+                    onClick={openCovidMoonshot}
+                  />
+                </Grid>
                 <Grid item>
                   <Button
                     startIcon={<SupervisorAccount />}

diff --git a/js/img/covidMoonshotLogo.png b/js/img/covidMoonshotLogo.png