feat: creating a footer #42
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import React from "react"; | ||
| import Image from "next/image"; | ||
| import logo from "../../stories/assets/logo.png"; | ||
|
|
||
| const Footer = () => { | ||
| return ( | ||
| <footer | ||
| style={{ | ||
| width: "100%", | ||
| position: "fixed", | ||
| bottom: "0", | ||
| margin: "auto", | ||
| textAlign: "center", | ||
| }} | ||
| > | ||
| <Image src={logo} alt="footer-logo" width={100} height="auto" /> | ||
|
There was a problem hiding this comment. Concerning accessibility, think of a better alt text for the logo, or if alt text is even needed. There was a problem hiding this comment. Hi @YuriDevAT! :) I think it's best to keep the alt text so it can be read by screen readers. There was a problem hiding this comment. You are right, alt text is for being read by screen reader users, but that does not necessarily mean you should add one. Especially when it comes to logos (which does not link to anything, yet), the alt text should be left empty like this There was a problem hiding this comment. A detailed alt text is typical and very good when it comes to images, I never saw it for logos, though. Logos are mostly used as links (like, Go To Homepage, or Go To Website when it is a logo which links to another companies website). But at the current state, the logo does not link anywhere, so no alt text needed (it will be a future issue, though, so keep your eyes open 👀 ) ❗ But I like how detailed you are able to describe even a logo, this is a skill not many people have. Hopefully, you make good use of it in the future, when alt text is needed on descriptive images 🙌🏽 |
||
| <p className="copyright"> | ||
|
There was a problem hiding this comment. Is this class in use? If not, then it can be deleted. |
||
| AccessibilityMentor 2023. All rights reserved. | ||
| </p> | ||
| </footer> | ||
| ); | ||
| }; | ||
|
|
||
| export default Footer; | ||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Isn't necessary to fulfill the AC 👇🏽
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Noted