fix: Footer added

[Wellitsabhi]

Description

Added Footer in 'Learn' and 'About' section

Validation

Related Issues

Fixes #6829

Check List

• I have read the Contributing Guidelines and made commit messages that follow the guideline.
• I have run npm run format to ensure the code follows the style guide.
• I have run npm run test to check if all tests are passing.
• I have run npx turbo build to check if the website builds without errors.
• I've covered new added functionality with unit tests if necessary.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Jun 21, 2024 6:38pm

[github-actions]

Lighthouse Results

URL	Performance	Accessibility	Best Practices	SEO	Report
/en	🟢 99	🟢 100	🟢 100	🟢 91	🔗
/en/about	🟢 100	🟢 100	🟢 100	🟢 91	🔗
/en/about/previous-releases	🟢 100	🟢 100	🟢 100	🟢 92	🔗
/en/download	🟢 99	🟢 100	🟢 96	🟢 91	🔗
/en/blog	🟢 99	🟢 100	🟢 100	🟢 92	🔗

[github-actions]

Unit Test Coverage Report

Lines	Statements	Branches	Functions
	90.67% (593/654)	76.08% (175/230)	94.57% (122/129)

Unit Test Report

Tests	Skipped	Failures	Errors	Time
131	0 💤	0 ❌	0 🔥	5.257s ⏱️

[AugustinMauroy]

Ok good, but you need to do something ´cause actually the footer take to much place on mobile screen.

[Wellitsabhi]

Ok , will add css for small screens only

[bmuenzenmeyer]

the footer should not be sticky - it should be the natural last item in the scrolled content

[Wellitsabhi]

My finding is issue only persists where ArticleLayout comp is used.
For check - I inserted dummy data in /about , and was working fine , no sticky footer

WhatsApp.Video.2024-06-11.at.21.16.03.mp4

[Wellitsabhi]

applied external css on <Withfooter/> ,
on small screen, it will appear above breadcrumb. otherwise working noramlly.
UI looks good too.

fix.footer.mp4

[Wellitsabhi]

@bmuenzenmeyer @abizek @canerakdas
Can you please review my latest commit to consider it for merge.
Let me know if it needs any changes.
Thanks.

[abizek]

LGTM

outdated

[ovflowd]

@bmuenzenmeyer I dismissed your review, but feel free to do a re-review 🙏

[ovflowd]

Hmmm, the footer is still sticky, and we don't really want that as it means the overall content available for the page itself is diminished...

[Wellitsabhi]

@ovflowd which layout will be good? (below)

1. height- 100vh ( has better responsivity in medium devices too)

Node.js.About.Node.js.-.Google.Chrome.2024-06-22.09-31-12.mp4

2. height -100%

Node.js.About.Node.js.-.Google.Chrome.2024-06-22.09-42-03.mp4

I hope it address sticky issue.

[bmuenzenmeyer]

This PR will need to be rebased or recreated now that #6850 merged.

[Wellitsabhi]

I shall create new PR.
But it would be great if someone can suggest which layout should i follow