blob: 0574e5f9723ef277af1948ad561e356d1a8123e9 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
<div class="container">
<div class="title">
<h1>{{recipe.name}}</h1>
<h4>Serving {{servingSize}}</h4>
</div>
<div class="previous" *ngIf="!firstStep">
<h3>Step {{stepNum -1}}</h3>
<p>{{previousStep}}</p>
</div>
<div class="current">
<h2>Step {{stepNum}}</h2>
<p>{{currentStep}}</p>
<div *ngIf="hasTimer()" style="border: solid; width: 110px; margin:auto">
<h4>{{timeHoursFirst}}{{timeHoursSecond}}:{{timeMinutesFirst}}{{timeMinutesSecond}}:{{timeSecondsFirst}}{{timeSecondsSecond}}</h4>
<button mat-raised-button style="margin-botton: 20px" (click)="startTimer()">Start Timer</button>
</div>
<button mat-flat-button style="margin-right: 5px; margin-top: 20px;" color="primary" *ngIf="!firstStep" (click)="previous()">Previous</button>
<button mat-flat-button style="margin-left:5px; margin-top: 20px" color="primary" *ngIf="!lastStep" (click)="next()">next</button>
</div>
<div class="next" *ngIf="!lastStep">
<h3>Step {{stepNum +1}}</h3>
<p>{{nextStep}}</p>
</div>
<div *ngIf="lastStep" class="last-button">
<button mat-flat-button color="primary" routerLink='/'>Done</button>
</div>
</div>
<div class="step-count">
<h2>Step: {{stepNum}}/{{steps.length}}</h2>
</div>
|
