Global footer component that fixes Liquid
This commit is contained in:
		
							parent
							
								
									af73c69e96
								
							
						
					
					
						commit
						f63613c7c3
					
				@ -107,12 +107,7 @@
 | 
			
		||||
 | 
			
		||||
  <app-language-selector></app-language-selector>
 | 
			
		||||
 | 
			
		||||
  <div class="text-small text-center mt-3">
 | 
			
		||||
    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
 | 
			
		||||
    |
 | 
			
		||||
    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <app-global-footer></app-global-footer>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
<ng-template #loadingTmpl>
 | 
			
		||||
 | 
			
		||||
@ -432,11 +432,12 @@
 | 
			
		||||
    {{ (backendInfo$ | async)?.hostname }} (v{{ (backendInfo$ | async )?.version }}) [<a href="https://github.com/mempool/mempool/commit/{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}">{{ (backendInfo$ | async )?.gitCommit | slice:0:8 }}</a>]
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <br><br>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
<br>
 | 
			
		||||
 | 
			
		||||
<ng-template #loadingSponsors>
 | 
			
		||||
  <br>
 | 
			
		||||
  <div class="spinner-border text-light"></div>
 | 
			
		||||
</ng-template>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -96,5 +96,6 @@
 | 
			
		||||
 | 
			
		||||
<router-outlet></router-outlet>
 | 
			
		||||
 | 
			
		||||
<br>
 | 
			
		||||
<app-global-footer></app-global-footer>
 | 
			
		||||
 | 
			
		||||
</ng-container>
 | 
			
		||||
@ -69,26 +69,5 @@
 | 
			
		||||
  <router-outlet></router-outlet>
 | 
			
		||||
</main>
 | 
			
		||||
 | 
			
		||||
<footer *ngIf="networkPaths['mainnet'] !== '/about'">
 | 
			
		||||
  <div class="pref-selectors">
 | 
			
		||||
    <div class="selector">
 | 
			
		||||
      <app-language-selector></app-language-selector>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="selector">
 | 
			
		||||
      <app-fiat-selector></app-fiat-selector>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <div class="terms-of-service">
 | 
			
		||||
    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
 | 
			
		||||
    |
 | 
			
		||||
    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
 | 
			
		||||
    |
 | 
			
		||||
    <a *ngIf="officialMempoolSpace && networkPaths['mainnet'] === '/lightning' else broadcastTransaction" [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]">Connect to our nodes</a>
 | 
			
		||||
    <ng-template #broadcastTransaction>
 | 
			
		||||
      <a [routerLink]="['/tx/push' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</a>
 | 
			
		||||
    </ng-template>
 | 
			
		||||
  </div>
 | 
			
		||||
  <br>
 | 
			
		||||
</footer>
 | 
			
		||||
<app-global-footer></app-global-footer>
 | 
			
		||||
</ng-container>
 | 
			
		||||
 | 
			
		||||
@ -193,27 +193,3 @@ nav {
 | 
			
		||||
    font-size: 7px;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
footer {
 | 
			
		||||
  text-align: center;
 | 
			
		||||
  margin-top: auto;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.terms-of-service {
 | 
			
		||||
  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;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -0,0 +1,22 @@
 | 
			
		||||
<footer *ngIf="networkPaths['mainnet'] !== '/about'">
 | 
			
		||||
  <div class="pref-selectors">
 | 
			
		||||
    <div class="selector">
 | 
			
		||||
      <app-language-selector></app-language-selector>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="selector">
 | 
			
		||||
      <app-fiat-selector></app-fiat-selector>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <div class="terms-of-service">
 | 
			
		||||
    <a [routerLink]="['/terms-of-service']" i18n="shared.terms-of-service|Terms of Service">Terms of Service</a>
 | 
			
		||||
    |
 | 
			
		||||
    <a [routerLink]="['/privacy-policy']" i18n="shared.privacy-policy|Privacy Policy">Privacy Policy</a>
 | 
			
		||||
    |
 | 
			
		||||
    <a *ngIf="officialMempoolSpace && networkPaths['mainnet'] === '/lightning' else broadcastTransaction" [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]">Connect to our nodes</a>
 | 
			
		||||
    <ng-template #broadcastTransaction>
 | 
			
		||||
      <a [routerLink]="['/tx/push' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</a>
 | 
			
		||||
    </ng-template>
 | 
			
		||||
  </div>
 | 
			
		||||
  <br>
 | 
			
		||||
</footer>
 | 
			
		||||
@ -0,0 +1,23 @@
 | 
			
		||||
footer {
 | 
			
		||||
  text-align: center;
 | 
			
		||||
  margin-top: auto;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.terms-of-service {
 | 
			
		||||
  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;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@ -0,0 +1,28 @@
 | 
			
		||||
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 | 
			
		||||
import { NavigationService } from '../../../services/navigation.service';
 | 
			
		||||
import { Env, StateService } from '../../../services/state.service';
 | 
			
		||||
 | 
			
		||||
@Component({
 | 
			
		||||
  selector: 'app-global-footer',
 | 
			
		||||
  templateUrl: './global-footer.component.html',
 | 
			
		||||
  styleUrls: ['./global-footer.component.scss'],
 | 
			
		||||
  changeDetection: ChangeDetectionStrategy.OnPush,
 | 
			
		||||
})
 | 
			
		||||
export class GlobalFooterComponent implements OnInit {
 | 
			
		||||
  env: Env;
 | 
			
		||||
  networkPaths: { [network: string]: string };
 | 
			
		||||
  officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE;
 | 
			
		||||
 | 
			
		||||
  constructor(
 | 
			
		||||
    public stateService: StateService,
 | 
			
		||||
    private navigationService: NavigationService,
 | 
			
		||||
  ) {}
 | 
			
		||||
 | 
			
		||||
  ngOnInit(): void {
 | 
			
		||||
    this.env = this.stateService.env;
 | 
			
		||||
    this.navigationService.subnetPaths.subscribe((paths) => {
 | 
			
		||||
      this.networkPaths = paths;
 | 
			
		||||
    });
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
@ -88,6 +88,7 @@ import { TimestampComponent } from './components/timestamp/timestamp.component';
 | 
			
		||||
import { ToggleComponent } from './components/toggle/toggle.component';
 | 
			
		||||
import { GeolocationComponent } from '../shared/components/geolocation/geolocation.component';
 | 
			
		||||
import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.component';
 | 
			
		||||
import { GlobalFooterComponent } from './components/global-footer/global-footer.component';
 | 
			
		||||
 | 
			
		||||
@NgModule({
 | 
			
		||||
  declarations: [
 | 
			
		||||
@ -170,6 +171,7 @@ import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.
 | 
			
		||||
    ToggleComponent,
 | 
			
		||||
    GeolocationComponent,
 | 
			
		||||
    TestnetAlertComponent,
 | 
			
		||||
    GlobalFooterComponent,
 | 
			
		||||
  ],
 | 
			
		||||
  imports: [
 | 
			
		||||
    CommonModule,
 | 
			
		||||
@ -276,6 +278,7 @@ import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.
 | 
			
		||||
    ToggleComponent,
 | 
			
		||||
    GeolocationComponent,
 | 
			
		||||
    PreviewTitleComponent,
 | 
			
		||||
    GlobalFooterComponent,
 | 
			
		||||
  ]
 | 
			
		||||
})
 | 
			
		||||
export class SharedModule {
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user