summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoryuzu-eva <stevenhu@web.de>2023-03-20 17:06:04 +0100
committeryuzu-eva <stevenhu@web.de>2023-03-20 17:06:04 +0100
commitd34cc22d958cc33b03f5e1d097629c0c61f9c57d (patch)
treeb47a93838240b75bb88ffb305bd1fa82a6893876
parent6d919f453fd39a96f3999f5249aa3a17fe5740d6 (diff)
added recipes
-rw-r--r--images/big-dick.jpgbin0 -> 21521 bytes
-rw-r--r--images/dog.jpgbin1021417 -> 0 bytes
-rw-r--r--images/favicon.icobin0 -> 2238 bytes
-rw-r--r--images/omurice.jpgbin0 -> 590832 bytes
-rw-r--r--images/oyakodon.jpgbin0 -> 43159 bytes
-rw-r--r--images/pizza.jpgbin0 -> 61986 bytes
-rw-r--r--index.html7
-rw-r--r--static/about.html10
-rw-r--r--static/recipes/omurice.html110
-rw-r--r--static/recipes/overview.html47
-rw-r--r--static/recipes/oyakodon.html102
-rw-r--r--static/recipes/pizza.html99
-rw-r--r--static/style.css22
13 files changed, 388 insertions, 9 deletions
diff --git a/images/big-dick.jpg b/images/big-dick.jpg
new file mode 100644
index 0000000..b84ab8d
--- /dev/null
+++ b/images/big-dick.jpg
Binary files differ
diff --git a/images/dog.jpg b/images/dog.jpg
deleted file mode 100644
index a236a64..0000000
--- a/images/dog.jpg
+++ /dev/null
Binary files differ
diff --git a/images/favicon.ico b/images/favicon.ico
new file mode 100644
index 0000000..b699d94
--- /dev/null
+++ b/images/favicon.ico
Binary files differ
diff --git a/images/omurice.jpg b/images/omurice.jpg
new file mode 100644
index 0000000..ae72cf6
--- /dev/null
+++ b/images/omurice.jpg
Binary files differ
diff --git a/images/oyakodon.jpg b/images/oyakodon.jpg
new file mode 100644
index 0000000..8054aed
--- /dev/null
+++ b/images/oyakodon.jpg
Binary files differ
diff --git a/images/pizza.jpg b/images/pizza.jpg
new file mode 100644
index 0000000..3ef7810
--- /dev/null
+++ b/images/pizza.jpg
Binary files differ
diff --git a/index.html b/index.html
index 389c3ec..58d5a85 100644
--- a/index.html
+++ b/index.html
@@ -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;
}