diff --git a/frontend/src/app/footer/footer.component.html b/frontend/src/app/footer/footer.component.html index 28c0d7d..9dc4bbf 100644 --- a/frontend/src/app/footer/footer.component.html +++ b/frontend/src/app/footer/footer.component.html @@ -1 +1,44 @@ -

footer works!

+ diff --git a/frontend/src/app/footer/footer.component.scss b/frontend/src/app/footer/footer.component.scss index e69de29..48c683d 100644 --- a/frontend/src/app/footer/footer.component.scss +++ b/frontend/src/app/footer/footer.component.scss @@ -0,0 +1,69 @@ +footer { + background-color: var(--footer-color); + transition: 0.5s ease; +} + +footer h2 { + margin-bottom: 10px; + font-size: 1.3em; + color: var(--white); +} + +footer ul, footer p { + list-style: none; + font-size: 0.9em; + color: rgba(168, 168, 168); + font-family: 'opensans', sans-serif; +} + +.footer { + padding: 80px 0; + width: 80%; + max-width: 1020px; + margin: 0 auto; +} + +.footerInner { + display: flex; + justify-content: space-between; +} + +.footerText { + flex-basis: 45%; + margin-right: 60px; +} + +.followUs { + padding-top: 15px; +} + +.followUs img { + margin-right: 15px; + float: left; + filter: grayscale(100%); + -webkit-filter: grayscale(100%); + transition: all 0.2s; + -webkit-transition: all 0.2s; +} + +.followUs img:hover { + margin-bottom: 5px; + filter: grayscale(0%); + -webkit-filter: grayscale(0%); + transform: scale(1.1); + -webkit-transform: scale(1.1); +} + +.footerNav { + flex-grow: 1; + border-left: 1px solid rgba(19, 19, 19); + padding-left: 10px; +} + +.footerNav li { + padding-bottom: 5px; +} + +.copyright { + margin-top: 50px; +} diff --git a/frontend/src/app/footer/footer.component.ts b/frontend/src/app/footer/footer.component.ts index a0906da..9cf24d0 100644 --- a/frontend/src/app/footer/footer.component.ts +++ b/frontend/src/app/footer/footer.component.ts @@ -1,4 +1,5 @@ import {Component} from '@angular/core'; +import {ALTITUDE_VERSION} from '../constant'; @Component({ selector: 'app-footer', @@ -10,4 +11,6 @@ export class FooterComponent { public getCurrentYear() { return new Date().getFullYear(); } + + protected readonly ALTITUDE_VERSION = ALTITUDE_VERSION; }