Add background for army overview

pull/23/head
HardiReady 2018-01-13 15:03:12 +01:00
parent 9c92c7713e
commit cf7260a06d
3 changed files with 18 additions and 3 deletions

View File

@ -27,7 +27,7 @@
.middle-row { .middle-row {
min-height: 120px; min-height: 120px;
border: rgb(34, 34, 34); border: rgb(34, 34, 34);
background-color: white; background-color: #ffffffe0;
border-left-style: solid; border-left-style: solid;
border-right-style: solid; border-right-style: solid;
} }

View File

@ -1,8 +1,9 @@
import {Component} from "@angular/core"; import {Component, Inject} from "@angular/core";
import {Army} from "../models/model-interfaces"; import {Army} from "../models/model-interfaces";
import {ArmyService} from "../services/army-service/army.service"; import {ArmyService} from "../services/army-service/army.service";
import {ActivatedRoute, Router} from "@angular/router"; import {ActivatedRoute, Router} from "@angular/router";
import {Fraction} from "../utils/fraction.enum"; import {Fraction} from "../utils/fraction.enum";
import {DOCUMENT} from "@angular/common";
@Component({ @Component({
@ -18,16 +19,30 @@ export class ArmyComponent {
constructor(private router: Router, constructor(private router: Router,
private route: ActivatedRoute, private route: ActivatedRoute,
private armyService: ArmyService) { private armyService: ArmyService,
@Inject(DOCUMENT) private document) {
} }
ngOnInit() { ngOnInit() {
// set background image css
const backgroundCss = ' background-image: url(../assets/bg.jpg);\n' +
' background-size: cover;\n' +
' background-attachment: fixed;\n' +
' background-position: center;\n' +
' background-repeat: no-repeat;';
this.document.getElementById('right').setAttribute('style', backgroundCss);
// init army data
this.armyService.getArmy() this.armyService.getArmy()
.subscribe(army => { .subscribe(army => {
this.army = army; this.army = army;
}); });
}; };
ngOnDestroy() {
this.document.getElementById('right').setAttribute('style', '');
}
select(memberId) { select(memberId) {
this.router.navigate([{outlets: {'right': ['member', memberId]}}], {relativeTo: this.route}); this.router.navigate([{outlets: {'right': ['member', memberId]}}], {relativeTo: this.route});
} }

BIN
static/src/assets/bg.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 968 KiB