diff --git a/src/pages/grid/grid.html b/src/pages/grid/grid.html index a4a8933..4ad642f 100644 --- a/src/pages/grid/grid.html +++ b/src/pages/grid/grid.html @@ -1,9 +1,7 @@ - + - - - + diff --git a/src/pages/grid/grid.scss b/src/pages/grid/grid.scss index 4abcdc2..134cef5 100644 --- a/src/pages/grid/grid.scss +++ b/src/pages/grid/grid.scss @@ -1,7 +1,9 @@ page-grid { - ion-col { - box-sizing: border-box; + .col { + background-size: cover; border: 1px solid #000000; + box-sizing: border-box; + padding: 0 0 33%; } } diff --git a/src/pages/grid/grid.ts b/src/pages/grid/grid.ts index a8b3c8d..b73f68d 100644 --- a/src/pages/grid/grid.ts +++ b/src/pages/grid/grid.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { DomSanitizer } from '@angular/platform-browser'; import { NavController } from 'ionic-angular'; import { ProfileService } from '../../services/profiles'; @@ -13,12 +14,16 @@ export class GridPage { profiles: any; - constructor(public navCtrl: NavController, public profileService: ProfileService) { + constructor(public navCtrl: NavController, public profileService: ProfileService, private _sanitizer: DomSanitizer) { profileService.load().then((data) => { this.profiles = data; }); } + getBackgroundThumbnail(pics) { + return this._sanitizer.bypassSecurityTrustStyle('url(' + pics.thumb + ')'); + } + profileTapped(event, profile) { this.navCtrl.push(ProfilePage, { profile: profile