💄 ⚡ optimization CDN vendors display & import generate site speed.

assets/css/_common/outline/footer/index.scss

@@ -38,6 +38,19 @@
       img {
         display: inline-block;
       }
+      
+      $footer_vendors_imgs_len: length($footer_vendors_imgs_width);
+      @if ($footer_vendors_imgs_len>0) {
+        @for $i from 1 through $footer_vendors_imgs_len {
+          a:nth-child(#{$i}) img {
+            width: #{nth($footer_vendors_imgs_width, $i)}px;
+
+            @include mobile() {
+              width: #{nth($footer_vendors_imgs_width, $i)-10}px;
+            }
+          }
+        }
+      }      
     }
   }
 }
@@ -48,24 +61,6 @@
   }
 }
 
-@keyframes icon-animate {
-  0%, 100% {
-    transform: scale(1);
-  }
-
-  10%, 30% {
-    transform: scale(.9);
-  }
-
-  20%, 40%, 60%, 80% {
-    transform: scale(1.1);
-  }
-
-  50%, 70% {
-    transform: scale(1.1);
-  }
-}
-
 .languages {
   display: inline-block;
   font-size: $font-size-large;
@@ -91,7 +86,7 @@
   margin: 0 5px;
 
   @if $footer_icon_animated {
-    animation: icon-animate 1.33s ease-in-out infinite;
+    animation: beat 1.33s ease-in-out infinite;
   }
 }
 

assets/css/_common/scaffolding/animation/icon.scss

@@ -0,0 +1,17 @@
+@keyframes beat {
+  0%, 100% {
+    transform: scale(1);
+  }
+
+  10%, 30% {
+    transform: scale(.9);
+  }
+
+  20%, 40%, 60%, 80% {
+    transform: scale(1.1);
+  }
+
+  50%, 70% {
+    transform: scale(1.1);
+  }
+}

assets/css/_common/scaffolding/animation/index.scss

@@ -1,2 +1,3 @@
+@import 'icon';
 @import 'show';
 @import 'hover';