diff --git a/public/logos/gps-logo.png b/public/logos/gps-logo.png new file mode 100644 index 0000000..6c5bbf2 Binary files /dev/null and b/public/logos/gps-logo.png differ diff --git a/public/logos/juno-logo.png b/public/logos/juno-logo.png new file mode 100644 index 0000000..5e8f15f Binary files /dev/null and b/public/logos/juno-logo.png differ diff --git a/public/logos/meningococcus.png b/public/logos/meningococcus.png new file mode 100644 index 0000000..4d2bb5d Binary files /dev/null and b/public/logos/meningococcus.png differ diff --git a/src/components/Collapsible.js b/src/components/Collapsible.js new file mode 100644 index 0000000..3c37147 --- /dev/null +++ b/src/components/Collapsible.js @@ -0,0 +1,58 @@ +import React, { useState } from "react"; +import Card from "@material-ui/core/Card"; +import Collapse from "@material-ui/core/Collapse"; +import CardHeader from "@material-ui/core/CardHeader"; +import CardContent from "@material-ui/core/CardContent"; +import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import ExpandLessIcon from '@material-ui/icons/ExpandLess'; +import IconButton from "@material-ui/core/IconButton"; +import Avatar from '@material-ui/core/Avatar'; +import Typography from '@material-ui/core/Typography'; +import { makeStyles } from '@material-ui/core/styles' + + +const useStyles = makeStyles(() => ({ + cardHeaderAction: { + margin: "auto" + } +})); + + +const Collapsible = (props) => { + const [open, setOpen] = useState(false); + + const classes = useStyles() + + return ( + <> + + {props.title}} + onClick={() => setOpen(!open)} + action={ + + {open ? : } + + } + avatar={ + + } + classes={{ + action: classes.cardHeaderAction + }} + > + + + + {props.children} + + + + + ); +} + +export default Collapsible \ No newline at end of file diff --git a/src/components/Markdown.js b/src/components/Markdown.js index c2eccf4..711846c 100644 --- a/src/components/Markdown.js +++ b/src/components/Markdown.js @@ -9,7 +9,7 @@ const renderers = { {children} ), - image: props => , + image: props => No description, link: props => , }; diff --git a/src/components/Outreach.js b/src/components/Outreach.js index 1c9ecd1..1fc6cdb 100644 --- a/src/components/Outreach.js +++ b/src/components/Outreach.js @@ -1,9 +1,7 @@ import React from 'react'; -import raw from 'raw.macro'; -import { Grid, Box, Typography, Link } from '@material-ui/core'; +import { Grid, Box, Link } from '@material-ui/core'; import outreach from '../content/outreach'; -import Markdown from './Markdown'; import TeamDescriptionRenderer from './TeamDescriptionRenderer'; const Item = ({ title, url, description, image }) => ( diff --git a/src/components/ResearchThemes.js b/src/components/ResearchThemes.js index d946c40..f80f9ca 100644 --- a/src/components/ResearchThemes.js +++ b/src/components/ResearchThemes.js @@ -2,11 +2,28 @@ import React from 'react'; import raw from 'raw.macro'; import Markdown from './Markdown'; +import Collapsible from './Collapsible'; -const mdResearchThemes = raw('../content/research-themes.md'); +const mdResearchIntro = raw('../content/research-intro.md'); +const mdResearchGPS = raw('../content/research-gps.md'); +const mdResearchJUNO = raw('../content/research-juno.md'); +const mdResearchMeningococcus = raw('../content/research-meningococcus.md'); const ResearchThemes = () => { - return ; + return ( +
+ + + + + + + + + + +
+ ); }; export default ResearchThemes; diff --git a/src/content/research-gps.md b/src/content/research-gps.md new file mode 100644 index 0000000..5db2370 --- /dev/null +++ b/src/content/research-gps.md @@ -0,0 +1 @@ +*Streptococcus pneumoniae* naturally colonises the nasopharynx of healthy individuals but can cause serious invasive diseases such as bacteremia and meningitis and is the leading cause of bacterial pneumonia. Through the [Global Pneumococcal Sequencing Project](https://www.pneumogen.net/) we have worked with partners from >50 countries to a develop a database of >25,000 genomes representing pneumococcal populations in >60 countries before and after the global rollout of pneumococcal conjugate vaccines. Data from GPS is being used to identify future high-risk strains and to design future vaccine formulations that will reduce the burden of disease and antibiotic resistance. Through collaborations with [Paul Turner](https://www.tropmedres.ac/team/paul-turner) and colleagues in South East Asia and [Felix Dube](http://www.mcb.uct.ac.za/mcb/people/staff/academic/felix-dube) and colleagues in South Africa we are using genomics to study microevolution during carriage and transmission in densely sampled human populations. We hope these studies will uncover the selective processes at play, particularly during disease episodes and antibiotic treatment. \ No newline at end of file diff --git a/src/content/research-intro.md b/src/content/research-intro.md new file mode 100644 index 0000000..dc8952e --- /dev/null +++ b/src/content/research-intro.md @@ -0,0 +1,6 @@ +Infectious disease is one of the leading causes of mortality in children under five*. Large-scale genome sequencing, open access data and increasing collaborative networks are enhancing our ability to tackle the challenges of infectious disease from a global standpoint. Through multiple large-scale projects, we aim to understand the evolution of bacterial pathogens associated with pneumonia, meningitis and neonatal sepsis providing global context with a focus on high disease burden in resource-poor settings. + +*[World Health Organization](https://www.who.int/gho/child_health/mortality/causes/en/) + + +#### Our priority pathogens diff --git a/src/content/research-juno.md b/src/content/research-juno.md new file mode 100644 index 0000000..6f20f26 --- /dev/null +++ b/src/content/research-juno.md @@ -0,0 +1 @@ +*Streptococcus agalactiae* (aka Group B Streptococcus or GBS) is an opportunistic pathogen and a major cause of neonatal invasive disease, with a particular impact on infant mortality in low and middle-income countries (LMICs), where disease prevention strategies are less often implemented or have low coverage. Through the [JUNO](https://www.gbsgen.net/) project are conducting a global genomic survey of GBS isolates from across a broad geographical and temporal span with the central aim of informing vaccine development and other disease intervention strategies. The project will focus on three key areas of GBS biology: global genomic diversity, genetic associations with the disease and transmission. diff --git a/src/content/research-meningococcus.md b/src/content/research-meningococcus.md new file mode 100644 index 0000000..02c8580 --- /dev/null +++ b/src/content/research-meningococcus.md @@ -0,0 +1,3 @@ +*Neisseria meningitidis* is found exclusively in humans and is a leading cause of bacterial meningitis and septicaemia. Meningococcal infections are difficult to treat and have a high case fatality rate but, as with the pneumococcus, colonisation is normally asymptomatic. The meningococcus has a substantial disease burden in the meningitis belt of sub-Saharan Africa, where the incidence of infection and disease are much higher than other regions of the world. We work with numerous collaborators to study several population genomic datasets of *N. meningitidis* including a large carriage collection from [Burkina Faso](https://www.ncbi.nlm.nih.gov/pubmed/23914778) (with [Dominique Caugant](http://www.menafrinet.org/en-us/Who/Advisory-Board)), the [MenAfriCar](https://www.thelancet.com/journals/laninf/article/PIIS1473-3099(17)30301-8/fulltext) meningitis belt carriage surveillance project, and a global collection of carriage and disease isolates with considerable temporal spread. Through these studies we hope to understand the evolution that leads to meningococcal disease epidemics in the Meningitis Belt and help to inform future vaccine intervention strategies worldwide. + +*Image: Arthur Charles-Orszag, [Neisseria meningitidis](https://commons.wikimedia.org/wiki/File:Neisseria_meningitidis_Charles-Orszag_2018.png), [CC BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/legalcode)* \ No newline at end of file diff --git a/src/content/research-themes.md b/src/content/research-themes.md deleted file mode 100644 index e6e66ff..0000000 --- a/src/content/research-themes.md +++ /dev/null @@ -1,15 +0,0 @@ -Infectious disease is one of the leading causes of mortality in children under five*. Large-scale genome sequencing, open access data and increasing collaborative networks are enhancing our ability to tackle the challenges of infectious disease from a global standpoint. Through multiple large-scale projects, we aim to understand the evolution of bacterial pathogens associated with pneumonia, meningitis and neonatal sepsis providing global context with a focus on high disease burden in resource-poor settings. - -*[World Health Organization](https://www.who.int/gho/child_health/mortality/causes/en/) - - -#### Our priority pathogens - -##### *Streptococcus pneumoniae* -*Streptococcus pneumoniae* naturally colonises the nasopharynx of healthy individuals but can cause serious invasive diseases such as bacteremia and meningitis and is the leading cause of bacterial pneumonia. Through the [Global Pneumococcal Sequencing Project](https://www.pneumogen.net/) we have worked with partners from >50 countries to a develop a database of >25,000 genomes representing pneumococcal populations in >60 countries before and after the global rollout of pneumococcal conjugate vaccines. Data from GPS is being used to identify future high-risk strains and to design future vaccine formulations that will reduce the burden of disease and antibiotic resistance. Through collaborations with [Paul Turner](https://www.tropmedres.ac/team/paul-turner) and colleagues in South East Asia and [Felix Dube](http://www.mcb.uct.ac.za/mcb/people/staff/academic/felix-dube) and colleagues in South Africa we are using genomics to study microevolution during carriage and transmission in densely sampled human populations. We hope these studies will uncover the selective processes at play, particularly during disease episodes and antibiotic treatment. - -##### *Neisseria meningitidis* -*Neisseria meningitidis* is found exclusively in humans and is a leading cause of bacterial meningitis and septicaemia. Meningococcal infections are difficult to treat and have a high case fatality rate but, as with the pneumococcus, colonisation is normally asymptomatic. The meningococcus has a substantial disease burden in the meningitis belt of sub-Saharan Africa, where the incidence of infection and disease are much higher than other regions of the world. We work with numerous collaborators to study several population genomic datasets of *N. meningitidis* including a large carriage collection from [Burkina Faso](https://www.ncbi.nlm.nih.gov/pubmed/23914778) (with [Dominique Caugant](http://www.menafrinet.org/en-us/Who/Advisory-Board)), the [MenAfriCar](https://www.thelancet.com/journals/laninf/article/PIIS1473-3099(17)30301-8/fulltext) meningitis belt carriage surveillance project, and a global collection of carriage and disease isolates with considerable temporal spread. Through these studies we hope to understand the evolution that leads to meningococcal disease epidemics in the Meningitis Belt and help to inform future vaccine intervention strategies worldwide. - -##### *Streptococcus agalactiae* -*Streptococcus agalactiae* (aka Group B Streptococcus or GBS) is an opportunistic pathogen and a major cause of neonatal invasive disease, with a particular impact on infant mortality in low and middle-income countries (LMICs), where disease prevention strategies are less often implemented or have low coverage. Through the [JUNO](https://www.gbsgen.net/) project are conducting a global genomic survey of GBS isolates from across a broad geographical and temporal span with the central aim of informing vaccine development and other disease intervention strategies. The project will focus on three key areas of GBS biology: global genomic diversity, genetic associations with the disease and transmission.