WebUI-Project-Based-07-nr / Client

MIT License
0 stars 0 forks source link

Guest header #21

Open vlad-khrychov opened 2 months ago

vlad-khrychov commented 2 months ago

As a Guest, I want to see the home page header, so that I can navigate the functional in a Guest role

Acceptance criteria:

  1. When a Guest opens the home page, he/she can see the home page header on the top. The Mockups: • for Desktop Image

  2. Guest’s home page header has to contain six functional clickable buttons:

    • The “Space2Study” logo button;
    • The “What can you do” button;
    • The ”How it works” button;
    • The “Who we are” button;
    • The “Login” button.
  3. When a Guest scrolls the home page up and down, the header is constantly fixed on the home page top.

  4. When a Guest clicks on the “Space2Study” logo button, then the system scrolls back to the welcoming block.

  5. When a Guest hovers over the “Space2Study” logo button, then the background area appears.

  6. When a Guest clicks on the “What can you do” button, then the system scrolls the home page to the “What can you do” block and “What can you do” button becomes underlined.

  7. When a Guest clicks on the “How it works” button, then the system scrolls the home page to the “How it works” block and “How it works” button becomes underlined.

  8. When a Guest clicks on the “Who we are” button, then the system scrolls the home page to the “Who we are” block and “Who we are” button becomes underlined.

  9. When a Guest hovers over the “What can you do”, “How it works” and “Who we are” buttons, then the color changes.

  10. When a Guest clicks on the “Login” button, then the Login popup appears.

  11. When a Guest hovers over the “Login” button, then the color changes. • for Tablet Image

• for Mobile Image

  1. Student’s home page header (Tablet/Mobile version) has to contain four functional clickable buttons. From left to right:
    • The “Space2Study” logo button;
    • The Image login button;
    • The Image hamburger button.
  2. When a Guest taps on the Image login button, then the Login popup appears.
  3. When a Student taps on the Image hamburger button he/she can see right pop-up window with sections: a) When a Student taps on the “What can you do” button, then the system scrolls the home page to the “What can you do” block; b) When a Student taps on the “How it works” button, then the system scrolls the home page to the “How it works” block; c) When a Student taps on the “Who we are” button, then the system scrolls the home page to the “Who we are” block. d) The pop-up has the close button on the upper right corner. When a Guest taps on the close button, pop-up closes and a Guest goes to the last viewed block. The mockup: Image
markgol777 commented 1 month ago

(it has already been done before us)