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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Mobile Sidebar appears on desktop site #12531

Closed
Findus23 opened this issue Feb 2, 2018 · 6 comments 路 Fixed by #13135
Closed

Mobile Sidebar appears on desktop site #12531

Findus23 opened this issue Feb 2, 2018 · 6 comments 路 Fixed by #13135
Labels
c: Design / UI For issues that impact Matomo's user interface or the design overall. Help wanted Beginner friendly issues or issues where we'd highly appreciate community's help and involvement. not-in-changelog For issues or pull requests that should not be included in our release changelog on matomo.org.

Comments

@Findus23
Copy link
Member

Findus23 commented Feb 2, 2018 •
edited

Seems like I am bad at hitting buttons 馃槃
When one clicks right of the login button (e.g. on demo.matomo.org) on the desktop page the mobile sidebar appears once. (Tested in firefox and chromium)
gif
(Would be nice if one could upload videos to github, converting a 37KB video to a 4.7 MB gif is quite inefficient)
@Findus23 Findus23 added Help wanted Beginner friendly issues or issues where we'd highly appreciate community's help and involvement. c: Design / UI For issues that impact Matomo's user interface or the design overall. labels Feb 2, 2018
@sgiehl
Copy link
Member

sgiehl commented Feb 2, 2018

I guess that area is meant for touch devices so the menu opens when swiping from the side. Are you using a device with touch screen?

@Findus23
Copy link
Member Author

Findus23 commented Feb 2, 2018

No,
It鈥檚 a normal notebook without a touchscreen.
I haven鈥檛 looked into what is causing it.

@tsteur
Copy link
Member

tsteur commented Feb 3, 2018

It is likely a builtin jquery/materializecss feature

@justju justju mentioned this issue Jul 4, 2018
Merged
@justju
Copy link
Contributor

justju commented Jul 4, 2018

Made a simple PR.

But I think there is still a problem remaining.
The used side-nav-component from Materialize adds a 10px wide <div class='drag-target'> to the <body>. One on the left for mobile-left-menu and on one the right for mobile-top-menu. This renders both 10px areas unclickable.

10px of the Logout-Button are unclickable and 10px of the left sidebar. (Red bar in the screenshots)
image

I am just not sure about what is the best way to fix it:

  1. Materialize seems to use z-index. But then you would have to add position: relative, absolute or fixed. And should that be done in coreHome.less?
  2. One could also add the media-query from hide-on-large-only to drag-target in the CSS (coreHome.less ?) like:
@media only screen and (min-width: 993px) {
  .drag-target{
    display: none !important;
  }
}
  1. Add the hide-on-large-only via JS (corehome.js ?)
  2. Wait for the update of Materialize and hope it'll be fixed.
    ...

@tsteur
Copy link
Member

tsteur commented Jul 4, 2018

Point 2 seems best to me personally.

@justju
Copy link
Contributor

justju commented Jul 6, 2018

I updated the PR in a Point 2 like manner.

@diosmosis diosmosis added the not-in-changelog For issues or pull requests that should not be included in our release changelog on matomo.org. label Jul 24, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
c: Design / UI For issues that impact Matomo's user interface or the design overall. Help wanted Beginner friendly issues or issues where we'd highly appreciate community's help and involvement. not-in-changelog For issues or pull requests that should not be included in our release changelog on matomo.org.
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Hide Mobile Sidebar on desktop site justju/matomo
5 participants
@diosmosis @tsteur @sgiehl @Findus23 @justju