adjusting the footer layout closes #137

linea-it · May 25, 2024 · ffd90af · ffd90af
1 parent 83337be
commit ffd90af
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 18 deletions.
diff --git a/frontend/components/Footer.js b/frontend/components/Footer.js
@@ -66,25 +66,38 @@ function Footer() {
             </Typography>
           </div>
         </Grid>
+
         <Grid item className={classes.marginItem}>
-          <Typography>
-            <span className={classes.poweredBy}>Powered By</span>
-            <Link
-              href="https://www.linea.org.br/"
-              target="_blank"
-              className={classes.logoLink}
-            >
-              <Image
-                src="/logo.png"
-                alt="LIneA"
-                width={52}
-                height={52}
-                className={classes.logoFooter}
-              />
-            </Link>
-          </Typography>
-          <span className={classes.poweredBy}>Last update: {gitDate} ({gitVersion}) </span>
+          <Grid container
+            direction="column"
+            justifyContent="flex-end"
+            alignItems="flex-end"
+          >
+            <Grid item xs={12} >
+
+              <Typography>
+                <span className={classes.poweredBy}>Powered By</span>
+                <Link
+                  href="https://www.linea.org.br/"
+                  target="_blank"
+                  className={classes.logoLink}
+                >
+                  <Image
+                    src="/logo.png"
+                    alt="LIneA"
+                    width={52}
+                    height={52}
+                    className={classes.logoFooter}
+                  />
+                </Link>
+              </Typography>
+            </Grid>
+            <Grid item xs={12}>
+              <span className={classes.lastUpdate}>Last update: {gitDate} ({gitVersion}) </span>
+            </Grid>
+          </Grid>
         </Grid>
+
       </Grid>
     </footer>
   )

diff --git a/frontend/styles/components/Footer.js b/frontend/styles/components/Footer.js
@@ -4,7 +4,7 @@ const useStyles = makeStyles(theme => ({
   root: {
     width: '100%',
     float: 'right',
-    height: 64,
+    //height: 64,
     position: 'relative',
     zIndex: 2,
     backgroundColor: theme.palette.grey[900],
@@ -36,6 +36,14 @@ const useStyles = makeStyles(theme => ({
     marginRight: 16,
     fontFamily: 'Roboto Condensed'
   },
+  lastUpdate: {
+    display: 'flex',
+    verticalAlign: 'middle',
+    color: '#fff',
+    marginRight: 0,
+    fontFamily: 'Roboto Condensed',
+    fontSize: 12
+  },
   marginItem: {
     marginLeft: 20,
     marginRight: 20,