diff --git a/apple-pie/index.html b/apple-pie/index.html index 970b1de..6bb12c7 100644 --- a/apple-pie/index.html +++ b/apple-pie/index.html @@ -5,17 +5,72 @@ Apple Pie Recipe + - Apple Pies This was my grandmother's 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

+
+
+ + + + + +
+

Directions

+
+
+

+ 1) 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. +

+

+ 2) 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. +

+

+ 3) 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. +

+
+
diff --git a/apple-pie/styles/style.css b/apple-pie/styles/style.css index e69de29..0e7aa98 100644 --- a/apple-pie/styles/style.css +++ b/apple-pie/styles/style.css @@ -0,0 +1,137 @@ +* { + font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, + Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; + font-size: medium; + letter-spacing: 1px; + font-weight: 100; + margin: 0px; +} +.header { + position: relative; +} +.menu-img { + max-height: 45vh; + object-fit: cover; + width: 100%; + height: auto; +} + +.menu-title { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + text-align: center; + text-align: center; + font-size: 48px; + font-weight: 200; + color: #ffffff; + z-index: 1; +} + +.content { + margin: 50px; + padding: 20px; +} +.content p { + text-align: justify; +} +.menu-description { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 30px; +} +.img-recipe { + max-width: 30vw; +} + +.menu-separator { + border: 1px solid #aba2a2; + margin: 30px 0px; +} + +h3 { + font-size: 16px; + font-weight: 500; + margin-bottom: 20px; + text-align: left; +} +ul { + list-style: none; + padding-left: 5px; +} +ul li::before { + content: "- "; + margin-right: 2px; +} +ul li { + margin: 7px 0px; +} +.menu-ingredients { +} +.img-cookinginfo { + position: relative; + left: 50%; + top: 50%; + transform: translate(-50%); + margin-top: 30px; + max-width: 30vw; +} + +.directions-content p { + margin: 10px 0px; +} +@media (min-width: 1024px) { + .content { + max-width: 1024px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin: 0 auto; + } + .menu-img { + width: 100%; + object-fit: cover; + } + .menu-ingredients { + align-self: flex-start; + width: 100%; + } + .cooking-info { + display: flex; + justify-content: center; + align-items: center; + margin: 0 auto; + width: 100%; + } + .img-cookinginfo { + position: static; + transform: none; + max-width: 30vw; + min-width: 20vw; + margin-top: 30px; + } + + .menu-separator { + border: 1px solid #aba2a2; + margin: 30px 0px; + width: 100%; + } + + .directions { + align-self: flex-start; + } +} + +@media (max-width: 425px) { + .menu-description .menu-ingredients { + width: 100%; + } + + .img-recipe .img-cookinginfo { + width: 100%; + } +}