Technigo · T-Thiry · Mar 5, 2025 · Mar 5, 2025 · Mar 10, 2025 · Mar 10, 2025
diff --git a/.DS_Store b/.DS_Store
diff --git a/Images/.DS_Store b/Images/.DS_Store
diff --git a/Images/French-moules- frites.jpg b/Images/French-moules- frites.jpg
diff --git a/Images/Greek-salad.jpg b/Images/Greek-salad.jpg
diff --git a/Images/Greek-traditional-salad.jpg b/Images/Greek-traditional-salad.jpg
diff --git a/Images/Italian-frutti-di-mare.jpg b/Images/Italian-frutti-di-mare.jpg
diff --git a/Images/Italian-truffle-spaghetti.jpg b/Images/Italian-truffle-spaghetti.jpg
diff --git a/Images/Spanish-crudo.jpg b/Images/Spanish-crudo.jpg
diff --git a/Images/Spanish-tapas.jpg b/Images/Spanish-tapas.jpg
diff --git a/Images/Spanish-vegetable-stew.jpg b/Images/Spanish-vegetable-stew.jpg
diff --git a/README.md b/README.md
@@ -1 +1,3 @@
 # js-project-recipe-library
+
+()
diff --git a/index.html b/index.html
@@ -0,0 +1,176 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Home</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <h1>Recipe Library</h1>
+
+  <div class="filter-buttons">
+    <h2>Filter</h2>
+    <button class="filter-btn selected">All</button>
+    <button class="filter-btn">Italian</button>
+    <button class="filter-btn">Mexican</button>
+    <button class="filter-btn">American</button>
+    <button class="filter-btn">European</button>
+    <button class="filter-btn">Asian</button>
+  </div>
+
+  <div class="sort-buttons">
+    <h2>Sort</h2>
+    <button class="sort-btn">Ascending</button>
+    <button class="sort-btn">Descending</button>
+  </div>
+
+  <div class="random-button">
+    <h2>Want a random recipe?</h2>
+    <button class="random-btn">Surprise Me!</button>
+  </div>
+
+  <div id="quota-message" class="hidden">
+    <p>You've exceeded the API quota limit for the day. Please try again later.</p>
+  </div>
+
+
+  <!-- This section is commented out
+  <div class="no-match">
+    <h2>Sorry, we have no recipes to show for now.</h2>
+  </div>
+
+  <div class="recipe-container">
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Italian-frutti-di-mare.jpg" 
+        alt="frutti di mare dish"
+        >
+      <h2>Frutti di Mare</h2>
+      <hr>
+      <h3>Cuisine: Italian</h3>
+      <h3>Cooking time: 30 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>400g Pasta</li>
+        <li>500g Black mussels</li>
+        <li>200 shrimp (peeled)</li>
+        <li>2 Tomatoes</li>
+        <li>3 tbs Olive Oil</li>
+        <li>1 glove Basil leaves (for garnish)</li>
+      </ul>
+    </div>
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Italian-truffle-spaghetti.jpg" 
+        alt="bucatini with black truffle dish"
+      >
+      <h2>Bucatini with Black Truffle</h2>
+      <hr>
+      <h3>Cuisine: Italian</h3>
+      <h3>Cooking time: 30 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>400g Pasta</li>
+        <li>1 Black truffle (thinly sliced)</li>
+        <li>4 anchovy fillets (minced)</li>
+        <li>2 gloves galic (minced)</li>
+        <li>3 tbs Olive oil</li>
+        <li>Salt (pinch)</li>
+      </ul>
+    </div>
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Spanish-tapas.jpg"  
+        alt="tapas with clams and shrimps dish"
+      >
+      <h2>Tapas with Shrimp</h2>
+      <hr>
+      <h3>Cuisine type: Spanish</h3>
+      <h3>Cooking time: 25 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>1 Baguette</li>
+        <li>2 dozen shrimps</li>
+        <li>Fresh cilantro (minced)</li>
+        <li>2 red bell pepper (minced)</li>
+        <li>3 tbs Olive Oil</li>
+        <li>Salt (pinch)</li>
+      </ul>
+    </div>
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Spanish-vegetable-stew.jpg" 
+        alt="vegetable stew dish"
+      >
+      <h2>Vegetable Stew</h2>
+      <hr>
+      <h3>Cuisine: Spanish</h3>
+      <h3>Cooking time: 40 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>6 potatoes</li>
+        <li>500g Flat green bean</li>
+        <li>1/2 White Cabbage</li>
+        <li>200ml Vegetable Broth</li>
+        <li>3 tbs Olive Oil</li>
+        <li>Salt (pinch)</li>
+      </ul>
+    </div>
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Greek-traditional-salad.jpg" 
+        alt="greek salad dish"
+      >
+      <h2>Greek Salad</h2>
+      <hr>
+      <h3>Cuisine: Greek</h3>
+      <h3>Cooking time: 20 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>2 Tomatoes</li>
+        <li>1/2 Cucumber</li>
+        <li>150g Feta cheese</li>
+        <li>1 Red onion</li>
+        <li>300g Black olives</li>
+        <li>3tbs Olive oil</li>
+      </ul>
+    </div>
+
+    <div class="recipe-card">
+      <img 
+        src="./Images/Greek-salad.jpg"  
+        alt="greek salad dish"
+        >
+      <h2>Greek Salad with Pomegranate</h2>
+      <hr>
+      <h3>Cuisine: Greek</h3>
+      <h3>Cooking time: 20 minutes</h3>
+      <hr>
+      <p>Ingredients:</p>
+      <ul>
+        <li>2 Tomatoes</li>
+        <li>1/2 Cucumbee</li>
+        <li>1 Red onion</li>
+        <li>1/4 Red cabbage</li>
+        <li>1 Pomegranate</li>
+        <li>200g Corn</li>
+      </ul>
+    </div>
+
+  </div>
+This section is commented out -->
+
+  <script src="./script.js"></script>
+</body>
+</html>