summaryrefslogtreecommitdiff
path: root/recipeBuddy
diff options
context:
space:
mode:
authorschencej <55326070+schencej@users.noreply.github.com>2019-12-10 17:32:06 -0500
committerGitHub <noreply@github.com>2019-12-10 17:32:06 -0500
commit3b8dd74dcb2be88630099772e0902e1dfbcde92c (patch)
treef1a10c6a2e092de028810bc842dc11bde2580a49 /recipeBuddy
parent3fd5630cae141bf49537537315d23bdbf92f8493 (diff)
parentdb8efeafb8e3a427cded4ffa1b8fdcda789cbdaa (diff)
Merge pull request #21 from tuckerevans/top_bar
Add toolbar to main app template
Diffstat (limited to 'recipeBuddy')
-rw-r--r--recipeBuddy/src/app/app.component.html18
-rw-r--r--recipeBuddy/src/app/app.module.ts4
2 files changed, 20 insertions, 2 deletions
diff --git a/recipeBuddy/src/app/app.component.html b/recipeBuddy/src/app/app.component.html
index 014c6b0..830c5cb 100644
--- a/recipeBuddy/src/app/app.component.html
+++ b/recipeBuddy/src/app/app.component.html
@@ -1,2 +1,18 @@
-<h1>{{title}}</h1>
+<mat-toolbar color="primary">
+ <span style="margin-left: 15px">
+ <button mat-button routerLink="/" routerLinkActive="active"><h1>{{title}}</h1></button>
+ </span>
+ <span style="flex: 1 1 auto"></span>
+ <div style="margin-right: 15px">
+ <button mat-icon-button routerLink="/add" routerLinkActive="active">
+ <mat-icon style="padding-left: 8px; padding-right: 8px">add</mat-icon>
+ </button>
+ <button mat-icon-button routerLink="/cart" routerLinkActive="active">
+ <mat-icon style="padding-left: 8px; padding-right: 8px">shopping_cart</mat-icon>
+ </button>
+ <button mat-icon-button routerLink="/search" routerLinkActive="active">
+ <mat-icon style="padding-left: 8px; padding-right: 8px">search</mat-icon>
+ </button>
+ </div>
+</mat-toolbar>
<router-outlet></router-outlet>
diff --git a/recipeBuddy/src/app/app.module.ts b/recipeBuddy/src/app/app.module.ts
index 4acbaa6..83747b4 100644
--- a/recipeBuddy/src/app/app.module.ts
+++ b/recipeBuddy/src/app/app.module.ts
@@ -18,6 +18,7 @@ import { MatInputModule } from '@angular/material/input';
import { MatFormFieldModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
+import { MatToolbarModule } from '@angular/material/toolbar';
import { EditRecipeComponent } from './edit-recipe/edit-recipe.component';
@NgModule({
@@ -37,7 +38,8 @@ import { EditRecipeComponent } from './edit-recipe/edit-recipe.component';
MatInputModule,
MatFormFieldModule,
MatIconModule,
- MatButtonModule
+ MatButtonModule,
+ MatToolbarModule
],
providers: [],
bootstrap: [AppComponent]