-
+
Jake Albrecht
Director
diff --git a/libs/openchallenges/team/src/lib/team.component.scss b/libs/openchallenges/team/src/lib/team.component.scss
index 7b1a821c6f..0377532676 100644
--- a/libs/openchallenges/team/src/lib/team.component.scss
+++ b/libs/openchallenges/team/src/lib/team.component.scss
@@ -19,8 +19,9 @@
align-items: center;
}
.member-pic {
+ width: 240px;
height: 240px;
- padding: 12px 0 22px;
+ margin: 12px 0 22px;
-moz-border-radius: 50%;
-webkit-border-radius: 505;
border-radius: 50%;
diff --git a/libs/openchallenges/team/src/lib/team.component.ts b/libs/openchallenges/team/src/lib/team.component.ts
index 02c8613052..39d06343c3 100644
--- a/libs/openchallenges/team/src/lib/team.component.ts
+++ b/libs/openchallenges/team/src/lib/team.component.ts
@@ -3,6 +3,8 @@ import { Component, OnInit, Renderer2 } from '@angular/core';
import { RouterModule } from '@angular/router';
import {
Image,
+ ImageAspectRatio,
+ ImageHeight,
ImageService,
} from '@sagebionetworks/openchallenges/api-client-angular';
import { ConfigService } from '@sagebionetworks/openchallenges/config';
@@ -24,14 +26,19 @@ export class TeamComponent implements OnInit {
public privacyPolicyUrl: string;
public termsOfUseUrl: string;
public apiDocsUrl: string;
- public logo$: Observable | undefined;
- public thomas$: Observable | undefined;
- public rong$: Observable | undefined;
- public verena$: Observable | undefined;
- public maria$: Observable | undefined;
- public gaia$: Observable | undefined;
- public jake$: Observable | undefined;
- public sage$: Observable | undefined;
+
+ public avatarImageHeight: ImageHeight = ImageHeight._500px;
+ public avatarImageAspectRatio: ImageAspectRatio = ImageAspectRatio._11;
+
+ public ocLogo$: Observable | undefined;
+ public sageLogo$: Observable | undefined;
+
+ public thomasAvatar$: Observable | undefined;
+ public rongAvatar$: Observable | undefined;
+ public verenaAvatar$: Observable | undefined;
+ public mariaAvatar$: Observable | undefined;
+ public gaiaAvatar$: Observable | undefined;
+ public jakeAvatar$: Observable | undefined;
constructor(
private readonly configService: ConfigService,
@@ -48,29 +55,26 @@ export class TeamComponent implements OnInit {
}
ngOnInit() {
- this.logo$ = this.imageService.getImage({
+ this.ocLogo$ = this.imageService.getImage({
objectKey: 'openchallenges-icon.svg',
});
- this.thomas$ = this.imageService.getImage({
- objectKey: 'team/thomas.png',
- });
- this.rong$ = this.imageService.getImage({
- objectKey: 'team/rong.png',
- });
- this.verena$ = this.imageService.getImage({
- objectKey: 'team/verena.png',
- });
- this.maria$ = this.imageService.getImage({
- objectKey: 'team/maria.png',
- });
- this.gaia$ = this.imageService.getImage({
- objectKey: 'team/gaia.jpg',
- });
- this.jake$ = this.imageService.getImage({
- objectKey: 'team/jake.png',
- });
- this.sage$ = this.imageService.getImage({
+ this.sageLogo$ = this.imageService.getImage({
objectKey: 'logo/sage-bionetworks-alt.svg',
});
+
+ this.thomasAvatar$ = this.getAvatarImage('team/thomas_schaffter_v3.jpg');
+ this.verenaAvatar$ = this.getAvatarImage('team/verena_chung.jpg');
+ this.rongAvatar$ = this.getAvatarImage('team/rong_chai.jpg');
+ this.mariaAvatar$ = this.getAvatarImage('team/maria.png');
+ this.gaiaAvatar$ = this.getAvatarImage('team/gaia_andreoletti.jpg');
+ this.jakeAvatar$ = this.getAvatarImage('team/jake_albrecht.jpg');
+ }
+
+ private getAvatarImage(objectKey: string): Observable {
+ return this.imageService.getImage({
+ objectKey,
+ height: ImageHeight._500px,
+ aspectRatio: ImageAspectRatio._11,
+ });
}
}