Merge pull request #840 from LiskHQ/839-fontawesome-update

Fontawesome Update - Closes #839

package.json

@@ -61,7 +61,6 @@
     "express": "^4.16.3",
     "fast-safe-stringify": "^1.2.0",
     "flatstr": "^1.0.5",
-    "font-awesome": "^4.7.0",
     "hiredis": "^0.5.0",
     "http-status-codes": "^1.3.0",
     "jquery": "^3.2.1",
@@ -88,6 +87,7 @@
     "underscore": "^1.8.3"
   },
   "devDependencies": {
+    "@fortawesome/fontawesome-free": "^5.5.0",
     "babel-core": "^6.24.0",
     "babel-loader": "^7.1.4",
     "babel-plugin-istanbul": "^4.1.4",

src/app/app.js

@@ -29,6 +29,8 @@ import 'bootstrap/dist/css/bootstrap.css';
 import 'leaflet/dist/leaflet.css';
 import 'leaflet.markercluster/dist/MarkerCluster.Default.css';
 import 'angular-advanced-searchbox/dist/angular-advanced-searchbox.min.css';
+import '@fortawesome/fontawesome-free/css/all.css';
+import '@fortawesome/fontawesome-free/css/v4-shims.css';
 import '../assets/styles/common.css';
 import '../assets/styles/flags.css';
 import '../assets/styles/tableMobile.css';

src/assets/styles/common.css

@@ -1052,7 +1052,8 @@ qrcode + span {
 
 .btn-copy:before {
   font-size: 14px;
-  font-family: "FontAwesome";
+  font-family: "Font Awesome 5 Free";
+  font-weight: 900;
   content: "\f0ea";
 }
 

src/components/footer/footer.html

@@ -33,7 +33,7 @@
 				<a href="https://github.com/LiskHQ" target="_blank" title="Github" class="link github-link hidden-xs"><i class="fa fa-github fa-2x"></i></a>
 				<a href="https://twitter.com/LiskHQ" target="_blank" title="Twitter" class="link twitter-link hidden-xs"><i class="fa fa-twitter fa-2x"></i></a>
 				<a href="https://www.facebook.com/LiskHQ" target="_blank" title="Facebook" class="link facebook-link"><i class="fa fa-facebook fa-2x"></i></a>
-				<a href="https://blog.lisk.io" target="_blank" title="Lisk Blog" class="link blog-link">Blog/Medium</a>
+        <a href="https://blog.lisk.io" target="_blank" title="Lisk Blog" class="link blog-link"><i class="fab fa-medium fa-2x"></i></a>
 				<a href="https://www.reddit.com/r/Lisk/" target="_blank" title="Reddit" class="link reddit-link hidden-xs"><i class="fa fa-reddit-square fa-2x"></i></a>
 				<a href="https://www.instagram.com/liskhq/" target="_blank" title="Instagram" class="link instagram-link hidden-xs"><i class="fa fa-instagram fa-2x"></i></a>
 				<a href="https://www.youtube.com/channel/UCuqpGfg_bOQ8Ja4pj811PWg/featured" target="_blank" title="YouTube hidden-xs" class="link youtube-link"><i class="fa fa-youtube fa-2x"></i></a>

src/index.ejs

@@ -32,11 +32,9 @@
 	<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
 	<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
 	<link rel="mask-icon" href="safari-pinned-tab.svg" color="#ffffff">
-
 	<% if (htmlWebpackPlugin.options.serviceName && htmlWebpackPlugin.options.clientId) { %>
 		<meta name="<%= htmlWebpackPlugin.options.serviceName %>" content="<%= htmlWebpackPlugin.options.clientId %>">
 	<% } %>
-
 	<!--<link rel="stylesheet" href="/css/main.min.css">-->
 	<base href="/">
 </head>
@@ -74,5 +72,6 @@
 	'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
 	})(window,document,'script','dataLayer','GTM-NKNKGHL');</script>
 	<!-- End Google Tag Manager -->
+
 </body>
 </html>