Merge pull request #17 from chicio/remove-gsap 🚀

Remove gsap

Author: chicio

CHANGELOG.md

@@ -1,6 +1,13 @@
 # Change Log
 All changes to Chicio coding will be documented in this file.
 
+## [1.9.0](https://github.com/chicio/chicio.github.io/releases/tag/1.9.0)
+Release date: 2019-05-09.
+
+#### Added
+
+- bye bye gsap, I want speed with css animation!!! 
+
 ## [1.8.0](https://github.com/chicio/chicio.github.io/releases/tag/1.8.0)
 Release date: 2019-05-09.
 

_css/common.scss

@@ -34,10 +34,19 @@ canvas {
   background-color: $primary-color;
 }
 
+@keyframes show-lazy-element-animation {
+  from {opacity: 0;}
+  to {opacity: 1;}
+}
+
 .lazy {
   background-color: $divider-color;
 }
 
+.lazy-show {
+  animation: show-lazy-element-animation 0.5s;
+}
+
 .break {
   display: inline
 }

_css/loader.scss

@@ -1,21 +1,3 @@
-@mixin keyframes($animationName) {
-  @-webkit-keyframes #{$animationName} {
-    @content;
-  }
-
-  @-moz-keyframes #{$animationName} {
-    @content;
-  }
-
-  @-o-keyframes #{$animationName} {
-    @content;
-  }
-
-  @keyframes #{$animationName} {
-    @content;
-  }
-}
-
 .loader {
   border: 5px solid $general-background;
   border-top: 5px solid $accent-color;
@@ -28,9 +10,19 @@
   top: 50%;
   left: 50%;
   margin: -60px 0 0 -60px;
+
+  &.hide {
+    animation: hide 0.3s linear;
+    animation-fill-mode: forwards;
+  }
+}
+
+@keyframes hide {
+  from {opacity: 1;}
+  to {opacity: 0;}
 }
 
-@include keyframes(spin) {
+@keyframes spin {
   0% {
     transform: rotate(0deg);
   }

_css/profile-introduction.scss

@@ -15,6 +15,16 @@
     left: 0;
     background-color: #3F51B5;
     opacity: 0;
+
+    &.show {
+      animation: show-rendering-surface 0.5s linear;
+      animation-fill-mode: forwards;
+    }
+
+    @keyframes show-rendering-surface {
+      from {opacity: 0;}
+      to {opacity: 1;}
+    }
   }
 
   .center-content {
@@ -23,6 +33,16 @@
     z-index: 100;
     opacity: 0;
 
+    &.show {
+      animation: show-profile-introduction 0.5s linear 0.3s;
+      animation-fill-mode: forwards;
+    }
+
+    @keyframes show-profile-introduction {
+      from {opacity: 0;}
+      to {opacity: 1;}
+    }
+
     a {
       text-decoration: none;
     }
@@ -68,6 +88,16 @@
       margin-left: auto;
       margin-right: auto;
 
+      &.show {
+        animation: show-profile-buttons 0.5s linear 0.3s;
+        animation-fill-mode: forwards;
+      }
+  
+      @keyframes show-profile-buttons {
+        from {opacity: 0;}
+        to {opacity: 1;}
+      }
+
       .profile-icon {
         padding-left: 5px;
         padding-right: 5px;
@@ -96,6 +126,16 @@
     text-align: center;
     color: $primary-color-text;
     opacity: 0;
+
+    &.show {
+      animation: show-down-arrow 0.5s;
+      animation-fill-mode: forwards;
+    }
+
+    @keyframes show-down-arrow {
+      from {opacity: 0;}
+      to {opacity: 1;}
+    }
   }
 }
 

_includes/critical.css

@@ -1 +1 @@
-<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.archive.css?rev=a41393a0652f304beb44c5e410fe95e6">
+<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.archive.css?rev=da9f35d89cf58f6a05aac6a0b0718ad1">

_includes/dependencies-css-blog-archive.html

@@ -1 +1 @@
-<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.home.css?rev=289c072731f88281811cd88618f289f4">
+<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.home.css?rev=3e2f91062ccc3779f9f16d271b1249a3">

_includes/dependencies-css-blog-home.html

@@ -1 +1 @@
-<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.post.css?rev=94d16ba2198a523b645fdc41b6e91dcc">
+<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.post.css?rev=0b157909853423ba3f33eb6e08a54252">

_includes/dependencies-css-blog-post.html

@@ -1 +1 @@
-<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.tags.css?rev=065b461ebf01d5e0b4a34df3f0905fa0">
+<link rel="stylesheet" type="text/css" href="/assets/styles/style.blog.tags.css?rev=465221b7379c0ae38d608d1e6d653dd0">

_includes/dependencies-css-blog-tags.html

@@ -1 +1 @@
-<link rel="stylesheet" type="text/css" href="/assets/styles/style.cookiepolicy.css?rev=2bd3d2962fe7a38453e201b1aa5afaeb">
+<link rel="stylesheet" type="text/css" href="/assets/styles/style.cookiepolicy.css?rev=816b132770c5bd5a3544a729b17436b1">