Added footer

public/styles/components/_app.scss

@@ -7,9 +7,13 @@
  *  Version:
  *    1.0.0 - 2018/02/23
  */
+.c-app__wrapper {
+  min-height: 100vh;
+  width: 100%;
+}
 .c-app {
   width: 100%;
-  min-height: 100%;
+  height: 100%;
   overflow-x: hidden;
   position: relative;
 }

public/styles/components/_footer.scss

@@ -0,0 +1,58 @@
+/*
+ *  Footer
+ *    Styles for footer element
+ *
+ *  Dependencies:
+ *    styles/settings/responsive.scss
+ *    styles/tools/_flex.scss
+ *    styles/tools/_responsive.scss
+ *
+ *  Version:
+ *    1.0.0 - 2018/03/03
+ */
+$c-footer--text-color: black;
+$c-footer--background-color: white;
+
+.c-footer {
+  margin-top: 5em;
+  width: 100%;
+  background: $c-footer--background-color;
+  @extend %t-flexbox;
+  @include t-flex-wrap(wrap);
+}
+
+.c-footer__copyright {
+  color: $c-footer--text-color;
+}
+
+.c-footer__copyright,
+.c-footer__links {
+  width: 100%;
+  text-align: center;
+  padding: 1em;
+}
+
+.c-footer__link {
+  display: block;
+}
+
+@include t-media-query($s-small-up) {
+  .c-footer {
+    @include t-flex-wrap(nowrap);
+  }
+
+  .c-footer__copyright {
+    text-align: left;
+  }
+
+  .c-footer__links {
+    text-align: right;
+  }
+
+  .c-footer__link {
+    display: inline;
+    + #{&}:before {
+      content: " | ";
+    }
+  }
+}

public/styles/components/_menu.scss

@@ -0,0 +1,12 @@
+/*
+ *  Menu
+ *    Styles for the menu
+ *
+ *  Dependencies:
+ *
+ *  Version:
+ *    1.0.0 - 2018/03/01
+ */
+.c-menu {
+  position: relative;
+}

public/styles/components/_page.scss

@@ -8,4 +8,5 @@
  *    1.0.0 - 2018/02/24
  */
 .c-page {
+  min-height: 100%;
 }

public/styles/components/_section--style-body.scss

@@ -12,6 +12,7 @@
  */
 .c-section--style-body {
   background: $s-color--background-default;
+  padding: 1em;
 }
 
 @include t-media-query($s-small-up) {

public/styles/components/_section.scss

@@ -18,14 +18,3 @@
 .c-section--full-width {
   max-width: none;
 }
-
-.c-section--style-body {
-  background: $s-color--background-default;
-}
-
-@include t-media-query($s-small-up) {
-  .c-section--style-body {
-    margin-left: 4%;
-    @include t-box-shadow(-10px, 10px, 0px, rgba(0, 0, 0, 0.5));
-  }
-}

public/styles/elements/_a.scss

@@ -12,3 +12,8 @@ a {
   text-decoration: none;
   color: $s-color--links
 }
+
+a:hover {
+  text-decoration: underline;
+  color: $s-color--links-hover;
+}

public/styles/elements/_table.scss

@@ -0,0 +1,10 @@
+/*
+ *  Table Element Styles
+ *    Styles for body style section
+ *
+ *  Version:
+ *    1.0.0 - 2018/03/02
+ */
+table {
+  width: 100%;
+}

public/styles/index.scss

@@ -4,7 +4,7 @@
  * Copyright 2018 Dominic "YouWish" Masters
  *
  * Version:
- *    0.0.1 - 2018/02/23
+ *    0.0.1 - 2018/03/03
  */
 
 //Settings
@@ -32,15 +32,19 @@
 @import './elements/_button.scss';
 @import './elements/_headings.scss';
 @import './elements/_html.scss';
+@import './elements/_table.scss';
 
 //Objects
 
 //Components
 @import './components/_app.scss';
+@import './components/_footer.scss';
 @import './components/_header.scss';
+@import './components/_menu.scss';
 @import './components/_navbar.scss';
 @import './components/_page.scss';
 @import './components/_section.scss';
+@import './components/_section--style-body.scss';
 @import './components/_section--style-poly.scss';
 
 //Utilities

public/styles/settings/colors.scss

@@ -11,6 +11,7 @@
 //Fonts
 $s-color--text: black;
 $s-color--links: #FC78DE;
+$s-color--links-hover: lighten($s-color--links, 20%);
 
 //Backgrounds
 $s-color--background-default: white;