[Pricing] Make Tier Comparison Header Sticky
Current Behavior
Site visitors that want to compare features offered between subscription tiers, visit the "Compare All Features" section of the https://layer5.io/pricing page.
Desired Behavior
While examining the checkmarks and x's in the Compare All Features section, when users scroll down the page, past the names of the subscription tiers and have a hard time recalling which checkmark and which "x" are associated with which subscription tier.
Screenshots / Mockups
Implementation
Make the subscription tier table header sticky under the "Compare All Features" section.
Acceptance Tests
Users can see the subscription tier names at the top of the page.
Contributor Resources and Handbook
The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.
- 📚 See contributing instructions.
- 🎨 Wireframes and designs for Layer5 site in Figma (open invite)
- 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack.
Join the Layer5 Community by submitting your community member form.
@leecalcote Can I work on this issue?
Sounds great. , @Ajay-singh1
@leecalcote , can you assign this issue to me?
@Ajay-singh1 how are things progressing here?
@leecalcote I have raised a PR! I wanted feedback if it looks good or need some changes , I need to make some adjustments with the table cells padding and margin so that the UI looks good as their was some problem with gatsby I cannot see the site locally so... I have marked this as a draft until then.
hey @leecalcote kindly assign this issue to me in past i also contribute to this repo i also have local setup also of this repo also
@eyeaadil Would you like to work on this issue?Also can you confirm if you have setup the local development environment?
@eyeaadil Would you like to work on this issue?Also can you confirm if you have setup the local development environment?
Yes, i would like to work in this issue and I setup the local development environment.
Okay @eyeaadil!
@Ajay-singh1, you’ve tossed in the towel on your attempt to complete this, correct?
@krishkumar84, how are you progressing?
@eyeaadil, I recall you asking to be assigned too many, many different issues. I don’t recall any of your PR’s being successful. More self-study needed before volunteering again.
hey @leecalcote i raised the pr for this issue couple of days ago #6138 kindly review this
@leecalcote No! Never.I will take this up anytime.Waiting for the Gatsby fix!!
@leecalcote @Ajay-singh1 can you please review the my above PR?
@vr-varad can you assign this issue to me ?
Thanks @Rajesh-Nagarajan-11 for taking up this issue.
@vr-varad @Rajesh-Nagarajan-11 can i contribute to this issue, i have seen something similar, in using table for tabulating, it equates to compromise between scroll and sticky headers. If sticky header is required then horizonatal scrolling on thinner width will be compromised. Only working solution i found was tabulating using divs , compromisisng seo. Could I be assigned this issue.?
@priyanshu4999 We can't compromise Horizontal scrolling as well , it needed for mobile view
@Rajesh-Nagarajan-11 , Yes thats what i thought, then recreating tabulation with divs was the solution that worked for both scrolling and sticky, i think there is a whole disscussion regarding same on CSS-tricks. Do tell if you need help or come up with different solution.!!
@priyanshu4999 You can take over this issue and work it on , @vr-varad Unassign me and assign this to @priyanshu4999 !
@priyanshu4999 Its your's.