Everywhere: Rework front page

mguinhos · Feb 21, 2024 · 66b0822 · 66b0822
1 parent a24b27a
commit 66b0822
Show file tree

Hide file tree

Showing 16 changed files with 519 additions and 32 deletions.
diff --git a/public/blueprint.svg b/public/blueprint.svg
diff --git a/public/game_of_life.png b/public/game_of_life.png
diff --git a/public/heart.svg b/public/heart.svg
diff --git a/public/particles.png b/public/particles.png
diff --git a/public/react_calculator.png b/public/react_calculator.png
diff --git a/public/semaphore.svg b/public/semaphore.svg
diff --git a/src/app/globals.css b/src/app/globals.css
@@ -0,0 +1,43 @@
+@font-face {
+    font-family: pixelify_sans;
+    src: url(pixelify_sans.ttf);
+}
+
+body {
+    font-family: pixelify_sans;
+}
+
+.flicker {
+    animation: flickerBubble 1s;
+}
+
+
+@keyframes flickerBubble {
+    0% {
+        transform: translateY(0em);
+    }
+    30% {
+        transform: translateY(-2em);
+    }
+    50% {
+        transform: translateY(0em);
+    }
+}
+
+
+.skill, .experiment {
+
+    transition: all 0.25s ease-in-out;
+}
+
+.skill:hover {
+    transform: translateY(-5mm);
+}
+
+.experiment:hover {
+    transform: translateY(-5mm);
+}
+
+canvas {
+    background-color: transparent;
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -6,13 +6,18 @@ import '@fontsource/roboto/300.css';
 import '@fontsource/roboto/400.css';
 import '@fontsource/roboto/500.css';
 import '@fontsource/roboto/700.css';
+import './globals.css';
 
 import Navbar from "../components/navbar";
+import Footer from "@/components/footer";
 
 const DARK_THEME = createTheme({
     palette: {
         mode: "dark",
     },
+    typography: {
+        fontFamily: 'pixelify_sans'
+    }
 });
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {
@@ -24,9 +29,10 @@ export default function RootLayout({ children }: { children: React.ReactNode })
                     <meta name="viewport" content="width=device-width, initial-scale=1" />
                 </head>
                 <body>
-                    <Box>
-                        <Navbar />
+                    <Box style={{ display: 'flex', flexDirection: 'column', minHeight: '100vh' }}>
+                        <Navbar/>
                         {children}
+                        <Footer/>
                     </Box>
                 </body>
             </ThemeProvider>