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

Bottom of the user menu goes out of screen #149

Open
gikf opened this issue Dec 28, 2024 · 5 comments · May be fixed by #147
Open

Bottom of the user menu goes out of screen #149

gikf opened this issue Dec 28, 2024 · 5 comments · May be fixed by #147

Comments

@gikf
Copy link
Member

gikf commented Dec 28, 2024

Describe the Issue

The user menu is not fully visible. The buttons for scrolling it down and dismiss the notifications is out of the screen. It's not possible to scroll to them.

Affected Page

https://forum.freecodecamp.org

Steps to Reproduce

  1. Go to https://forum.freecodecamp.org
  2. Log in
  3. Press the user icon at the right top
  4. Button to scroll panel and/or dismiss notifications is not visible.

Expected behavior

Button to scroll panel and/or dismiss notifications button should be visible when user menu is opened.

Screenshots

Currently
Expected - bottom of the panel with button(s) is visible

System

Checked both on chromium based browser and on firefox.

Additional context

Computed height of the #quick-access-all-notifications shows 1859.25px. The second screen from above was done after modifying that height.
@a2937
Copy link
Member

a2937 commented Dec 30, 2024

Do we know which component this is from? I had trouble locating it in the main Discourse repo.

@gikf
Copy link
Member Author

gikf commented Dec 31, 2024

I'm not familiar with Discourse structure, but it appears to be the user-menu - https://github.com/discourse/discourse/tree/25351bdb8e5a50146093de4551b880b76612e002/app/assets/javascripts/discourse/app/components/user-menu

@a2937
Copy link
Member

a2937 commented Dec 31, 2024

Thanks to the Discourse forum, I have reason to believe that it's our forum theme causing the issue. I found this out using Discourse's safe mode.

@gikf
Copy link
Member Author

gikf commented Dec 31, 2024

I was comparing the two, this lead me to the

.menu-panel.drop-down {
  max-height: calc(100dvh - var(--header-offset) - 1em);
}

With --header-offset not defined in the custom theme results are like in the first post. However I'm unable to locate where default theme has it defined.

@a2937
Copy link
Member

a2937 commented Jan 1, 2025 •
edited
Loading

It appears to be set here.

https://github.com/discourse/discourse/blob/ce7a14104b50c65a3fd40b88887d2f8a53d73ffa/app/assets/javascripts/discourse/app/components/glimmer-site-header.gjs#L118

@a2937 a2937 linked a pull request Jan 2, 2025 that will close this issue
Open
2 tasks
@naomi-lgbt naomi-lgbt transferred this issue from freeCodeCamp/freeCodeCamp Jan 8, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

chore(ui): add default-offset-value a2937/FreeCodeCamp-forum-theme
2 participants
@a2937 @gikf