MultiverseLearningProducts · TajSmith77 · Mar 5, 2024
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/ChickenMasala.JPG b/ChickenMasala.JPG
diff --git a/FriedChicken.jpg b/FriedChicken.jpg
diff --git a/Hibachi.jpg b/Hibachi.jpg
diff --git a/index.html b/index.html
@@ -5,13 +5,60 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Culinary Chronicles </title>
+    <link rel = "stylesheet" href = "style.css">
 </head>
 <body>
     <h1>Culinary Chronicles: Showcasing the Best Food in the World</h1>
-    <h3>A website by: PARTNER 1 & PARTNER 2</h3>
+    <h3 class = "Headers3">A website by: Jay & Taj</h3>
 
     <!-- Create a list of your favorite cuisines and pictures -->
+    <h3 id="CuisineHeader">These are my top 7 cuisines</h3>
 
+
+    <ol>
+        <div id ="ItalianDiv">
+        <li>Italian</li>
+            <ul>
+                <li><img alt="Sphagetti" src="https://bing.com/th?id=OSK.aab048abdb80c73af1d642f9f12c4ed6" /></li>
+                <li><a href="https://www.averiecooks.com/easy-15-minute-spaghetti/">Recipe</a></li>
+            </ul>
+        </div>
+    <div id ="JapaneseDiv">
+        <li>Japanese</li>
+            <ul>
+                <li><img alt="Hibachi" src="Hibachi.jpg" /></li>
+                <li><a href="https://www.wholesomeyum.com/hibachi-chicken/">Recipe</a></li>
+            </ul>
+    </div>
+    <div id="IndianDiv">
+        <li>Indian</li>
+            <ul>
+                <li><img alt="Pho" src="pho.jpg" /></li>
+                <li><a href="https://hot-thai-kitchen.com/beef-pho/">Recipe</a></li>
+            </ul>
+        </div>
+        <div id="ThaiDiv">
+        <li>Thai</li>
+            <ul>
+                <li><img alt="chicken masala" src="ChickenMasala.JPG" /></li>
+                <li><a href="https://www.seriouseats.com/chicken-tikka-masala-for-the-grill-recipe">Recipe</a></li>
+            </ul>
+        </div>
+        <div id="MexicanDiv">
+        <li>Mexican</li>
+            <ul>
+                <li><img alt="Quesadilla" src="quesadilla.jpg" /></li>
+                <li><a href="https://culturedtable.com/shredded-beef-quesadilla/">Recipe</a></li>
+            </ul>
+        </div>
+        <div id="SoulFoodDiv">
+        <li>Soul Food</li>
+            <ul>
+                <li><img alt="Fried Chicken" src="FriedChicken.jpg" /></li>
+                <li><a href="https://www.seriouseats.com/the-food-lab-southern-fried-chicken-recipe">Recipe</a></li>
+            </ul>
+        </div>
+    </ol>
 
 
     <!-- Create a list of your favorite dishes with pictures -->

diff --git a/pho.jpg b/pho.jpg
diff --git a/quesadilla.jpg b/quesadilla.jpg
diff --git a/style.css b/style.css
@@ -0,0 +1,58 @@
+body {
+    background-color: coral;
+
+}
+
+h1 {
+    background-image: linear-gradient(to right, white, #B284BE)
+}
+
+ol {
+    background-color: firebrick;
+}
+
+ol li {
+    color: white;
+    font-size: 16px
+}
+
+ul li {
+    font-size: 20px
+}
+
+.Headers3 {
+    color:azure;
+}
+
+#CuisineHeader {
+    font-family: fantasy;
+}
+
+#ItalianDiv {
+    background-color: green;
+}
+
+#JapaneseDiv {
+    background-color: red;
+}
+
+#IndianDiv {
+    background-color: orange;
+}
+
+#ThaiDiv {
+    background-color: lightblue;
+}
+
+#MexicanDiv {
+    background-color: lightgreen;
+}
+
+#SoulFoodDiv {
+    background-color: purple;
+}
+
+img {
+    height: 200px;
+    width: 300px;
+}