Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: enhance accessibilty and seo for hero section #529

Open
wants to merge 2 commits into
base: beta
Choose a base branch
from
Open

feat: enhance accessibilty and seo for hero section #529

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a8f5b88
enhance accessibilty and seo for hero section
sohaibchebah Aug 15, 2024
657767e
feat(hero): enhance accessibility and seo for hero
sohaibchebah Aug 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions src/components/Hero.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,24 @@
const Hero = () => (
<div className="flex flex-col py-24 items-center mx-2.5">
<section
aria-labelledby="hero-heading"
Comment on lines +2 to +3
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

refactor (blocking): assistive technologies know how to pick up the header within the section, so no need for aria.

Suggested change
<section
aria-labelledby="hero-heading"
<section

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks a lot for the information 😊

className="flex flex-col py-24 items-center mx-2.5">

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)

Check failure on line 4 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

The closing bracket must be aligned with the opening tag (expected column 3 on the next line)
<div>
<h1 className="font-Lexend text-4xl md:text-5xl text-center text-lightSlate leading-tight tracking-tight">
<h1
className="font-Lexend text-4xl md:text-5xl text-center text-lightSlate leading-tight tracking-tight"
id="hero-heading"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

refactor (blocking): not required base on comment above.

Suggested change
id="hero-heading"

>
{`Find `}

<span className="bg-gradient-to-r from-gradFirst via-gradMiddle to-gradLast bg-clip-text text-transparent">
<span

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 11 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line
className="bg-gradient-to-r from-gradFirst via-gradMiddle to-gradLast bg-clip-text text-transparent"
aria-label="Open-Source Repositories"

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically

Check failure on line 13 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

Props should be sorted alphabetically
>
Open-Source Repositories
</span>

<br />

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line

Check warning on line 17 in src/components/Hero.tsx

View workflow job for this annotation

GitHub Actions / Code standards 

JSX element should start in a new line
trending today.
</h1>
</div>
</div>
</section>
);

export default Hero;
Loading