US9-NavBar

[gwittm]

As a User I want to have a NavBar. in order to quickly navigate to different sites.

Description

Acceptance criteria

• [x] a NavBar on each site at the bottom. Each link in the NavBar should correctly redirect to its corresponding page. This includes:
  • [x] homepage
  • [x] add new recipe page.
• [x] The link that redirects to the "Add new recipe" page shows a plus icon.
• [x] The link corresponding to the current page should be distinctly styled to indicate it is active.

Tasks

• [x] create new branch "US9-NavBar"
• [x] create new component NavBar.js
• [x] display-flex, position-fixed, z-Index
• create Links to:
  • [x] HomePage
  • [x] Add newRecipe
• [x] change link-styles of current page

[gwittm]

.

[Julia-Pickel]

Hey @akyil88 @gwittm @StephanLippert 🙌

Very cool project so far!

We have some suggestions for you:

• we would recommend to have the same navbar on every page (also because you mentioned in the tasks that you create a new Component called NavBar.js)
• therefore you can think about putting the back button to the specific page or to the navbar as an overall feature

[JessicaLoers]

Hi @gwittm ✌️

I have some suggestions to make your user story more detailed and precise.

Acceptance criteria

• [ ] a NavBar on each site at the bottom, with some links in it. ➡️ Which links? A more detailed explanation is not only advantageous but also necessary for a valid acceptance criteria. The icon that can be seen in the wireframe should also be mentioned here. Example:

• [ ] Each link in the NavBar should correctly redirect to its corresponding page. This includes: homepage, add new recipe page.

• [ ] The link that redirects to the "Add new recipe" page shows a plus icon.

• [ ] the link of the current page shows a visible difference ➡️ _What are the differences? Please explain this in more detail. Example:

• [ ] The link corresponding to the current page should be distinctly styled to indicate it is active.

By outlining specific conditions that must be met, acceptance criteria guide developers in creating features that align with the user's needs and expectations. 🙂

[StephanLippert]

Thank you for your suggestions/explanations 😇 I'll try to keep that in mind, for my next UserStories.

[BirkBee]

I did your QA, I really like to see your new design features, they look very good already 🙌 LGTM 🚀