add github action

Author: akshaybheda

.github/workflows/deploy-gh-pages.yml

@@ -0,0 +1,37 @@
+name: Deploy portfolio to GitHub Pages
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+
+      - name: Cache npm
+        uses: actions/cache@v4
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('portfolio/package-lock.json', 'portfolio/pnpm-lock.yaml', 'portfolio/package.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Install dependencies (portfolio)
+        run: npm install --prefix portfolio
+
+      - name: Build (portfolio)
+        run: npm run build --prefix portfolio
+
+      - name: Deploy to gh-pages
+        run: npm run gh-pages --prefix portfolio
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

portfolio/src/components/Homepage/Homepage.tsx

@@ -5,13 +5,13 @@ import Techstack from "../Techstack/Techstack";
 function Homepage() {
   return (
     <>
-  <div id="home">
+      <div id="home">
         <MyInfo />
       </div>
-  <div id="timeline">
+      <div id="timeline">
         <MyTimeLine />
       </div>
-  <div id="tech-stack">
+      <div id="tech-stack">
         <Techstack />
       </div>
     </>

portfolio/src/components/NavBar/Navbar.tsx

@@ -99,39 +99,39 @@ function Navbar() {
               onClose={handleCloseNavMenu}
             >
               {pages.map((page) => (
-                  <Button
-                    key={page}
-                    onClick={() => {
-                      const slug = page.replace(/\s+/g, "-").toLowerCase();
-                      if (page === "Resume") {
-                        window.open(Resume, "_blank"); // Open resume in new tab
-                      } else if (page === "Projects") {
-                        window.location.hash = "#/project"; // Use hash-based navigation
-                      } else if (page === "Open Source") {
-                        window.location.hash = "#/opensource"; // Use hash-based navigation
+                <Button
+                  key={page}
+                  onClick={() => {
+                    const slug = page.replace(/\s+/g, "-").toLowerCase();
+                    if (page === "Resume") {
+                      window.open(Resume, "_blank"); // Open resume in new tab
+                    } else if (page === "Projects") {
+                      window.location.hash = "#/project"; // Use hash-based navigation
+                    } else if (page === "Open Source") {
+                      window.location.hash = "#/opensource"; // Use hash-based navigation
+                    } else {
+                      if (window.location.hash !== "#/") {
+                        // Store target section in sessionStorage
+                        sessionStorage.setItem("scrollTo", slug);
+                        window.location.hash = "#/"; // Redirect to homepage
                       } else {
-                        if (window.location.hash !== "#/") {
-                          // Store target section in sessionStorage
-                          sessionStorage.setItem("scrollTo", slug);
-                          window.location.hash = "#/"; // Redirect to homepage
-                        } else {
-                          const el = document.getElementById(slug);
-                          el?.scrollIntoView({ behavior: "smooth", block: "start" });
-                        }
+                        const el = document.getElementById(slug);
+                        el?.scrollIntoView({ behavior: "smooth", block: "start" });
                       }
-                    }}
-                    sx={{
-                      my: 0,
-                      display: "block",
-                      color: mode == "light" ? "black" : "white",
-                      p: 1,
-                    }}
-                  >
-                    <Typography sx={{ textAlign: "center" }}>
-                      {page}
-                    </Typography>
-                  </Button>
-                ))}
+                    }
+                  }}
+                  sx={{
+                    my: 0,
+                    display: "block",
+                    color: mode == "light" ? "black" : "white",
+                    p: 1,
+                  }}
+                >
+                  <Typography sx={{ textAlign: "center" }}>
+                    {page}
+                  </Typography>
+                </Button>
+              ))}
             </Menu>
           </Box>
           <Box

portfolio/src/components/Projects/ProjectCard.tsx

@@ -52,7 +52,7 @@ export default function ProjectCard(props: ProjectInfo) {
           <CardContent>
             <Typography variant="body1">{Description}</Typography>
           </CardContent>
-          <CardActions title="Learn More!" disableSpacing sx={{padding: 0}}>
+          <CardActions title="Learn More!" disableSpacing sx={{ padding: 0 }}>
             <ExpandMore
               expand={expanded}
               data-expanded={expanded}