From 822934828a4471d17beec4c513fcd22615d232c1 Mon Sep 17 00:00:00 2001 From: hunicus <93150691+hunicus@users.noreply.github.com> Date: Sat, 6 May 2023 04:10:17 -0400 Subject: [PATCH] Add initial content to big footer --- .../global-footer.component.html | 90 +++++++++++++++---- .../global-footer.component.scss | 76 +++++++++++++--- .../global-footer/global-footer.component.ts | 5 ++ 3 files changed, 139 insertions(+), 32 deletions(-) diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.html b/frontend/src/app/shared/components/global-footer/global-footer.component.html index e3cdc07e3..d4425687a 100644 --- a/frontend/src/app/shared/components/global-footer/global-footer.component.html +++ b/frontend/src/app/shared/components/global-footer/global-footer.component.html @@ -1,22 +1,76 @@ \ No newline at end of file + diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.scss b/frontend/src/app/shared/components/global-footer/global-footer.component.scss index cf4aa02c4..d9845eba8 100644 --- a/frontend/src/app/shared/components/global-footer/global-footer.component.scss +++ b/frontend/src/app/shared/components/global-footer/global-footer.component.scss @@ -1,22 +1,70 @@ footer { + background-color: #1d1f31; + margin-top: 30px; +} + +footer a { + color: rgba(255, 255, 255, 0.4); +} + +footer p { + margin-bottom: 0.25rem; +} + +footer .row.main { + padding: 40px 0; +} + +footer .row.main .branding { text-align: center; } -.terms-of-service { +footer .row.main .branding .btn { + display: inline-block; + color: #fff !important; +} + +footer .row.main .branding button.account { + background-color: #2d3348; +} + +footer .row.main .branding .cta { + margin: 50px auto 45px auto; +} + +footer .row.main .branding .cta-secondary { + +} + +footer .row.main .links > div:first-child { + margin-bottom: 20px; +} + +footer .row.main .links .category { + color: #4a68b9; + font-weight: 700; +} + +footer .row.main .links .category:not(:first-child) { margin-top: 1rem; } -.pref-selectors { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: center; - - .selector { - margin-left: .5em; - margin-bottom: .5em; - &:first { - margin-left: 0; - } - } +footer .selector { + margin: 20px 0; +} + +footer .row.version .col-sm-12 { + padding: 20px !important; + background-color: #11131f; +} + +footer .row.version .col-sm-12 p { + margin-bottom: 0; + text-align: center; + font-size: 12px; + color: rgba(255, 255, 255, 0.4); +} + +footer .row.version .col-sm-12 p a { + color: #09a3ba; } diff --git a/frontend/src/app/shared/components/global-footer/global-footer.component.ts b/frontend/src/app/shared/components/global-footer/global-footer.component.ts index f886a6505..aaf80f781 100644 --- a/frontend/src/app/shared/components/global-footer/global-footer.component.ts +++ b/frontend/src/app/shared/components/global-footer/global-footer.component.ts @@ -2,6 +2,7 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'; import { Observable } from 'rxjs'; import { NavigationService } from '../../../services/navigation.service'; import { Env, StateService } from '../../../services/state.service'; +import { IBackendInfo } from '../../../interfaces/websocket.interface'; @Component({ selector: 'app-global-footer', @@ -14,6 +15,9 @@ export class GlobalFooterComponent implements OnInit { networkPaths: { [network: string]: string }; officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE; networkPaths$: Observable>; + backendInfo$: Observable; + frontendGitCommitHash = this.stateService.env.GIT_COMMIT_HASH; + packetJsonVersion = this.stateService.env.PACKAGE_JSON_VERSION; constructor( public stateService: StateService, @@ -23,6 +27,7 @@ export class GlobalFooterComponent implements OnInit { ngOnInit(): void { this.env = this.stateService.env; this.networkPaths$ = this.navigationService.subnetPaths; + this.backendInfo$ = this.stateService.backendInfo$; } }