refactor: moved language toggle to header

aguglie · Jan 13, 2021 · 38035f0 · 38035f0
1 parent ed88bf3
commit 38035f0
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 11 deletions.
diff --git a/src/components/Footer.js b/src/components/Footer.js
@@ -16,9 +16,6 @@ const useStyles = makeStyles((theme) => ({
   contributeBox: {
     marginTop: theme.spacing(0.7),
   },
-  changeLanguageBox: {
-    marginTop: theme.spacing(1),
-  },
   lastUpdateBox: {
     marginBottom: theme.spacing(1),
   },
@@ -45,11 +42,11 @@ const i18n = {
 
 export default function Footer() {
   const classes = useStyles()
-  const [language, setLanguage] = withLanguage()
+  const [language] = withLanguage()
 
   return (
     <Typography variant="body2" color="textSecondary" align="center" className={classes.copyrightBox}>
-      <Box className={classes.lastUpdateBox}>
+      <Box className={classes.lastUpdateBox} fontWeight="fontWeightBold">
         {i18n.LAST_UPDATE[language]} {new Date(buildTime).toLocaleDateString()}
       </Box>
 
@@ -65,11 +62,6 @@ export default function Footer() {
           {i18n.CONTRIBUTE[language]}
         </Link>
       </Box>
-
-      <Box className={classes.changeLanguageBox} onClick={() => setLanguage(language === 'it' ? 'en' : 'it')}>
-        {language === 'it' ? 'Switch to English 🇩🇬' : 'Passa all\' Italiano 🇮🇹'}
-      </Box>
-
     </Typography>
   )
 }
diff --git a/src/components/Header.js b/src/components/Header.js
@@ -9,6 +9,9 @@ const useStyles = makeStyles((theme) => ({
     marginTop: theme.spacing(6),
     marginBottom: theme.spacing(1),
   },
+  changeLanguageBox: {
+    marginBottom: theme.spacing(1),
+  },
 }))
 
 const i18n = {
@@ -24,7 +27,7 @@ const i18n = {
 
 export default function Header() {
   const classes = useStyles()
-  const [language] = withLanguage()
+  const [language, setLanguage] = withLanguage()
 
   return (
     <>
@@ -34,10 +37,16 @@ export default function Header() {
         </Box>
       </Typography>
 
+      <Box textAlign="center" className={classes.changeLanguageBox}
+        onClick={() => setLanguage(language === 'it' ? 'en' : 'it')}>
+        {language === 'it' ? '🇩🇬 Switch to English' : '🇮🇹 Passa all\' Italiano'}
+      </Box>
+
       <Typography className={classes.subTitle} color="textPrimary">
         <Box textAlign="left" fontSize={20}>
           {i18n.INSERT_CITY[language]}
         </Box>
+
       </Typography>
     </>
   )