Merge pull request #101 from TCP-Tech/dev

Dev

.github/workflows/main.yml

@@ -38,8 +38,5 @@ jobs:
     - name: Doing the magic now
       run: sudo scp -o StrictHostKeyChecking=no -i tcp.pem -r build/* [email protected]:/home/CodeUtsava7.0/build
 
-    - name: Doing the magic now 2
-      run: sudo scp -o StrictHostKeyChecking=no -i tcp.pem -r build/* [email protected]:/home/CodeUtsava7.0/build
-
     - name: LIVE!!!
       run: echo "Site is Live!🚀🚀🚀"

package.json

@@ -11,7 +11,7 @@
     "axios": "^1.5.0",
     "emailjs-com": "^3.2.0",
     "font-awesome": "^4.7.0",
-    "framer-motion": "^8.4.0",
+    "framer-motion": "^10.16.4",
     "react": "^18.2.0",
     "react-apexcharts": "^1.4.1",
     "react-countup": "^6.4.2",

public/index.html

@@ -105,10 +105,6 @@
       src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TweenMax.min.js"
       crossorigin="anonymous"
     ></script>
-    <script
-      src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r78/three.min.js"
-      crossorigin="anonymous"
-    ></script>
     <script defer async src="https://apply.devfolio.co/v2/sdk.js"></script>
     <script type="module" src="/mouse.js"></script>
     <script type="module" src="/preloader.js"></script>

public/mouse.css

@@ -2,15 +2,15 @@
   position: fixed;
   z-index: 1;
   transform-origin: center;
-  width: 90px;
+  width: 80px;
   margin: 20px 0 0 -45px;
 }
 .ghost__eyes,
 .ghost__mouth {
   position: absolute;
   z-index: 1;
-  width: 15px;
-  height: 15px;
+  width: 12px;
+  height: 12px;
   top: 34px;
   left: 50%;
   transform: translate(-50%);
@@ -50,7 +50,7 @@
   border-radius: 40px 40px 5px 5px;
 }
 .ghost__rip {
-  width: 15px;
+  width: 12px;
   height: 28px;
   background: #fff;
   position: absolute;

public/preloader.css

@@ -22,6 +22,7 @@
 
 .hehe{
   overflow: hidden;
+
 }
 
 .intro-container1 img {
@@ -45,8 +46,10 @@
 
 #canvas{
   position: absolute;
+  background-image: url('../src/assets/images/bg2.png');
+  background-repeat: no-repeat;
+  background-size: cover;
   z-index: -2;
-
 }
 
 #root {

public/preloader.js

@@ -82,8 +82,8 @@
 
       // Ensure particles are spawned past screen width and height so
       // there will be no missing stars when rotating canvas
-      var x = (Math.random() * (canvas.width + 200)) - (canvas.width + 200) / 2;
-      var y = (Math.random() * (canvas.width + 200)) - (canvas.width + 200) / 2;
+      var x = (Math.random() * (canvas.width + 450)) - (canvas.width + 450) / 2;
+      var y = (Math.random() * (canvas.width + 450)) - (canvas.width + 450) / 2;
       lightParticles.push(new LightParticle(x, y, randomRadius, colors[randomColorIndex]));
     }
     })();
@@ -139,7 +139,7 @@
 
     setInterval(() => {
       isMouseDown = !isMouseDown; 
-    }, 1000);
+    }, 2000);
 
 
     window.addEventListener("mouseup", function() {

src/App.css

@@ -2,6 +2,26 @@
   width: 100%;
 }
 
+.bg-image{
+  background-image: url("./assets/images/bg.png");
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-attachment: fixed;
+}
+
+#overlay {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  z-index: -1;
+  cursor: pointer;
+}
+
 /* .main-container {
   background-image: url("./assets/images/14.png");
   background-repeat: no-repeat;
@@ -49,6 +69,10 @@ a {
   .section__margin {
     margin: 2rem 2rem;
   }
+  .bg-image{
+    background-size: cover;
+    background-position-x: -200px;
+  }
 }
 
 .slide-bottom {