Boost Dash Courses Overview on Tablet Nav - Overlay

Boost Dash Courses Overview on Tablet Nav - Overlay

by Murray Lohoar -
Number of replies: 3

When using Boost and viewing on a Ipad, the navigation drawer 'pushes' the content in order to be displayed. On a smaller phone screen it overlays the content of the page.

The block 'My Courses' which displays summary active course information gets crushed in a manner such that the layout breaks.  I'm trying to change the breakpoint of how the nav drawer 'pushes' or 'overlay' the content of the page.

I'd like the navigation drawer to overlay the content rather than push when displayed on a tablet sized viewport.  Does anyone know where this breakpoint is set as I can't work it out!

Latest version of everything.

Thanks


Average of ratings: -
In reply to Murray Lohoar

Re: Boost Dash Courses Overview on Tablet Nav - Overlay

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

 I am not sure but I suspect you can modify the CSS in the SCSS files.

For example the SCSS in this link is how the drawer is styled.

https://github.com/moodle/moodle/blob/master/theme/boost/scss/moodle/drawer.scss

I'm not at my computer I'm so cannot test it!

Hope it helps though?

Mary

Average of ratings: -
In reply to Mary Evans

Re: Boost Dash Courses Overview on Tablet Nav - Overlay

by Murray Lohoar -
Thanks for that.  I'd seen this, but I can't see where the breakpoint between desktop and tablet is set.  I suspect that there is an @media setting somewhere in the scss/css but I can't find it! I looked at the javascript also:
But I'm not sure what I should be changing...
Thanks
Murray
Average of ratings: -
In reply to Murray Lohoar

Re: Boost Dash Courses Overview on Tablet Nav - Overlay

by Rick Jerz -
Picture of Particularly helpful Moodlers Picture of Testers

Interesting.  By reducing the width of my browser I find the point to be at 768 pixels.

So, if when you turn your iPad to landscape orientation, you probably get a different effect than turning it to portrait orientation.  Does it?

And this situation also changes depending upon the size of the iPad that the user has.  The "sliding" behavior is what I think most people would want when viewing moodle on their computer, so I don't think you want to always overlay, do you?  And finding that sweat point, whether it is 768, 640, 100, 1024, will always still present the situation based upon all the varieties of screen sizes.  

Hmmm, my suggestion is to not worry about the current setting.

Average of ratings: -