3 files modified

Author: eastcoastdeveloper

angular.json

@@ -66,7 +66,7 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "src/tsconfig.spec.json",
             "karmaConfig": "src/karma.conf.js",
-            "styles": ["styles.css"],
+            "styles": ["styles.scss"],
             "scripts": [],
             "assets": ["src/favicon.ico", "src/assets"]
           }

src/index.html

@@ -1 +1,9 @@
-<my-app>loading</my-app>
+<my-app>loading</my-app>
+
+<footer>
+  <div class="icon-grid">
+    <a href="https://www.linkedin.com/in/eric-feldberg-62a758297" target="_blank"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/ca/LinkedIn_logo_initials.png/512px-LinkedIn_logo_initials.png"></a>
+    <a href="https://www.instagram.com/nodulldayz/" target="_blank"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/e7/Instagram_logo_2016.svg/128px-Instagram_logo_2016.svg.png"></a>
+    <a href="https://flickr.com/photos/nodulldays/" target="_blank"><img alt="Flickr logo - SuperTinyIcons" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f4/Flickr_logo_-_SuperTinyIcons.svg/512px-Flickr_logo_-_SuperTinyIcons.svg.png"></a>
+  </div>
+</footer>

src/styles.scss

@@ -39,3 +39,25 @@ header {
     color: #d9a74a;
   }
 }
+
+footer {
+  position: absolute;
+  bottom: 0;
+  border-top: 1px solid #313b3f;
+  padding: 5px 5px 1px 5px;
+  box-sizing: border-box;
+  width: 100%;
+  .icon-grid {
+    justify-content: center;
+    display: grid;
+    grid-column-gap: 10px;
+    grid-template-columns: repeat(3, 35px);
+    a {
+      width: 35px;
+      display: block;
+      img {
+        width: 100%;
+      }
+    }
+  }
+}