Optimize images

Author: nonamenix

package.json

@@ -19,14 +19,15 @@
     "babel-preset-es2015": "^6.16.0",
     "babel-preset-stage-2": "^6.0.0",
     "css-loader": "^0.23.0",
+    "css-skeleton": "^1.0.1",
     "file-loader": "^0.8.4",
     "fullpage.js": "^2.8.1",
     "function-bind": "^1.0.2",
     "http-proxy-middleware": "^0.12.0",
+    "image-webpack-loader": "^3.0.0",
     "jquery": "^3.0.0",
     "json-loader": "^0.5.4",
     "ora": "^0.2.0",
-    "skeleton-css": "^2.0.4",
     "webpack": "^1.12.2",
     "webpack-dev-middleware": "^1.4.0",
     "webpack-hot-middleware": "^2.6.0",

sources/assets/css/main.css

@@ -33,10 +33,8 @@ a {
   right: 0;
   width: 149px;
   height: 149px;
-}
-.forkme img{
-  width: 100%;
-  height: 100%;
+  background-image: url(../images/networks/forkme.png);
+  background-size: 149px;
 }
 
 
@@ -79,13 +77,24 @@ a {
 }
 
 
-.meetup {
+.network-icon {
   width: 150px;
+  background-size: 150px;
+  display: inline-block;
+  height: 150px;
+}
+
+.meetup {
+  background-image: url(../images/networks/meetup.png);
+  height: 150px;
+  display: inline-block;
+  width: 200px;
+  background-size: 200px;
 }
 .telegram {
-  width: 150px;
   margin-left: 30px;
+  background-image: url(../images/networks/telegram.png);
 }
 .google-plus {
-  width: 150px;
+  background-image: url(../images/networks/google-plus.png);
 }

sources/assets/js/jquery.fullPage.min.js

@@ -1,8 +1,9 @@
 import $ from 'jquery'
 import '../css/normalize.css'
+import 'css-skeleton'
 import 'fullpage.js'
-//require('fullpage.js/jquery.fullPage.css');
-import 'skeleton-css'
+import 'fullpage.js/dist/jquery.fullPage.css'
+
 import '../css/main.css'
 
 $(document).ready(function () {