Merge pull request #242 from kzviagina/master

Footer > add Linkedin to social links list

Author: gz-c

src/app/components/layout/footer/footer.component.html

@@ -14,54 +14,9 @@
       </div>
     </div>
     <div class="footer-second-row">
-      <div class="social-link">
-        <a href="/">
-          <img alt="" src="/assets/img/social/medium.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://twitter.com/skycoinproject">
-          <img alt="" src="/assets/img/social/twitter.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://www.facebook.com/SkycoinOfficial">
-          <img alt="" src="/assets/img/social/facebook.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://www.instagram.com/skycoinproject/">
-          <img alt="" src="/assets/img/social/instagram.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://github.com/skycoin/skycoin">
-          <img alt="" src="/assets/img/social/github.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://www.youtube.com/c/Skycoin">
-          <img alt="" src="/assets/img/social/youtube.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://www.reddit.com/r/skycoin">
-          <img alt="" src="/assets/img/social/reddit.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://itunes.apple.com/nl/podcast/skycoin/id1348472259?l=en">
-          <img alt="" src="/assets/img/social/apple.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://discord.gg/EgBenrW">
-          <img alt="" src="/assets/img/social/discord.svg">
-        </a>
-      </div>
-      <div class="social-link">
-        <a href="https://t.me/Skycoin">
-          <img alt="" src="/assets/img/social/telegram.svg">
+      <div class="social-link" *ngFor="let link of links">
+        <a href={{link.href}} target="_blank" rel="noopener">
+          <img alt="" src="/assets/img/social/{{link.img}}">
         </a>
       </div>
     </div>

src/app/components/layout/footer/footer.component.scss

@@ -76,12 +76,12 @@ footer {
 
     .social-link {
       padding: 8px 0;
-      width: 20%;
+      width: 16.6666%;
       text-align: center;
       font-size: 0;
 
       @media screen and (min-width: 40em) {
-        width: 10%;
+        width: 9.0909%;
         padding: 16px 0;
       }
 

src/app/components/layout/footer/footer.component.ts

@@ -7,6 +7,53 @@ import { Component, OnInit } from '@angular/core';
 })
 export class FooterComponent implements OnInit {
 
+    links = [
+        {
+            href: 'https://medium.com/@Skycoinproject',
+            img: 'medium.svg',
+        },
+        {
+            href: 'https://twitter.com/skycoinproject',
+            img: 'twitter.svg',
+        },
+        {
+            href: 'https://www.facebook.com/SkycoinOfficial',
+            img: 'facebook.svg',
+        },
+        {
+            href: 'https://www.instagram.com/skycoinproject/',
+            img: 'instagram.svg',
+        },
+        {
+            href: 'https://github.com/skycoin/skycoin',
+            img: 'github.svg',
+        },
+        {
+            href: 'https://www.youtube.com/c/Skycoin',
+            img: 'youtube.svg',
+        },
+        {
+            href: 'https://www.reddit.com/r/skycoin',
+            img: 'reddit.svg',
+        },
+        {
+            href: 'https://itunes.apple.com/nl/podcast/skycoin/id1348472259?l=en',
+            img: 'apple.svg',
+        },
+        {
+            href: 'https://discord.gg/EgBenrW',
+            img: 'discord.svg',
+        },
+        {
+            href: 'https://t.me/Skycoin',
+            img: 'telegram.svg',
+        },
+        {
+            href: 'https://www.linkedin.com/company/skycoin/',
+            img: 'linkedin.svg',
+        }
+    ];
+
   constructor() { }
 
   ngOnInit() {