search

moodle-an-hochschulen / moodle-local_boostnavigation

Moodle plugin which tries to overcome some fixed appearance behaviours of Boost's nav drawer in a clean way
GNU General Public License v3.0
39 stars 28 forks source link

data-hidden "abuse" preventing hidden courses from using attribute #48

Closed ghost closed 4 years ago

ghost commented 4 years ago

This issue is related to issue #36 in the sense that the way the data-hidden attribute is being used, when 'Collapse node "My Courses"' is enabled, it is superseding the value given to it when courses are hidden (made not visible in Moodle). For example - When Collapse node "My Courses" is disabled - this is the view in the nav-drawer. Courses C1 and C2 are hidden.

collapse_disabled_view

This can be confirmed in the inspector: collapse_disabled_data-hidden_value

When Collapse node "My Courses" is enabled, though, when My Courses is un-collapsed the data-hidden value is set to 0 instead of remaining as 1. collapse_enabled_data-hidden_value

I would like to use the data-hidden attribute to target courses under My Courses to add CSS so that hidden courses are more obvious to teachers as seen here. This works when the node is not collapsible. collapse_disabled_view2

CSS code - /format hidden courses in my courses in menu - only works if not collapsible/

nav-drawer [data-hidden="1"]:not([data-key="localboostnavigationcustomcourseusersediting"]):not([data-key="coursehome"]):not([data-key="participants"]):not([data-key="grades"]):not([data-key="badgesview"])

{ font-style:italic; font-weight:300; }

nav-drawer [data-hidden="1"]:not([data-key="localboostnavigationcustomcourseusersediting"]):not([data-key="coursehome"]):not([data-key="participants"]):not([data-key="grades"]):not([data-key="badgesview"])

{.media-left .icon { font-size:1pt; } }

nav-drawer [data-hidden="1"]:not([data-key="localboostnavigationcustomcourseusersediting"]):not([data-key="coursehome"]):not([data-key="participants"]):not([data-key="grades"]):not([data-key="badgesview"])

{.media-left { display:inline-block; background-image:url("eyeslash.png"); background-size: 20px 20px; background-repeat:no-repeat; } }

Is there a way that I can make this work when the node is collapsible? Any help you can provide would be greatly appreciated. Thank you in advance.

This is for Moodle 3.6.3+ (Build: 20190410) with Boost theme and using your plugin V3.6-r7 (2019061500).

abias commented 4 years ago

Thank you @daniel-hefley for raising this issue.

When the collapsing feature for this plugin was written, (ab)using the data-hidden attribute seemed to be the most sensible approach as this attribute is about hiding courses. At that time and still today, Moodle core did not process this attribute in the nav drawer for styling purposes like you want to do now and which I fully support from a UX point of view.

I will try to think about workarounds during our 3.8 release, but I am unsure if I will come to a better solution without abusing something else and without hacking at least one line in Moodle core.

If you find a solution in the meantime, don't hesitate to let me know.

Cheers, Alex

abias commented 4 years ago

I am happy to report today that this issue has finally been resolved in https://github.com/moodleuulm/moodle-local_boostnavigation/commit/f3868412c0e65b63d419882b66b45b10cebfa46b during the work on #49 in a clean and future-proof way. All abuse of existing data-* attributes in Moodle core has been removed. An official 3.8 version of this plugin will be pushed within the next few days to the Moodle plugins repo as well.

Cheers, Alex