Added new recipe card and main page components. Added new files in each

of these components for html, css, ts, and spec.ts. HTML and CSS files
were updated with code from stackblitz. Apparently this thing also
thinks I changed the app.module.ts file, but I do not think I did.

5 files changed, 89 insertions, 0 deletions

diff --git a/recipeBuddy/src/app/main-page/main-page.compomemt.html b/recipeBuddy/src/app/main-page/main-page.compomemt.html
new file mode 100644
index 0000000..7a25409
--- /dev/null
+++ b/recipeBuddy/src/app/main-page/main-page.compomemt.html
@@ -0,0 +1,10 @@
+<h1>
+  Recipe Buddy
+</h1>
+<div id="container">
+  <div id="left"><button type="button">Add Recipe</button></div>
+  <div id="right">Search: <input type = "text"> 
+  <input type = "submit"></div>
+  <div id="center"><button type="button">Shopping Cart</button> </div>
+</div>
+<hr>
\ No newline at end of file
diff --git a/recipeBuddy/src/app/main-page/main-page.component.css b/recipeBuddy/src/app/main-page/main-page.component.css
new file mode 100644
index 0000000..4dffa18
--- /dev/null
+++ b/recipeBuddy/src/app/main-page/main-page.component.css
@@ -0,0 +1,29 @@
+p {
+  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+}
+
+h1 {
+  text-align: center;
+  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+}
+h2 {
+font-family:'Times New Roman', Times, serif;
+}
+button{
+  background-color: #D87620;
+  color: white;
+  padding : 15px 25px;
+  cursor: pointer;
+}
+#container{
+  width:100%;
+  }
+#left{
+  float:left;width:100px;
+  }
+#right{
+  float:right;width:175px;
+  }
+#center{
+  margin:0 auto;width:100px;
+  }
\ No newline at end of file
diff --git a/recipeBuddy/src/app/main-page/main-page.component.html b/recipeBuddy/src/app/main-page/main-page.component.html
new file mode 100644
index 0000000..7a25409
--- /dev/null
+++ b/recipeBuddy/src/app/main-page/main-page.component.html
@@ -0,0 +1,10 @@
+<h1>
+  Recipe Buddy
+</h1>
+<div id="container">
+  <div id="left"><button type="button">Add Recipe</button></div>
+  <div id="right">Search: <input type = "text"> 
+  <input type = "submit"></div>
+  <div id="center"><button type="button">Shopping Cart</button> </div>
+</div>
+<hr>
\ No newline at end of file
diff --git a/recipeBuddy/src/app/main-page/main-page.component.spec.ts b/recipeBuddy/src/app/main-page/main-page.component.spec.ts
new file mode 100644
index 0000000..39261a3
--- /dev/null
+++ b/recipeBuddy/src/app/main-page/main-page.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MainPageComponent } from './main-page.component';
+
+describe('MainPageComponent', () => {
+  let component: MainPageComponent;
+  let fixture: ComponentFixture<MainPageComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MainPageComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MainPageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/recipeBuddy/src/app/main-page/main-page.component.ts b/recipeBuddy/src/app/main-page/main-page.component.ts
new file mode 100644
index 0000000..7fadd1c
--- /dev/null
+++ b/recipeBuddy/src/app/main-page/main-page.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-main-page',
+  templateUrl: './main-page.component.html',
+  styleUrls: ['./main-page.component.css']
+})
+export class MainPageComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}