diff --git a/README.md b/README.md index 6cb8acd..a64fe88 100644 --- a/README.md +++ b/README.md @@ -2,14 +2,14 @@ Free meal planner for cooks short on ideas! (like me …) -[Available on](https://chefs-meal-planner.onrender.com/) +[v.0.1 Available Here!](https://chefs-meal-planner.onrender.com/) ## Features -- Random meal suggestion -- Search by name: you're look for a recipe? Ours are easy to make and Yummy! +- Random meal suggestion ✓ +- Search by name: you're look for a recipe? Ours are easy to make and Yummy! ✓ - What's in the fridge ? Choose your main ingredient and get a meal suggestion -- Choose by category: +- Choose by category: ✓ - Beef - Breakfast - Chicken @@ -55,10 +55,11 @@ Free meal planner for cooks short on ideas! (like me …) - Suggestions based on what your personal taste - Recipes in Video - Get a full menu (Starter, Main, Dessert + Cocktail) +- Send a daily suggestion to newsletter ## Supports -- Web +- Web ✓ - Progressive Web App - Mobile @@ -71,7 +72,7 @@ Free meal planner for cooks short on ideas! (like me …) ## Versions -### Features in V.0.1 +### Features in v.0.1 - WebApp - Random meal suggestion @@ -82,3 +83,5 @@ Free meal planner for cooks short on ideas! (like me …) - put a preloader - change favicon +- visual styling +- route bad request to notFOund (exple: /categories/string) diff --git a/src/App.js b/src/App.js index a708359..c5c790a 100644 --- a/src/App.js +++ b/src/App.js @@ -93,7 +93,7 @@ const App = () => { } }; - const getFromAPI = (keyword, set, option = null) => { + const getData = (keyword, set, option = null) => { const URI = createURI(keyword, option); fetch(URI) .then(response => response.json()) @@ -103,20 +103,20 @@ const App = () => { // Fetch wrappers for each use const getRandomMeal = () => { // setIsLoading(true); - getFromAPI("random", setMeal); + getData("random", setMeal); // setIsLoading(false); }; const getMeal = id => { - getFromAPI(id, setMeal, "lookup"); + getData(id, setMeal, "lookup"); }; const getCategories = () => { - getFromAPI("categories", setCategories); + getData("categories", setCategories); }; const getSearchResults = () => { - getFromAPI(searchString, setSearchResults, "search"); + getData(searchString, setSearchResults, "search"); }; const handleChange = ev => { @@ -156,7 +156,7 @@ const App = () => { /> Chef \ No newline at end of file diff --git a/src/images/breakfast.svg b/src/images/breakfast.svg new file mode 100644 index 0000000..8420c41 --- /dev/null +++ b/src/images/breakfast.svg @@ -0,0 +1 @@ +breakfast \ No newline at end of file diff --git a/src/images/healthy_options.svg b/src/images/healthy_options.svg new file mode 100644 index 0000000..1b4a6f4 --- /dev/null +++ b/src/images/healthy_options.svg @@ -0,0 +1 @@ +healthy_options \ No newline at end of file diff --git a/src/images/special_event.svg b/src/images/special_event.svg new file mode 100644 index 0000000..c17b19f --- /dev/null +++ b/src/images/special_event.svg @@ -0,0 +1 @@ +special_event \ No newline at end of file diff --git a/src/index.css b/src/index.css index 0296b46..45f6b3f 100644 --- a/src/index.css +++ b/src/index.css @@ -10,19 +10,11 @@ body { flex-direction: column; } -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", - monospace; -} - -main { - flex: 1 0 auto; -} - div { white-space: pre-wrap; } .background { - background-image: url(./images/parallax1.jpg); + background-image: url(./images/Chef.svg); + /* width: 100%; */ } diff --git a/src/pages/Category.js b/src/pages/Category.js index b88e616..a113d95 100644 --- a/src/pages/Category.js +++ b/src/pages/Category.js @@ -3,11 +3,11 @@ import { useParams, Link, useRouteMatch } from "react-router-dom"; const CategoryPage = props => { const [meals, setMeals] = useState({ meals: [] }); - const { getFromAPI } = props; + const { getData } = props; const { strCategory } = useParams(); const getMeals = () => { - getFromAPI(strCategory, setMeals, "filter"); + getData(strCategory, setMeals, "filter"); }; useEffect(() => { diff --git a/src/pages/Home.js b/src/pages/Home.js index 4d46550..ce32c09 100644 --- a/src/pages/Home.js +++ b/src/pages/Home.js @@ -3,10 +3,27 @@ import RandomButton from "../components/RandomButton"; const HomePage = props => { return ( -
-
-

The Chef's Meal Suggestions

- +
+
+
+
+

The Chef's Meal Suggestions

+ +
+
+ hero_image +
+
);