diff --git a/public/footer/Footer.jsx b/public/footer/Footer.jsx
index 5db7f67..12907b2 100644
--- a/public/footer/Footer.jsx
+++ b/public/footer/Footer.jsx
@@ -30,11 +30,9 @@ import { PageBoundary } from './../page/Page';
const FooterLink = function(props) {
let key = "footer.links." + props.title;
return (
-
-
- { Language.get(key) }
-
-
+
+ { Language.get(key) }
+
);
}
diff --git a/public/styles/components/_footer.scss b/public/styles/components/_footer.scss
index 657f834..2bea98a 100644
--- a/public/styles/components/_footer.scss
+++ b/public/styles/components/_footer.scss
@@ -3,22 +3,25 @@
* Site Footer!
*
* Dependencies:
+ * styles/settings/colors.scss
+ * styles/settings/typography.scss
* styles/tools/flex.scss
+ * styles/tools/_box-shadow.scss
*
* Version:
* 1.0.0 - 2018/05/16
*/
$c-footer--link-color: red;
-$c-footer--shadow: 1.5em;
+$c-footer--link-hover-color: blue;
.c-footer {
+ @extend %t-dp--shadow-3d;
padding-top: 8em;
padding-bottom: 10em;
position: relative;
overflow: hidden;
background-image: url('./../images/banners/palms.svg');
background-size: cover;
- @include t-box-shadow(0px, $c-footer--shadow, $c-footer--shadow, 0px, rgba(0, 0, 0, 0.25), true);
&__inner {
text-align: center;
@@ -36,11 +39,16 @@ $c-footer--shadow: 1.5em;
}
&__link {
+ color: $s-color--footer__link;
- + #{&} {
- display: inline-block;
- padding-left: 1em;
- }
+ &:hover {
+ color: $s-color--footer__link-hover;
+ }
+
+ + #{&} {
+ display: inline-block;
+ margin-left: 1em;
+ }
}
&__part {
diff --git a/public/styles/settings/colors.scss b/public/styles/settings/colors.scss
index ea93779..5609149 100644
--- a/public/styles/settings/colors.scss
+++ b/public/styles/settings/colors.scss
@@ -47,6 +47,10 @@ $s-color--menu__background: rgba(0, 0, 0, 0.8);
//loader
$s-color--loader: $s-color--swatch-blue;
+//Footer Colors
+$s-color--footer__link: black;
+$s-color--footer__link-hover: white;
+
/*** Buttons and Inputs ***/
//Defaults
diff --git a/public/styles/tools/_shadow.scss b/public/styles/tools/_shadow.scss
index 0ffe191..63abc16 100644
--- a/public/styles/tools/_shadow.scss
+++ b/public/styles/tools/_shadow.scss
@@ -15,3 +15,8 @@
$s-color--shadow
);
}
+
+
+%t-dp--shadow-3d {
+ @include t-box-shadow(0px, 1.5em, 1.5em, 0px, rgba(0, 0, 0, 0.25), true);
+}