add buttons that link to website and github repos for case studies. Make it easy to display multiple testimonials per project
This commit is contained in:
parent
52e2338bf5
commit
c73c806cf5
|
@ -28,16 +28,37 @@
|
|||
fxLayoutGap="2%"
|
||||
fxLayoutAlign="space-between stretch"
|
||||
>
|
||||
<div fxFlex="30%">
|
||||
<div
|
||||
fxFlex="30%"
|
||||
fxLayout="column"
|
||||
fxLayoutGap="2%"
|
||||
>
|
||||
<h2>{{ caseStudy.projectName }}</h2>
|
||||
<h3>{{ caseStudy.organizationName }}</h3>
|
||||
<div
|
||||
*ngIf="caseStudy.testimonials[0]"
|
||||
*ngIf="caseStudy.testimonials"
|
||||
>
|
||||
<div
|
||||
*ngFor="let t of caseStudy.testimonials"
|
||||
class="testimonial"
|
||||
>
|
||||
<p>"{{ caseStudy.testimonials[0].quote}}" - {{ caseStudy.testimonials[0].name}}</p>
|
||||
<p>"{{ t.quote}}"</p>
|
||||
<p>- {{ t.name}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
*ngIf="caseStudy.websiteLink"
|
||||
(click)="goWebsite(caseStudy.websiteLink)"
|
||||
>
|
||||
Visit Website
|
||||
</button>
|
||||
<button
|
||||
*ngIf="caseStudy.gitHubLink"
|
||||
(click)="goWebsite(caseStudy.gitHubLink)"
|
||||
>
|
||||
View on GitHub
|
||||
</button>
|
||||
</div>
|
||||
<div fxFlex="60%">
|
||||
<h3>{{ caseStudy.tagLine }}</h3>
|
||||
<p>{{ caseStudy.description }}</p>
|
||||
|
|
|
@ -20,6 +20,13 @@
|
|||
object-fit: cover;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: mat-color($sartography-warn, 500);
|
||||
color: mat-contrast($sartography-warn, 500);
|
||||
padding: 3%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.intro {
|
||||
background-color: mat-color($sartography-accent, A100);
|
||||
padding: 3%;
|
||||
|
|
|
@ -18,7 +18,6 @@ export class CaseStudiesComponent implements OnInit {
|
|||
ngOnInit() {
|
||||
this.api.getCaseStudies().subscribe(studies => {
|
||||
this.caseStudies = studies;
|
||||
console.log('case studies!', studies);
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -26,4 +25,8 @@ export class CaseStudiesComponent implements OnInit {
|
|||
this.caseStudy = study;
|
||||
}
|
||||
|
||||
goWebsite(link: string) {
|
||||
window.open(link, '_blank');
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue