diff options
| -rw-r--r-- | images/big-dick.jpg | bin | 0 -> 21521 bytes | |||
| -rw-r--r-- | images/dog.jpg | bin | 1021417 -> 0 bytes | |||
| -rw-r--r-- | images/favicon.ico | bin | 0 -> 2238 bytes | |||
| -rw-r--r-- | images/omurice.jpg | bin | 0 -> 590832 bytes | |||
| -rw-r--r-- | images/oyakodon.jpg | bin | 0 -> 43159 bytes | |||
| -rw-r--r-- | images/pizza.jpg | bin | 0 -> 61986 bytes | |||
| -rw-r--r-- | index.html | 7 | ||||
| -rw-r--r-- | static/about.html | 10 | ||||
| -rw-r--r-- | static/recipes/omurice.html | 110 | ||||
| -rw-r--r-- | static/recipes/overview.html | 47 | ||||
| -rw-r--r-- | static/recipes/oyakodon.html | 102 | ||||
| -rw-r--r-- | static/recipes/pizza.html | 99 | ||||
| -rw-r--r-- | static/style.css | 22 |
13 files changed, 388 insertions, 9 deletions
diff --git a/images/big-dick.jpg b/images/big-dick.jpg Binary files differnew file mode 100644 index 0000000..b84ab8d --- /dev/null +++ b/images/big-dick.jpg diff --git a/images/dog.jpg b/images/dog.jpg Binary files differdeleted file mode 100644 index a236a64..0000000 --- a/images/dog.jpg +++ /dev/null diff --git a/images/favicon.ico b/images/favicon.ico Binary files differnew file mode 100644 index 0000000..b699d94 --- /dev/null +++ b/images/favicon.ico diff --git a/images/omurice.jpg b/images/omurice.jpg Binary files differnew file mode 100644 index 0000000..ae72cf6 --- /dev/null +++ b/images/omurice.jpg diff --git a/images/oyakodon.jpg b/images/oyakodon.jpg Binary files differnew file mode 100644 index 0000000..8054aed --- /dev/null +++ b/images/oyakodon.jpg diff --git a/images/pizza.jpg b/images/pizza.jpg Binary files differnew file mode 100644 index 0000000..3ef7810 --- /dev/null +++ b/images/pizza.jpg @@ -6,6 +6,8 @@ <meta charset="UTF-8"> <meta name="viewport" content="width=devide-width,initial-scale=1"> <link rel="stylesheet" href="static/style.css"> + <link rel="icon" type="image/x-icon" href="images/favicon.ico" sizes="16x16"> + </head> <body> @@ -18,6 +20,9 @@ <li> <a href="static/about.html">About</a> </li> + <li> + <a href="static/recipes/overview.html">Recipes</a> + </li> </ul> </nav> @@ -58,7 +63,7 @@ </ol> </div> <div id="img-wrapper"> - <img src="./images/dog.jpg" alt="This is a cute picture of a dog"> + <img src="./images/big-dick.jpg" alt="This is a picture of Konata from Lucky Star with a hoodie that says 'big dick is back in town'"> </div> </main> </body> diff --git a/static/about.html b/static/about.html index a7d2cff..c5750c7 100644 --- a/static/about.html +++ b/static/about.html @@ -2,10 +2,11 @@ <html lang="en-US"> <head> - <title>Website About</title> + <title>About yuzu-eva's odin project</title> <meta charset="UTF-8"> <meta name="viewport" content="width=devide-width,initial-scale=1"> - <link rel="stylesheet" href="style.css"> + <link rel="stylesheet" href="./style.css"> + <link rel="icon" type="image/x-icon" href="../images/favicon.ico" sizes="16x16"> </head> <body> @@ -16,7 +17,10 @@ <a href="../index.html">Home</a> </li> <li> - <a href="about.html">About</a> + <a href="./about.html">About</a> + </li> + <li> + <a href="./recipes/overview.html">Recipes</a> </li> </ul> </nav> diff --git a/static/recipes/omurice.html b/static/recipes/omurice.html new file mode 100644 index 0000000..73d983c --- /dev/null +++ b/static/recipes/omurice.html @@ -0,0 +1,110 @@ +<!DOCTYPE html> +<html lang="en-US"> + +<head> + <title>Omurice Recipe</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=devide-width,initial-scale=1"> + <link rel="stylesheet" href="../style.css"> + <link rel="icon" type="image/x-icon" href="../../images/favicon.ico" sizes="16x16"> +</head> + +<body> + <header> + <nav> + <ul> + <li> + <a href="../../index.html">Home</a> + </li> + <li> + <a href="../static/about.html">About</a> + </li> + <li> + <a href="./overview.html">Recipes</a> + </li> + </ul> + </nav> + + <h1>My Omurice Recipe</h1> + </header> + <main> + <div id="lists"> + <h2>Description</h2> + <p> + This is my take on Omurice, a popular japanese chicken fried rice dish with an omelette on top. + </p> + + <h2>Ingredients</h2> + <ul> + <li>100g Chicken Thigh or Breast</li> + <li>1 tbsp Soy Sauce</li> + <li>1 tbsp Worcestershire Sauce</li> + <li>3 tbsp Ketchup</li> + <li>1 Carrot</li> + <li>Half an Onion</li> + <li>3 Cloves of Garlic</li> + <li>150g Rice</li> + <li>3 Eggs</li> + </ul> + + <h2>Directions</h2> + <ol> + <li> + <p> + Cut the chicken into bite-sized pieces. + Dice the carrot and the onion. + Mince the garlic. + </p> + </li> + <li> + <p> + Fry the chicken over medium heat until the outside begins to brown. Remove from pan. + </p> + </li> + <li> + <p> + Fry the carrot and the onion over medium-low heat until soft. + </p> + </li> + <li> + <p> + Add the garlic to the pan and sautee until fragrant. + </p> + </li> + <li> + <p> + Add the chicken together with the rice back into the pan. + Add Ketchup, Soy Sauce and Worcestershire Sauce and fry for another minute. + </p> + </li> + <li> + <p> + Put the fried rice into a bowl and press it down tightly. + Put the bowl upside-down on a plate and leave it for later. + </p> + </li> + <li> + <p> + Mix 3 eggs together and pour them in a non-stick pan over medium-high heat. + Stir constantly from the outside-in, until a nice fluffy middle has formed, then reduce the heat to low. + Then let it cook until the bottom has settled and the top is still a bit undercooked. + </p> + </li> + <li> + <p> + Remove the bowl from the plate, so you have a nice mound of rice, and pour the egg directly + from the pan over the top. You can add a bit more Ketchup, if you like. + </p> + </li> + </ol> + </div> + + <div id="img-wrapper"> + <img src="../../images/omurice.jpg" alt="An image of oyakodon."> + </div> + + </main> +</body> +<script src=""></script> + +</html> diff --git a/static/recipes/overview.html b/static/recipes/overview.html new file mode 100644 index 0000000..d28bf84 --- /dev/null +++ b/static/recipes/overview.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<html lang="en-US"> + +<head> + <title>Recipes Overview</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=devide-width,initial-scale=1"> + <link rel="stylesheet" href="../style.css"> + <link rel="icon" type="image/x-icon" href="../../images/favicon.ico" sizes="16x16"> +</head> + +<body> + <header> + <nav> + <ul> + <li> + <a href="../../index.html">Home</a> + </li> + <li> + <a href="../about.html">About</a> + </li> + <li> + <a href="./overview.html">Recipes</a> + </li> + </ul> + </nav> + + <h1>My Top Recipes!</h1> + </header> + + <main> + <ul id="recipe-list"> + <li id="recipe-item"> + <a href="./pizza.html">Pizza</a> + </li> + <li id="recipe-item"> + <a href="./oyakodon.html">Oyakodon</a> + </li> + <li id="recipe-item"> + <a href="./omurice.html">Omurice</a> + </li> + </ul> + </main> +</body> +<script src=""></script> + +</html> diff --git a/static/recipes/oyakodon.html b/static/recipes/oyakodon.html new file mode 100644 index 0000000..f041473 --- /dev/null +++ b/static/recipes/oyakodon.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html lang="en-US"> + +<head> + <title>Oyakodon Recipe</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=devide-width,initial-scale=1"> + <link rel="stylesheet" href="../style.css"> + <link rel="icon" type="image/x-icon" href="../../images/favicon.ico" sizes="16x16"> +</head> + +<body> + <header> + <nav> + <ul> + <li> + <a href="../../index.html">Home</a> + </li> + <li> + <a href="../static/about.html">About</a> + </li> + <li> + <a href="./overview.html">Recipes</a> + </li> + </ul> + </nav> + + <h1>My Oyakodon Recipe</h1> + </header> + <main> + <div id="lists"> + <h2>Description</h2> + <p> + This is my take on Oyakodon, a japanese chicken and egg rice bowl. + </p> + + <h2>Ingredients</h2> + <ul> + <li>100g Chicken Thigh</li> + <li>30g Soy Sauce</li> + <li>30g Mirin</li> + <li>30g Sake</li> + <li>100g Dashi Stock</li> + <li>Half an Onion</li> + <li>1 Spring Onion</li> + <li>Half a Bowl of Rice</li> + <li>1 Whole Egg</li> + <li>Optional: 1 Egg Yolk</li> + </ul> + + <h2>Directions</h2> + <ol> + <li> + <p> + Cut half an onion from tip to root into strips. + Cut the chicken thigh into bite-sized pieces. + Thinly cut the spring onion as garnish for later. + </p> + </li> + <li> + <p> + Fry the chicken over medium heat until the outside is beginning to brown. + </p> + </li> + <li> + <p> + Add the soy sauce, mirin, sake and dashi stock into the pan. + At this point, also add the cut onion. + Cover with a lid and let it simmer for 5 minutes. + </p> + </li> + <li> + <p> + Lightly mix the egg in a bowl. + Add half of the egg into the pan, cover and let it simmer for half a minute. + </p> + </li> + <li> + <p> + After half a minute, add the rest of the egg and some of the spring onion.<br> + Let it simmer for an additional minute. + </p> + </li> + <li> + <p> + Pour everything in the pan over the bowl of rice. + Add the rest of the spring onion on top. + If raw eggs are safe to eat where you live, you can add an egg yolk on top. + </p> + </li> + </ol> + </div> + + <div id="img-wrapper"> + <img src="../../images/oyakodon.jpg" alt="An image of oyakodon."> + </div> + + </main> +</body> +<script src=""></script> + +</html> diff --git a/static/recipes/pizza.html b/static/recipes/pizza.html new file mode 100644 index 0000000..3141a6f --- /dev/null +++ b/static/recipes/pizza.html @@ -0,0 +1,99 @@ +<!DOCTYPE html> +<html lang="en-US"> + +<head> + <title>Pizza Recipe</title> + <meta charset="UTF-8"> + <meta name="viewport" content="width=devide-width,initial-scale=1"> + <link rel="stylesheet" href="../style.css"> + <link rel="icon" type="image/x-icon" href="../../images/favicon.ico" sizes="16x16"> +</head> + +<body> + <header> + <nav> + <ul> + <li> + <a href="../../index.html">Home</a> + </li> + <li> + <a href="../static/about.html">About</a> + </li> + <li> + <a href="./overview.html">Recipes</a> + </li> + </ul> + </nav> + + <h1>My Pizza Recipe</h1> + </header> + <main> + <div id="lists"> + <h2>Description</h2> + <p> + This is my take on a classic margherita pizza.<br> + We will make our own pizza dough and sauce! + </p> + + <h2>Ingredients</h2> + <ul> + <li>500g Flour</li> + <li>325g Water</li> + <li>10g Salt</li> + <li>7g Active Dry Yeast</li> + <li>400g Canned Tomatoes (~1 Can)</li> + <li>200g Mozzarella</li> + </ul> + + <h2>Directions</h2> + <ol> + <li> + <p> + Mix all dry ingredients in a bowl. + </p> + </li> + <li> + <p> + Add the water and knead the dough until no dry flour is left.<br> + Cover the bowl and let it rest a couple hours, until doubled in size.<br> + You can also let it rest overnight. + </p> + </li> + <li> + <p> + Once the dough has finished resting, take it out of the bowl onto your working surface + and knead it a bit more, about 2-3 minutes.<br> + Divide the dough into two equally sized portions. Take one portion and lightly cover it + with a damp towel to let it rest for an additional hour.<br> + You can put the other portion into the fridge or freezer. + While the dough is resting one final time, preheat the oven as high as your oven can go.<br> + </p> + </li> + <li> + <p> + Meanwhile we're making the pizza sauce.<br> + For this, we're just going to crush the canned tomatoes. You can use + your hands or puree it with a stick blender. Add some salt and pepper to your liking.<br> + If you're feeling fancy, you can add oregano and thyme, or any other additional seasonings you like. + </p> + </li> + <li> + <p> + Stretch out the dough as big as you can.<br> + Put the sauce and mozzarella on top. I like to rip the mozzarella by hand.<br> + Then the pizza goes into the oven for about 7-10 minutes, depending how hot you oven goes.<br> + Once the mozzarella starts bubbling and is a nice golden brown it's done! + </p> + </li> + </ol> + </div> + + <div id="img-wrapper"> + <img src="../../images/pizza.jpg" alt="An image of a classic margherita pizza."> + </div> + + </main> +</body> +<script src=""></script> + +</html> diff --git a/static/style.css b/static/style.css index 032e2ce..f0c3d2a 100644 --- a/static/style.css +++ b/static/style.css @@ -39,16 +39,28 @@ nav a { #lists { float: left; - padding-left: 10%; - max-width: 70%; + padding-left: 5%; + max-width: 45%; } #img-wrapper { float: right; - padding-right: 10%; - max-width: 30%; + padding-right: 5%; + max-width: 40%; } img { - max-height: 500px; + max-height: 400px; + max-width: 100%; +} + +#recipe-list { + padding-left: 30%; + list-style-type: none; + +} + +#recipe-item { + padding: 5px; + font-size: 26px; } |
