summaryrefslogtreecommitdiff
path: root/recipeBuddy/src
diff options
context:
space:
mode:
authorTucker Evans <tuckerevans24@gmail.com>2019-12-07 11:51:22 -0500
committerTucker Evans <tuckerevans24@gmail.com>2019-12-08 15:03:07 -0500
commit2a89221eee68bc26ea3e90c380ce983f5a0985f0 (patch)
tree501a272365dca078ec5d63765a940bdf9e35954d /recipeBuddy/src
parent3b43f292a605717d08d3623e09bf35a4e0301414 (diff)
Add removing Ingredients/Steps from add form
Diffstat (limited to 'recipeBuddy/src')
-rw-r--r--recipeBuddy/src/app/add-recipe/add-recipe.component.css30
-rw-r--r--recipeBuddy/src/app/add-recipe/add-recipe.component.html8
-rw-r--r--recipeBuddy/src/app/add-recipe/add-recipe.component.ts8
3 files changed, 45 insertions, 1 deletions
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.css b/recipeBuddy/src/app/add-recipe/add-recipe.component.css
index 901e02d..9d74c53 100644
--- a/recipeBuddy/src/app/add-recipe/add-recipe.component.css
+++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.css
@@ -1,15 +1,43 @@
.form {
min-width: 150px;
max-width: 750px;
- width: 100%;
+ width: 95%;
margin-left: auto;
margin-right: auto;
+ padding-left: 5px;
+ padding-right: 5px;
}
.full-width {
width: 100%;
}
+.half-width {
+ width: 50%;
+ padding: 1%;
+ margin-left:auto;
+ margin-right:auto;
+}
+
+.quarter-width {
+ width: 25%;
+ padding: 1%;
+ margin-left:auto;
+ margin-right:auto;
+}
+
+.third-width {
+ width: 33%;
+ padding: 1%;
+ margin-left:auto;
+ margin-right:auto;
+}
+
td {
padding-right: 8px;
}
+
+.center {
+ margin-left:auto;
+ margin-right:auto;
+}
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.html b/recipeBuddy/src/app/add-recipe/add-recipe.component.html
index 7e80e4e..47d2ea1 100644
--- a/recipeBuddy/src/app/add-recipe/add-recipe.component.html
+++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.html
@@ -43,6 +43,10 @@
<input matInput placeholder="Units" type="text"
formControlName="units">
</mat-form-field>
+ <button matSuffix mat-mini-fab (click)="rmIngredient(i)"
+ type="button" style="margin-left: 10px">
+ <mat-icon>remove</mat-icon>
+ </button>
</div>
</div>
</div>
@@ -63,6 +67,10 @@
<input matInput placeholder="Timer" type="text"
formControlName="timer">
</mat-form-field>
+ <button matSuffix mat-mini-fab (click)="rmStep(i)"
+ type="button" style="margin-left: 10px">
+ <mat-icon>remove</mat-icon>
+ </button>
</div>
</div>
</div>
diff --git a/recipeBuddy/src/app/add-recipe/add-recipe.component.ts b/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
index 469871b..cdd63c8 100644
--- a/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
+++ b/recipeBuddy/src/app/add-recipe/add-recipe.component.ts
@@ -61,6 +61,10 @@ export class AddRecipeComponent {
);
}
+ rmIngredient(i) {
+ this.ingredients.removeAt(i);
+ }
+
get steps() {
return this.recipeForm.get('steps') as FormArray;
}
@@ -74,6 +78,10 @@ export class AddRecipeComponent {
);
}
+ rmStep(i) {
+ this.steps.removeAt(i);
+ }
+
onSubmit() {
var formData = this.recipeForm.value;