create: draw app/password app

kyvycodes · Sep 20, 2021 · 80ea063 · 80ea063
1 parent cfd8dc0
commit 80ea063
Show file tree

Hide file tree

Showing 10 changed files with 60 additions and 13 deletions.
diff --git a/drawing-app/.DS_Store b/drawing-app/.DS_Store
diff --git a/drawing-app/index.html b/drawing-app/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang-"en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name= "viewpoint"
+ content="width=device-width, initial-scale=1.0">
+    <title>Time to draw 🖍</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="script.js" defer></script>
+  </head>
+  <h1>Hello World</h1>
+</html>
diff --git a/drawing-app/script.js b/drawing-app/script.js
diff --git a/drawing-app/style.css b/drawing-app/style.css
@@ -0,0 +1,10 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap');
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  font-family: "Poppins", sans-serif;
+  margin: 0;
+}
diff --git a/password-generator/.DS_Store b/password-generator/.DS_Store
diff --git a/password-generator/index.html b/password-generator/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang-"en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name= "viewpoint"
+ content="width=device-width, initial-scale=1.0">
+    <title>Let's make you a password !</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="script.js" defer></script>
+  </head>
+  <h1>Hello World</h1>
+</html>
diff --git a/password-generator/script.js b/password-generator/script.js
diff --git a/password-generator/style.css b/password-generator/style.css
@@ -0,0 +1,10 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap');
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  font-family: "Poppins", sans-serif;
+  margin: 0;
+}
diff --git a/recipe-app/index.html b/recipe-app/index.html
@@ -21,7 +21,7 @@
       </header>
       <div class="fav-container">
         <h3> Favorite Meals</h3>
-        <ul class="fav-meals" id='fav-meals'>
+        <ul class="fav-meals" id="favorite-meals">
         </ul>
       </div>
         <div class='meals' id='meals'>

diff --git a/recipe-app/script.js b/recipe-app/script.js
@@ -1,5 +1,5 @@
 const meals = document.getElementById("meals");
-const favoriteContainer = document.getElementById("fav-meals");
+const favoriteContainer = document.getElementById("favorite-meals");
 
 getRandomMeal();
 fetchFavMeals();
@@ -22,16 +22,14 @@ async function getRandomMealById(id) {
 
   const respData = await resp.json();
   const meal = respData.meals[0];
-  // console.log("by id", respData);
-
   return meal;
 }
 
-// async function getMealsBySearch(factor) {
-//   const meals = await fetch(
-//     "https://www.themealdb.com/api/json/v1/1/search.php?s=" + factor
-//   );
-// }
+async function getMealsBySearch(factor) {
+  const meals = await fetch(
+    "https://www.themealdb.com/api/json/v1/1/search.php?s=" + factor
+  );
+}
 
 //reallocating from html file
 function addMeal(mealData, random = false) {
@@ -91,20 +89,25 @@ function removeMealsLocalStorage(mealId) {
 async function fetchFavMeals() {
   const mealIds = getMealsLocalStorage();
 
+  // let meals = [];
   for (let i = 0; i < mealIds.length; i++) {
     const mealId = mealIds[i];
-    let meal = await getRandomMealById(mealId);
-    console.log("meal", meal);
+    meal = await getRandomMealById(mealId);
+
+    // meals.push(meal);
+    // console.log("meal", meal);
     addMealToFavs(meal);
   }
 }
 
-//reallocating from html file
+// reallocating from html file
 function addMealToFavs(mealData) {
   const favMeal = document.createElement("li");
 
   favMeal.innerHTML = `
-  <img src='${mealData.strMealThumb}' alt='${mealData.strMeal}'>
+    <img
+      src='${mealData.strMealThumb}'
+      alt='${mealData.strMeal}'>
     <span>${mealData.strMeal}</span>
       `;