Styling footer

parent 6ca68e5f
...@@ -4,7 +4,12 @@ import style from './Footer.module.scss'; ...@@ -4,7 +4,12 @@ import style from './Footer.module.scss';
function Footer() { function Footer() {
return ( return (
<footer className={style.appFooter}> <footer className={style.appFooter}>
Footer Goes here! <div>
<a href="https://www.westelm.com/pages/about-west-elm/">About Us</a>
</div>
<div>
<a href="https://www.westelm.com/customer-service/store-locator.html">Find A Store</a>
</div>
</footer> </footer>
); );
} }
......
@import '~styles/variables';
.appFooter { .appFooter {
display: flex;
justify-content: space-around;
height: $large-footer-height;
align-items: center;
border-top: solid 1px #8080804a;
bottom: 0; bottom: 0;
left: 0; left: 0;
background-color: #f1e9e933;
} }
\ No newline at end of file
@import '~styles/variables'; @import '~styles/variables';
.appHeader { .appHeader {
height: $large-footer-height; height: $large-header-height;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
box-sizing: border-box; box-sizing: border-box;
padding: 15px; padding: 15px;
flex-wrap: wrap; flex-wrap: wrap;
min-height: 85vh;
.sellingPrice { .sellingPrice {
color: $primary; color: $primary;
......
...@@ -5,4 +5,5 @@ $primary-white : white; ...@@ -5,4 +5,5 @@ $primary-white : white;
$gray1 : #F5F6F8; $gray1 : #F5F6F8;
$gray2 : gray; $gray2 : gray;
$large-header-height: 60px;
$large-footer-height: 60px; $large-footer-height: 60px;
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment