x

Author: icodeayush

JS/App.js

@@ -33,25 +33,25 @@ function LandingPageScrollTrigger() {
     LandingPageScrollTrigger
         .from('#LandingPageWrapper nav #logo a', {
             opacity: 0, y: "100%", ease: 'power3.out', duration: 2.2,
-        }, 2)
+        }, 3)
         .from('#LandingPageWrapper nav #listitems li a', {
             opacity: 0, y: "100%", ease: 'power3.out', duration: 2.2, stagger: 0.5,
-        }, 2)
+        }, 3)
         .from('#LandingPageWrapper #intro h2 div span', {
             opacity: 0, y: "100%", ease: "power3.out", duration: 3.1, stagger: 0.5,
-        }, 0)
+        }, 0.5)
         .from('#LandingPageWrapper #intro h5 div span', {
             opacity: 0, y: "100%", ease: "power4.out", duration: 2.2, stagger: 0.5,
-        }, 1.2)
+        }, 1.5)
         .from('#LandingPageWrapper #social a span', {
             opacity: 0, y: "115%", ease: 'power3.out', duration: 1.3, stagger: 0.5,
-        }, 2)
+        }, 4)
         .from('#LandingPageWrapper #codeby p', {
             opacity: 0, y: "100%", ease: "power3.out", duration: 2.2, stagger: 0.5,
-        }, 2)
+        }, 5.5)
         .from('#LandingPageWrapper #scrolldown span p', {
             opacity: 0, y: "100%", ease: 'power2.out', duration: 1.3,
-        }, 3.8);
+        }, 6.5);
 };
 
 //---------------------/LandingPage---------------------

css/iCodeAyush.css

@@ -58,28 +58,28 @@ body {
   font-family: 'Playfair Display', serif;
   font-size: var(--FontH2);
   font-weight: 700;
-  color: var(--ColorLight1);
-  -webkit-animation: x 2.2s 0.22s steps(22, start) infinite alternate;
-  animation: x 2.2s 0.22s steps(22, start) infinite alternate;
+  color: var(--ColorDark2);
+  -webkit-animation: x 2.2s 0.4s steps(22, start) infinite alternate;
+  animation: x 2.2s 0.4s steps(22, start) infinite alternate;
   -webkit-animation-play-state: running;
   animation-play-state: running;
 }
 
 @-webkit-keyframes x {
   from {
-    color: var(--ColorLight2);
+    color: var(--ColorDark2);
   }
   to {
-    color: var(--ColorDark2);
+    color: var(--ColorLight2);
   }
 }
 
 @keyframes x {
   from {
-    color: var(--ColorLight2);
+    color: var(--ColorDark2);
   }
   to {
-    color: var(--ColorDark2);
+    color: var(--ColorLight2);
   }
 }
 
@@ -212,6 +212,15 @@ body {
   font-weight: 300;
   color: var(--ColorLight3);
   cursor: default;
+  transition: color 0.618s ease
+}
+
+#LandingPageWrapper #intro h5:hover div span {
+  color: var(--ColorDark3);
+}
+
+#LandingPageWrapper #intro h5 div span:hover {
+  color: var(--ColorLight1);
 }
 
 #LandingPageWrapper #social {

img/WebPageA.jpg

@@ -50,29 +50,31 @@ <h2>
       </h2>
       <h5>
         <div><span>Im A</span></div>
-        <div><span>Front End Web Designer</span></div>
+        <div><span>Web Designer</div>
+        <div><span>UI/UX Designer</span></div>
+        <div><span>Front End Web Devloper</span></div>
       </h5>
     </section>
     <!------------/Intro------------>
 
     <!------------Social------------>
     <div id="social">
-      <a target="_blank" href="#Behance">
+      <a target="_blank" href="https://www.behance.net/iCodeAyush/">
         <span>
           <img src="Icon/Behance.svg" alt="Behance"><img id="FadeIn" src="Icon/Behance.svg" alt="Behance">
         </span>
       </a>
-      <a target="_blank" href="#Codepen">
+      <a target="_blank" href="https://codepen.io/iCodeAyush">
         <span>
           <img src="Icon/Codepen.svg" alt="Codepen"><img id="FadeIn" src="Icon/Codepen.svg" alt="Codepen">
         </span>
       </a>
-      <a target="_blank" href="#Github">
+      <a target="_blank" href="https://github.com/iCodeAyush">
         <span>
           <img src="Icon/Github.svg" alt="Github"><img id="FadeIn" src="Icon/Github.svg" alt="Github">
         </span>
       </a>
-      <a target="_blank" href="#Dribbble">
+      <a target="_blank" href="https://dribbble.com/iCodeAyush">
         <span>
           <img src="Icon/Dribbble.svg" alt="Dribbble"><img id="FadeIn" src="Icon/Dribbble.svg" alt="Dribbble">
         </span>
@@ -121,19 +123,19 @@ <h2><span>Dora</span></h2>
       </div>
       <div id="WebPageB">
         <h4><span>02 Landing Page</span></h4>
-        <h2><span>Abtraction</span></h2>
+        <h2><span>BeeSoft</span></h2>
       </div>
       <div id="WebPageC">
         <h4><span>03 Landing Page</span></h4>
-        <h2><span>Travel</span></h2>
+        <h2><span>TravelNow</span></h2>
       </div>
       <div id="WebPageD">
         <h4><span>04 Landing Page</span></h4>
         <h2><span>Places</span></h2>
       </div>
       <div id="WebPageE">
         <h4><span>05 Landing Page</span></h4>
-        <h2><span>Bee</span></h2>
+        <h2><span>Abtraction</span></h2>
       </div>
     </section>
     <!------------/WebPageTitle------------>
@@ -185,29 +187,29 @@ <h4>
         <a href="mailto: iCodeAyush@Gmail.com"><span>iCodeAyush@Gmail.com</span></a>
       </p>
       <p>
-        <a href="tel: 1322132213"><span>1322132213</span></a>
+        <a href="tel: +911322132213"><span>1322132213</span></a>
       </p>
     </div>
     <!-------------/Email n PhoneNo------------>
 
     <!-------------Social------------>
     <div id="social">
-      <a target="_blank" href="#GitHub">
+      <a target="_blank" href="https://github.com/iCodeAyush">
         <span>GitHub<br>
           <div id="FadeIn">GitHub</div>
         </span>
       </a>
-      <a target="_blank" href="#Dribble">
+      <a target="_blank" href="https://dribbble.com/iCodeAyush">
         <span>Dribble<br>
           <div id="FadeIn">Dribble</div>
         </span>
       </a>
-      <a target="_blank" href="#Codepen">
+      <a target="_blank" href="https://codepen.io/iCodeAyush">
         <span>Codepen<br>
           <div id="FadeIn">Codepen</div>
         </span>
       </a>
-      <a target="_blank" href="#Behance">
+      <a target="_blank" href="https://www.behance.net/iCodeAyush/">
         <span>Behance<br>
           <div id="FadeIn">Behance</div>
         </span>