diff --git a/apple-pie/index.html b/apple-pie/index.html index 7d33866..b92baf6 100644 --- a/apple-pie/index.html +++ b/apple-pie/index.html @@ -1,21 +1,65 @@ - - - - - - Apple Pie Recipe - - - - Apple Pies This was Juan Carlos apple pie recipe. I have never seen another one quite like it. It will always - be my favorite and has won me several first place prizes in local competitions. I hope it becomes one of your - favorites as well! Ingredients 1 recipe pastry for a 9 inch double crust pie 1/2 cup unsalted butter 3 tablespoons - all-purpose flour 1/4 cup water 3 tablespoons all-purpose flour 1/4 cup water 1/2 cup white sugar 1/2 cup packed - brown sugar 8 Granny Smith apples - peeled, cored and sliced Directions Preheat oven to 425 degrees F (220 degrees - C). Melt the butter in a saucepan. Stir in flour to form a paste. Add water, white sugar and brown sugar, and bring - to a boil. Reduce temperature and let simmer. Place the bottom crust in your pan. Fill with apples, mounded - slightly. Cover with a lattice work crust. Gently pour the sugar and butter liquid over the crust. Pour slowly so - that it does not run off. Bake 15 minutes in the preheated oven. Reduce the temperature to 350 degrees F (175 - degrees C). Continue baking for 35 to 45 minutes, until apples are soft. - - + + + + + + Apple Pie Recipe + + + + +
+

Apple Pie

+
+
+
+

+ This was Juan Carlos apple pie recipe. I have never seen another one quite like it. It will always be my favorite and has won me several first place prizes in local competitions. I hope it becomes one of your favorites as well! +

+ recipe-info +
+
+ +
+
+
+ +

Ingredients

+ +
+ cooking-info +
+
+
+ +
+ + + diff --git a/apple-pie/src/styles/style.css b/apple-pie/src/styles/style.css index a1504fe..9ea24b5 100644 --- a/apple-pie/src/styles/style.css +++ b/apple-pie/src/styles/style.css @@ -1,9 +1,99 @@ /*Some necessary adjustments*/ -h1,body,html,main { +h1,body,html,main, h3, p { margin: 0; + --white: #fff; + font-size: 18px; + --gray: #656565; } /*Import the font and set the default size*/ html { font-family: "Open Sans", sans-serif; font-size: 18px; } +header{ + background-image: url('../images/apple-pie.jpg'); + background-size: cover; + height: 100vh; + width: 100vw; + color: var(--white); + display: flex; + justify-content: center; + align-items: center; +} + +h1 { + font-size: 4em; + font-weight: 100; +} + +h3, li, p { + color: var(--gray); +} + +h3{ + font-weight: 400; +} + +p, li{ + font-weight: 300; +} + +main, section, footer{ + width: 100vw; +} +article { + width: 80vw; +} + +main { + height: 50vh; + display: flex; + justify-content: center; +} + +main article{ + width: 80vw; + height: inherit; + display: flex; + flex-direction: column; + justify-content: space-evenly; + align-items: center; +} +article img { + width: 50vw; +} + hr { + width: inherit; + } + +section { + display: flex; + justify-content: center; +} + +section li { + list-style: none; +} + +article div { + display: flex; + justify-content: center; +} + +footer { + height: 60vh; + display: flex; + justify-content: center; + align-items: center; +} + +footer article { + height: 50vh; + display: flex; + flex-direction: column; + justify-content: space-evenly; +} + +footer article div { + flex-direction: column; +} diff --git a/french-soup/index.html b/french-soup/index.html index b9b10cd..69009a4 100644 --- a/french-soup/index.html +++ b/french-soup/index.html @@ -5,17 +5,60 @@ French Onion Soup Recipe + - French Onion Soup We have been trying French onion soup in restaurants for years and my family and friends agree - none can compare to my recipe for taste and simplicity of preparation. Ingredients 1/2 cup unsalted butter 2 - tablespoons olive oil 4 cups sliced onions 4 (10.5 ounce) cans beef broth 2 tablespoons dry sherry (optional) 1 - teaspoon dried thyme salt and pepper to taste 4 slices French bread 4 slices provolone cheese 2 slices Swiss cheese, - diced 1/4 cup grated Parmesan cheese Directions Melt butter with olive oil in an 8 quart stock pot on medium heat. - Add onions and continually stir until tender and translucent. Do not brown the onions. Add beef broth, sherry and - thyme. Season with salt and pepper, and simmer for 30 minutes. Heat the oven broiler. Ladle soup into oven safe - serving bowls and place one slice of bread on top of each (bread may be broken into pieces if you prefer). Layer - each slice of bread with a slice of provolone, 1/2 slice diced Swiss and 1 tablespoon Parmesan cheese. Place bowls - on cookie sheet and broil in the preheated oven until cheese bubbles and browns slightly. +
+

French Onion Soup

+
+ +
+
+

+ We have been trying French onion soup in restaurants for years and my family and friends agree none can compare to my recipe for taste and simplicity of preparation. +

+ recipe-info-onion +
+
+
+ +
+
+ + cooking-info-onion +
+
+
+ \ No newline at end of file diff --git a/french-soup/src/styles/main.css b/french-soup/src/styles/main.css index 67f2156..481e7c1 100644 --- a/french-soup/src/styles/main.css +++ b/french-soup/src/styles/main.css @@ -1,9 +1,97 @@ /*Some necessary adjustments*/ -h1, body, html, main { +h1, body, html, main, ul { margin: 0; } /*Import the font and set the default size*/ html { font-family: 'Open Sans', sans-serif; - font-size: 18px -} \ No newline at end of file + font-size: 18px; + --white: #fff; + --gray: #656565; +} + +header { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background-image: url('../images/soup.jpg'); + background-size: cover; + text-align: center; +} + +h1 { + color: var(--white); + font-weight: 300; + font-size: 4em; +} + +main, section, footer { + width: 100vw; + display: flex; + justify-content: center; + text-align: center; +} + +main { + height: 50vh; +} + +article { + width: 80vw; + max-width: 700px; + height: inherit; + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-evenly; +} + +section { + height: 70vh; +} +section article{ + text-align: center; +} + +article img { + width: 70vw; + max-width: 500px; +} + +hr{ + width: inherit; + max-width: 700px; +} + +article p { + text-align: justify; + font-size: 1em; + color: var(--gray); +} + +article h3 { + text-align: start; + color: var(--gray); +} + +ul li { + list-style: none; + text-align: start; + font-size: 1.1em; + color: var(--gray); +} + +ul { + padding: 0; +} + +aside { + width: inherit; + max-width: 700px; +} + +footer { + height: 70vh; +}