I’m working on my first production deployment and want to know how I can have a full screen learner experience like so many other platforms have. A sidebar on the left, all content on the right. Distraction free learning experience. I have searched these forums and the greater web but can’t seem to find anything related to this kind of layout. Does this mean custom learning microfrontend?
I have also noticed that Course Units are not displayed in the navigation on the front end at all. I have done some searching and it looks like for some reason, units were removed from navigation about 3 or 4 years ago?
I found this post. But that looks like i’m going to have to modify core just to get this feature back? I also found this proposal but can’t find any follow up.
How can I enhance the learner experience for the distraction free experience with full course outlines including sections, sub-sections and units? I need this because in the future, I will be developing integrated labs to our platform and need the full screen aspect.
Thanks in advance,
If i’m in the wrong location, please move to the right one. Thanks mods.
Hello and welcome, @digitalchild! Great questions. We developed a sidebar navigation experience based on this proposal you linked with the Redwood Release (this experience was default OFF in the Redwood Release via the courseware.enable_navigation_sidebar in the django admin), and then it was defaulted to ON in the subsequent Sumac Release.
This newer sidebar experience allows the learner to collapse the navigation and it does show Section, Subsection, and Unit names within it along with indicators for the type of material featured in each unit and learner progress/completion of each course element. Please note: Site operators using brand packages that override the max-width for .container-xl have reported an issue with sidebar navigation taking up half of the page and making course content appear narrower than it should be when the sidebar is expanded. The default max-width is 1600px and accommodates the space needed by the sidebar. As a result, the fix for this breaking change is to make sure your brand package values are wide enough.
See screenshots below that show you what this looks like expanded and collapsed.
As a PM for the Open edX project, I’m curious if this gets you close to the experience you need or if there are express needs to give the learner access to a more full-screen experience or if there are specific tweaks to this experience you are looking to see? Always looking for feedback!
Edited to add: I did see some talk of a “distraction-free” learner experience in slack a while back, so I’ve pinged the parties involved to see where that work is at. I’ll circle back if it turns out this was developed/is available.
@Chelsea_Rathbun I’ve enabled the flag and its a good start. I think we’ll need to adjust the style and main container width to make it work for our needs.
The reason for the full screen requirement is that we will be embedding an external system in an iframe so we’ll need as much space as possible.