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.

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

Add a "back to top" button on pages #12194

Closed
3 tasks
corwintines opened this issue Feb 15, 2024 · 12 comments · Fixed by #13058
Closed
3 tasks

Add a "back to top" button on pages #12194

corwintines opened this issue Feb 15, 2024 · 12 comments · Fixed by #13058
Assignees
Labels
design required 🎨 This involves design changes design All the issues related to design should use this tag feature ✨ This is enhancing something existing or creating something new

Comments

@corwintines
Copy link
Member

Is your feature request related to a problem? Please describe.

Some pages on ethereum.org are very long, and could benefit from a "back to top" button to help reset the user

Describe the solution you'd like

At the bottom of the page (or a button that floats at some point), we add a back to top button that takes the user to the top of the page.

  • Needs design first

Describe alternatives you've considered

Not having this button at all, may not be necessary as all nav is still accessible from wherever you are in the content generally.

Additional context

No response

Would you like to work on this issue?

  • Yes
  • No
@corwintines corwintines added feature ✨ This is enhancing something existing or creating something new design required 🎨 This involves design changes design All the issues related to design should use this tag labels Feb 15, 2024
@github-actions github-actions bot added the needs triage 📥 This issue needs triaged before being worked on label Feb 15, 2024
@alex1092
Copy link
Contributor

Once designs are finished I'd be happy to pick this up

@cypherspeare
Copy link
Contributor

Would be happy to help with the design and work on the feature.

@wackerow
Copy link
Member

Hey folks! Sounds like we need design first, then the dev implementation... @cypherspeare you mentioned wanting to help with design... I can assign you here, and will also assign @nloureiro to help out internally. For design contributions, it can be helpful to hop into our Discord and go to the 💅|ux-ui-design channel to collaborate or get feedback.

If you're helping with design it's probably easier to just let you do the dev implementation too as you expressed interest in. Would work with Nuno on design stuff first, but then feel free to put a PR up for this when that is complete. If you'd rather let @alex1092 jump in at that point to contribute just let us know here! Otherwise @alex1092, we'll try to get you another one... Good First Issues labels are always a decent place to start =)

@wackerow wackerow removed the needs triage 📥 This issue needs triaged before being worked on label Mar 21, 2024
@nloureiro
Copy link
Contributor

Hey @cypherspeare

Let's do it! I am happy to assist you on the design side.

My take on this would be to try to fit a button/link on the footer so that the same behavior can be achieved on all the pages.

What do you think? I'm open to other ideas. Feel free to use this issue to keep the conversation going.

Are you comfortable working on Figma? If not al good, just post here your design ideas, an we can follow from it

If you want to use Figma, here is the link to our latest changes on the footer and it as the design system in it. Use it or copy it if you think it's useful

Thank you! I am looking forward to seeing your ideas.

@alex1092
Copy link
Contributor

alex1092 commented Mar 22, 2024 via email

@nloureiro
Copy link
Contributor

@cypherspeare @alex1092

My idea was to go with something like this, not sure what´s on the left and what´s on the right, but overall is adding a button on the footer.

any other ideas?

Screen Shot 2024-04-01 04 48 18 PM
Screen Shot 2024-04-01 04 48 10 PM

figma link: https://www.figma.com/file/cKWwsQVF762HM7IuSnH8xn/Footer-links-update?type=design&node-id=110%3A1413&mode=design&t=QlqfZecVjoZBd4fF-1

@alex1092
Copy link
Contributor

alex1092 commented Apr 2, 2024

Amazing work, I'm wondering if the return to top should be floating and not fixed to the footer though, this will allow users to return the top regardless of page position

@nloureiro
Copy link
Contributor

Amazing work, I'm wondering if the return to top should be floating and not fixed to the footer though, this will allow users to return the top regardless of page position

I've considered the floating, but we already have the feedback widget floating and think it's more important in terms of function than this one.

The footer would be a simpler way to make it accessible on all pages and consistent.

The placement of the button is still open, I did an early exploration of it but open to ideas.

@nloureiro
Copy link
Contributor

@alex1092 hello :) any update on this issue?

@alex1092
Copy link
Contributor

Is this work ready for dev?

@nloureiro
Copy link
Contributor

Is this work ready for dev?

Yes, follow that Figma file.

let me know if you have any questions. Thank you

@alex1092
Copy link
Contributor

alex1092 commented May 6, 2024

Awaiting Reviews

#12906

alex1092 pushed a commit to alex1092/ethereum-org-website that referenced this issue May 28, 2024
alex1092 pushed a commit to alex1092/ethereum-org-website that referenced this issue May 28, 2024
corwintines added a commit that referenced this issue May 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design required 🎨 This involves design changes design All the issues related to design should use this tag feature ✨ This is enhancing something existing or creating something new
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants