school/html-java-script/week13/flexbox/oatmeal_cookies.html
2021-11-19 11:26:46 -05:00

94 lines
3.5 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>binary eats - Oatmeal Coconut Pantry Cookies</title>
<link href="styles.css" rel="stylesheet">
</head>
<body>
<header>
<div class="logo">binary eats</div>
<div>
<a href="">sign-in</a>
<a href="">search</a>
</div>
</header>
<div class="content">
<div class="main-content">
<div class="title">
<h1>OATMEAL COCONUT PANTRY COOKIES</h1>
<p>Chef Roman, August 24, 2018</p>
</div>
<div class="summary">
<img src="oatmealCookie_small.jpg" alt="Photo of two of the world's best oatmeal cookies">
<div>
<div>
<p>Prep Time:</p>
<p>30 minutes</p>
</div>
<div>
<p>Cooking Time:</p>
<p>9-13 minutes</p>
</div>
<div>
<p>Skill level:</p>
<p>Easy</p>
</div>
<div>
<p>Makes:</p>
<p>24 cookies</p>
</div>
</div>
</div>
<div class="ingredients">
<h2>Ingredients</h2>
<ul>
<li>⅔ cup granulated sugar</li>
<li>⅔ cup packed brown sugar</li>
<li>1 cup butter</li>
<li>2 eggs</li>
<li>1 teaspoon vanilla</li>
<li>1 teaspoon baking soda</li>
<li>½ teaspoon baking powder</li>
<li>½ teaspoon salt</li>
<li>3 cups quick-cooking or old-fashioned oats</li>
<li>1 cup all-purpose flour</li>
<li>1 ½ cup Toasted Coconut*</li>
<li>½ cup golden raisins</li>
<li>½ cup chopped walnuts</li>
<li>½ cup mini chocolate chips</li>
</ul>
<p>* Now with more coconut</p>
</div>
<div class="directions">
<h2>Directions</h2>
<ol>
<li>Toast coconut at 350° F for about 10-15 minutes. Stir/toss every 5 minutes. Coconut should be golden brown. Be careful...coconut can go from golden brown to burnt very quickly. Cool completely.</li>
<li>Beat sugar, butter, vanilla, and eggs.</li>
<li>Mix all other ingredients together. The flour should coat all the ingredients. Then mix into the wet ingredients.</li>
<li>Scoop cookies and press the dough firmly the ensure the shape is held.</li>
<li>Bake at 375° F for about 9-13 minutes. This really depends on how big you made the cookies. Start at 9 minutes, and then just keep checking until they are done.</li>
</ol>
</div>
</div>
<div class="related-content">
<div>
<h4>010 RELATED RECIPES:</h4>
<ul>
<li>Melt-in-the-mouth Cookies</li>
<li>German Chocolate Cake</li>
</ul>
</div>
<div>
<h4>TOP 011 RECIPES:</h4>
<ul>
<li>Umeboshi Chicken</li>
<li>Battleship Curry</li>
<li>Gran Marnier Souffle</li>
</ul>
</div>
</div>
</div>
</body>
</html>