DandyLyons/React-Example

[FEATURE] `Footer` Component

Opened this issue · 1 comments

DandyLyons commented

Footer Component

We will be implementing the Footer Component.

If you would like to be assigned to this Issue please comment below. Please comment with any questions you have.

User Story:

As a user,
I want to be able to see important yet supplementary information such as the copyright of this sight
so that I can be aware.

Description:

The Footer section is an opportunity to show others important yet supplementary information.

Acceptance Criteria:

  • There should be a new file named Footer.tsx in the src directory.
  • Footer does NOT need to navigate to other pages. We are just focusing on design implementation for now.
  • Footer should follow the design as closely as possible, inclu. same fonts, layout, icon assets, colors etc.
  • Buttons should have some sort of highlight effect when the mouse is hovering over it so that the user can see that it is clickable.
  • For consistency, try to follow the structure of the figma design as closely as possible, unless there is a good reason to deviate:
    • e.g. If there is a sub container in Figma, consider putting a sub container in your code.
    • e.g. Try to make sure that the names of your containers and Components in React match the names in Figma.

Design Mockup/Assets:

Go to this link: Footer Component Design in Figma

Screenshot 2023-10-27 at 1 24 50 PM

Additional Information:

  • Use Figma Dev Mode as a STARTING POINT. It will generate CSS code on your behalf. However, don't blindly use the code it generates. Read it yourself, understand it, and make any necessary changes.

  • Please watch this short video to learn more about Figma Dev Mode: Figma tutorial: Intro to Dev Mode - YouTube

Priority:

High

Linked Issues/PRs:

Due Date:

Try to complete this before mid-November.

DanWang625 commented

I'd like to try this one. Also, who wants to be paired with me?