curator/ui: use Inter everywhere

verification/curator-service/ui/src/components/DataGuideDialog.tsx

@@ -40,6 +40,7 @@ const styles = (theme: Theme) =>
             cursor: 'pointer',
         },
         title: {
+            fontFamily: 'Inter',
             fontSize: 22,
             fontWeight: 'bold',
         },
@@ -60,6 +61,7 @@ const styles = (theme: Theme) =>
             },
         },
         textSection: {
+            fontFamily: 'Inter',
             marginBottom: '1rem',
         },
     });

verification/curator-service/ui/src/components/LinelistTable/Header.tsx

@@ -52,7 +52,7 @@ const Header = () => {
 
     return (
         <Stack direction="row" spacing={3} alignItems="center">
-            <Typography variant="body1">{diseaseName} Linelist</Typography>
+            <Typography variant="inherit">{diseaseName} Linelist</Typography>
 
             <FormControl sx={{ minWidth: 200 }} variant="standard" size="small">
                 <InputLabel id="sort-by-select-label">Sort by</InputLabel>

verification/curator-service/ui/src/components/ViewCase.tsx

@@ -94,6 +94,7 @@ const useStyles = makeStyles((theme) => ({
     },
     caseTitle: {
         marginTop: '1em',
+        fontFamily: 'Inter',
     },
     grid: {
         margin: '1em',
@@ -848,7 +849,7 @@ function RowContent(props: { content: string; isLink?: boolean }): JSX.Element {
     words(searchQuery);
 
     return (
-        <Grid item xs={8}>
+        <Grid item xs={8} style={{ fontSize: 14 }}>
             {props.isLink && props.content ? (
                 <a
                     href={createHref(props.content)}
@@ -880,7 +881,7 @@ function MultilinkRowContent(props: {
     links?: { title: string; link: string }[];
 }): JSX.Element {
     return (
-        <Grid item xs={8}>
+        <Grid item xs={8} style={{ fontSize: 14 }}>
             {props.links?.map((e) => (
                 <p key={e.title} style={{ margin: 0 }}>
                     <a

verification/curator-service/ui/src/index.css

@@ -1,11 +1,13 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap');
+
 html {
     height: 100%;    
 }
 
 body {
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
+    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
         'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
         'Helvetica Neue', sans-serif;
     margin: 0;
@@ -28,93 +30,10 @@ a {
     height: 100%;
 }
 
-/*
- * Web Fonts from colophon-foundry.org
- *
- * The fonts included in this stylesheet are subject to the End User License you purchased
- * from Colophon Foundry. The fonts are protected under domestic and international trademark and
- * copyright law. You are prohibited from modifying, reverse engineering, duplicating, or
- * distributing this font software.
- *
- * (c) 2020 Colophon Foundry
- *
- * Licenced to University of Oxford 
- */
-
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-regular-pro/mabry-regular-pro.ttf) format('truetype'),
-        url(./fonts/mabry-regular-pro/mabry-regular-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-regular-pro/mabry-regular-pro.woff2) format('woff2'),
-        url(./fonts/mabry-regular-pro/mabry-regular-pro.woff) format('woff');
-    font-weight: normal;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-bold-pro/mabry-bold-pro.ttf) format('truetype'),
-        url(./fonts/mabry-bold-pro/mabry-bold-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-bold-pro/mabry-bold-pro.woff2) format('woff2'),
-        url(./fonts/mabry-bold-pro/mabry-bold-pro.woff) format('woff');
-    font-weight: bold;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-light-pro/mabry-light-pro.ttf) format('truetype'),
-        url(./fonts/mabry-light-pro/mabry-light-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-light-pro/mabry-light-pro.woff2) format('woff2'),
-        url(./fonts/mabry-light-pro/mabry-light-pro.woff) format('woff');
-    font-weight: lighter;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-italic-pro/mabry-italic-pro.ttf) format('truetype'),
-        url(./fonts/mabry-italic-pro/mabry-italic-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-italic-pro/mabry-italic-pro.woff2) format('woff2'),
-        url(./fonts/mabry-italic-pro/mabry-italic-pro.woff) format('woff');
-    font-weight: normal;
-    font-style: italic;
-}
-
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-bold-italic-pro/mabry-bold-italic-pro.ttf)
-            format('truetype'),
-        url(./fonts/mabry-bold-italic-pro/mabry-bold-italic-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-bold-italic-pro/mabry-bold-italic-pro.woff2)
-            format('woff2'),
-        url(./fonts/mabry-bold-italic-pro/mabry-bold-italic-pro.woff)
-            format('woff');
-    font-weight: bold;
-    font-style: italic;
+.MuiTypography-root {
+    font-family: Inter !important;
 }
 
-@font-face {
-    font-family: 'Mabry Pro';
-    src: local('Mabry Pro'),
-        url(./fonts/mabry-light-italic-pro/mabry-light-italic-pro.ttf)
-            format('truetype'),
-        url(./fonts/mabry-light-italic-pro/mabry-light-italic-pro.eot?#iefix)
-            format('embedded-opentype'),
-        url(./fonts/mabry-light-italic-pro/mabry-light-italic-pro.woff2)
-            format('woff2'),
-        url(./fonts/mabry-light-italic-pro/mabry-light-italic-pro.woff)
-            format('woff');
-    font-weight: lighter;
-    font-style: italic;
+.MuiTypography-h1 {
+    font-size: 50px !important;
 }

verification/curator-service/ui/src/theme/theme.ts

@@ -73,7 +73,7 @@ export const theme = createTheme({
         },
     },
     typography: {
-        fontFamily: 'Mabry Pro, sans-serif',
+        fontFamily: 'Inter, sans-serif',
         fontSize: 14,
     },
     shape: {
@@ -118,7 +118,26 @@ export const theme = createTheme({
                     },
                     '&&& .MuiTypography-root': {
                         fontFamily: 'Inter',
-                        fontSize: '14px',
+                    },
+                },
+            },
+        },
+        MuiPaper: {
+            styleOverrides: {
+                root: {
+                    fontFamily: 'Inter',
+                    '&&& .MuiTypography-root': {
+                        fontFamily: 'Inter',
+                    },
+                },
+            },
+        },
+        MuiTypography: {
+            styleOverrides: {
+                root: {
+                    fontFamily: 'Inter',
+                    '&&& .MuiTypography-root': {
+                        fontFamily: 'Inter',
                     },
                 },
             },