0xTijan · SupremeSingh · Oct 14, 2022 · Oct 14, 2022 · Oct 16, 2022
diff --git a/.gitpod.yml b/.gitpod.yml
@@ -0,0 +1,9 @@
+# This configuration file was automatically generated by Gitpod.
+# Please adjust to your needs (see https://www.gitpod.io/docs/config-gitpod-file)
+# and commit this file to your remote git repository to share the goodness with others.
+
+tasks:
+  - init: npm install && npm run build
+    command: npm run start
+
+
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/hi.ico b/public/hi.ico
diff --git a/public/hi.png b/public/hi.png
diff --git a/public/icon.ico b/public/icon.ico
diff --git a/public/index.html b/public/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/hi.ico" />
+    <link rel="icon" href="%PUBLIC_URL%/mustard.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta
@@ -24,7 +24,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>Tijan Web3</title>
+    <title>Manmit Singh</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/public/manifest.json b/public/manifest.json
@@ -1,19 +1,19 @@
 {
-  "short_name": "Tijan - Portfolio",
+  "short_name": "Manmit Singh",
   "name": "My Developer Portfolio",
   "icons": [
     {
-      "src": "hi.ico",
+      "src": "mustard.ico",
       "sizes": "64x64 32x32 24x24 16x16",
       "type": "image/x-icon"
     },
     {
-      "src": "hi.png",
+      "src": "mustard.png",
       "type": "image/png",
       "sizes": "192x192"
     },
     {
-      "src": "hi.png",
+      "src": "mustard.png",
       "type": "image/png",
       "sizes": "512x512"
     }

diff --git a/public/mustard.ico b/public/mustard.ico
diff --git a/public/mustard.png b/public/mustard.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,21 +1,17 @@
-import React from 'react';
-import logo from './logo.svg';
 import About from './components/about/About';
 import Skills from './components/skills/Skills';
-import Projects from './components/projects/Projects';
-import Certificates from './components/certificates/Certificates';
+import Problem from './components/problems/Problem';
+import Background from './components/background/Background';
 import Contact from './components/contact/Contact';
-import Footer from './components/footer/Footer';
 
 function App() {
   return (
     <>
       <About />
+      <Background />
+      <Problem />
       <Skills />
-      <Projects />
-      <Certificates />
       <Contact />
-      <Footer />
     </>
   );
 }

diff --git a/src/components/about/About.tsx b/src/components/about/About.tsx
@@ -1,9 +1,8 @@
 import React, { useState } from "react";
 import { Heading, Text, Button, CloseButton } from '@chakra-ui/react';
-import { AiFillGithub, AiFillTwitterCircle, AiOutlineArrowRight } from "react-icons/ai";
+import { AiFillGithub, AiFillTwitterCircle, AiFillLinkedin, AiOutlineArrowRight } from "react-icons/ai";
 import { BsTelegram, BsChevronDown } from "react-icons/bs";
-import { FaDiscord  } from "react-icons/fa";
-import avatar from "./../../images/hi.png";
+import avatar from "../../images/avatar.jpg";
 import "./About.css";
 
 
@@ -30,7 +29,7 @@ const About = () => {
     if(isVisible) {
       return(
         <div className="alert">
-          <Heading as="h3" size={getAlertSize()}>💻{"   "}<a href="mailto:[email protected]" className="contact-link">Hire Me!</a></Heading>
+          <Heading as="h3" size={getAlertSize()}>{"   "}<a href="https://github.com/SupremeSingh/Awesome-ZK" className="contact-link">Working on ZK STARKs? Let's Talk!</a></Heading>
           <CloseButton size='lg' className="close-btn" onClick={() => hide()} />
         </div>
       )
@@ -50,33 +49,37 @@ const About = () => {
               Hi! 👋
             </Heading>
             <Heading as='h1' fontSize={getFontSize()} size='4xl'>
-              I'm <span className="name">Tijan</span>
+              I'm <span className="name">Manmit</span>
             </Heading>
           </div>
           <div className="about-text-desc">
-            <Text fontSize='3xl'>passionate <span className="name">BLOCKCHAIN DEVELOPER</span> from Slovenia with almost 2 years of experience in blockchain development, enthusiastic about blockchain and web3 industry, looking forward to learn something new every day and contribute to the industry!</Text>
+            <Text fontSize='3xl'>a passionate <span className="name">buidler</span> with a focus on <span className="name">ZK Proofs, ReFi and DeSci</span>. I'm based out of Durham, North Carolina and have now been in the web3 space since 2018. 
+            I'm always eager to meet and learn from other people building the future of the web.</Text>
           </div>
 
           <div className="icons">
-            <a href="https://github.com/0xTijan" target="_blank">
+            <a href="https://github.com/SupremeSingh" target="_blank">
               <AiFillGithub className="icon" />
             </a>
-            <a href="https://twitter.com/0xTijan" target="_blank">
+            <a href="https://twitter.com/man_meat_singh" target="_blank">
               <AiFillTwitterCircle className="icon" />
             </a>
-            <a href="https://t.me/TijanWeb3" target="_blank">
+            <a href="https://www.linkedin.com/in/manmit-singh99/" target="_blank">
+              <AiFillLinkedin className="icon" />
+            </a>
+            <a href="https://t.me/money_singh01" target="_blank">
               <BsTelegram className="icon" />
             </a>
           </div>
 
-          <a href="mailto:[email protected]">
+          <a href="mailto:[email protected]">
             <Button size='lg' rightIcon={<AiOutlineArrowRight />} colorScheme="blue" variant='solid'>
               Contact Me
             </Button>
           </a>
         </div>
         <div className="about-avatar">
-          <img src={avatar} className="avatar" alt="Tijan Bitmoji" />
+          <img src={avatar} className="avatar" alt="Manmit Avatar" />
         </div>
       </div>
       <div className="icon-wrapper">

diff --git a/src/components/background/Background.css b/src/components/background/Background.css
@@ -0,0 +1,11 @@
+@import url("./../../App.css");
+
+.bg-certificats {
+  background-color: var(--light-bg);
+  height: fit-content;
+  color: var(--text-dark);
+  padding-left: 5vw;
+  padding-right: 5vw;
+  padding-top: 10vh;
+  padding-bottom: 10vh;
+}
diff --git a/src/components/background/Background.tsx b/src/components/background/Background.tsx
@@ -0,0 +1,83 @@
+import React, { useEffect, useRef, useState } from "react";
+import { v4 as uuidv4 } from "uuid";
+import SwiperCore, { Pagination, EffectCoverflow } from "swiper";
+import {
+  Text,
+  List,
+  ListItem,
+  ListIcon,
+  UnorderedList,
+} from "@chakra-ui/react";
+import { Swiper, SwiperSlide } from "swiper/react";
+
+import block from "./images/bb101-1.png";
+import bit from "./images/bsc.png";
+import beg from "./images/cfb-1.png";
+import defi from "./images/defi1.png";
+import dapp from "./images/ed1.png";
+import eth from "./images/eth1.png";
+import js from "./images/js.png";
+import link from "./images/link.png";
+import dot from "./images/polkadot.png";
+import react from "./images/react.png";
+import contract1 from "./images/sc1.png";
+import contract2 from "./images/sc2.png";
+import security from "./images/scs.png";
+
+import "swiper/css";
+import "swiper/css/effect-coverflow";
+import "swiper/css/pagination";
+import "./Background.css";
+import { MdStar } from "react-icons/md";
+
+const Background = () => {
+  return (
+    <div className="bg-certificats">
+      <p className="heading">Who I Am</p>
+      <p className="text">More like what we can most likely bond over ...</p>
+      <br></br>
+          <div className="text">
+            <Text fontSize="3xl">
+              If we ever meet and I do not use the word <span className="name">Blockchain</span> at least
+              once, we never met. As a Sikh, I believe in the ideas of <span className="name">Ik Oankar </span> 
+              and <span className="name">Sarbat Da Bhalla</span>. Sure - the world isn't perfect and no 2
+              people are created equal. But I am sure life can be better,
+              replete with more happiness and success, if we build communities
+              with aligned incentives that empower each other. I think a lot
+              about the future of <span className="name">digital business, mutualistic network states,
+              verifiably reproducible scientific research</span> and <span className="name">decentralized
+              finance</span>.
+            </Text>
+          </div>
+        <br></br>
+          <div className="text">
+            <Text fontSize="3xl">
+              Have you ever felt the need to put on a 75 lb backpack and hike 10
+              miles up a sharp rocky incline? If yes, we should be friends. For
+              some part, I grew up on a farm in the ruggedness of <span className="name">Indian Punjab</span>.
+              But I only realized my love for the <span className="name">outdoors</span> during college, with
+              the COVID pandemic taking me that extra mile. Today, you'll only
+              find me alone in a room when I'm either coding or sleeping. I love
+              to travel, explore nature and learn from people of <span className="name">different
+              cultures and life experiences</span>.
+            </Text>
+          </div>
+        <br></br>
+          <div className="text">
+            <Text fontSize="3xl">
+              How long do you think an <span className="name">idea</span> lives? I believe most of them die no
+              sooner than they are born. But the ideas, and stories, that
+              survive generations, millenia even - those are worth learning.
+              These ideas, stories and legends - <span className="name"> our History </span> - they stay with
+              us and are passed on from generation to generation just like our
+              DNA. But unlike DNA, there is no limit to who we can get them
+              from. Throughout history, there have been ideas that are still
+              relevant today - and we can learn them from people all around us,
+              and for as long as we wish.
+            </Text>
+          </div>
+    </div>
+  );
+};
+
+export default Background;
diff --git a/src/components/certificates/Certificates.css b/src/components/certificates/Certificates.css
diff --git a/src/components/certificates/Certificates.tsx b/src/components/certificates/Certificates.tsx
diff --git a/src/components/certificates/images/bb101-1.png b/src/components/certificates/images/bb101-1.png
diff --git a/src/components/certificates/images/bsc.png b/src/components/certificates/images/bsc.png
diff --git a/src/components/certificates/images/cfb-1.png b/src/components/certificates/images/cfb-1.png
diff --git a/src/components/certificates/images/defi1.png b/src/components/certificates/images/defi1.png
diff --git a/src/components/certificates/images/ed1.png b/src/components/certificates/images/ed1.png
diff --git a/src/components/certificates/images/eth1.png b/src/components/certificates/images/eth1.png
diff --git a/src/components/certificates/images/js.png b/src/components/certificates/images/js.png
diff --git a/src/components/certificates/images/link.png b/src/components/certificates/images/link.png
diff --git a/src/components/certificates/images/polkadot.png b/src/components/certificates/images/polkadot.png
diff --git a/src/components/certificates/images/react.png b/src/components/certificates/images/react.png
diff --git a/src/components/certificates/images/sc1.png b/src/components/certificates/images/sc1.png
diff --git a/src/components/certificates/images/sc2.png b/src/components/certificates/images/sc2.png
diff --git a/src/components/certificates/images/scs.png b/src/components/certificates/images/scs.png