update logo, refactor paths for games

ayan4m1 · Feb 7, 2024 · 29bfdfe · 29bfdfe
1 parent 504e436
commit 29bfdfe
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 4 deletions.
diff --git a/src/components/header.js b/src/components/header.js
@@ -17,6 +17,8 @@ import { Container, Navbar, Nav, NavDropdown, Button } from 'react-bootstrap';
 
 import { useThemeContext } from 'hooks/useThemeContext';
 
+import icon from '../images/gatsby-icon.png';
+
 export default function Header() {
   const { darkMode, toggleDarkMode } = useThemeContext();
   const data = useStaticQuery(graphql`
@@ -40,7 +42,13 @@ export default function Header() {
   return (
     <Navbar variant="dark" bg="primary" expand="lg">
       <Container>
-        <Navbar.Brand className="pt-2 pb-2">
+        <Navbar.Brand className="py-2 d-flex align-items-center">
+          <img
+            src={icon}
+            alt="Sloth Face"
+            style={{ height: 32 }}
+            className="me-2"
+          />
           <Link to="/" className="text-light">
             {data.site.siteMetadata.title}
           </Link>
@@ -79,13 +87,13 @@ export default function Header() {
                 </Fragment>
               }
             >
-              <Nav.Link as={Link} to="/sudoku" className="text-dark">
+              <Nav.Link as={Link} to="/games/sudoku" className="text-dark">
                 <FontAwesomeIcon icon={faTable} /> Sudoku
               </Nav.Link>
-              <Nav.Link as={Link} to="/mahjong" className="text-dark">
+              <Nav.Link as={Link} to="/games/mahjong" className="text-dark">
                 <FontAwesomeIcon icon={faRectangleList} /> Mahjong
               </Nav.Link>
-              <Nav.Link as={Link} to="/coloree" className="text-dark">
+              <Nav.Link as={Link} to="/games/coloree" className="text-dark">
                 <FontAwesomeIcon icon={faPaintBrush} /> Coloree
               </Nav.Link>
             </NavDropdown>

diff --git a/src/images/gatsby-icon.png b/src/images/gatsby-icon.png
diff --git a/src/pages/coloree.js → src/pages/games/coloree.js b/src/pages/coloree.js → src/pages/games/coloree.js
diff --git a/src/pages/mahjong.js → src/pages/games/mahjong.js b/src/pages/mahjong.js → src/pages/games/mahjong.js
diff --git a/src/pages/sudoku.js → src/pages/games/sudoku.js b/src/pages/sudoku.js → src/pages/games/sudoku.js
diff --git a/src/utils/index.js b/src/utils/index.js
@@ -0,0 +1,10 @@
+export const readFile = (file) =>
+  new Promise((resolve, reject) => {
+    const reader = new FileReader();
+
+    reader.addEventListener('load', ({ target: { result } }) =>
+      resolve(result)
+    );
+    reader.addEventListener('error', () => reject('Failed to parse file'));
+    reader.readAsText(file);
+  });