Assignment grade view - header collapsed

[hartmut1s]

Hi Gareth,

I appreciate that you work on Shoehorn 3.1 and I hope you will be able to solve a problem that you already solved in Essential (see forum post on July 29 - https://moodle.org/mod/forum/discuss.php?d=334985#p1356021). I just downloaded the Shoehorn 3.1 beta version and installed it at a test site. When I go to an assignment > Grades (http://127.0.0.1/moodle/mod/assign/view.php?id=1155&action=grader), I cannot see the details of the header when the zoom is 100%. When the zoom is 300%, the header is readable. Below are two screenshots, the first with Shoehorn, the second with Clean.

With kind regards, Hartmut

[gjb2048]

Hi Hartmut,

Thanks, investigating....

Gareth

[gjb2048]

Odd, as applied https://github.com/bmbrands/theme_bootstrap/commit/c1159b6d19232802f6ee9462c8089e1e85c57a05

[gjb2048]

https://github.com/gjb2048/moodle-theme_essential/commit/e39f92fdcb08159d051c8cb932a6b9a6bb569672 pertains to Essential's removal of mod assign styles, this does not happen in Shoehorn.

[hartmut1s]

Thanks for working on the assignment grader issue in Shoehorn. If I reduce the screen size significantly, I can see the complete header. If I increase the screen size, the header will be collapsed again.

[gjb2048]

Thanks Harmut, useful information.

[gjb2048]

Ok, this sort of helps, but means everything inline:

@media (max-width: 767px) .path-mod-assign [data-region="grading-navigation-panel"], .path-mod-assign [data-region="review-panel"], .path-mod-assign [data-region="grade-panel"], .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"], .path-mod-assign [data-region="grade-actions-panel"] { position: inherit; width: 100%; top: 0; left: 0; right: auto; overflow: auto; height: auto; margin-bottom: 1em; }

[hartmut1s]

Thanks for the suggestion. I added your CSS in Custom CSS without any other code, purged cache and still saw the collapsed header in assignment grader. When I inspected the div's, position switches from inherit to absolute. This also happens when I used position: inherit !important; It is later overridden.

Then I left out the media and tried

.path-mod-assign [data-region="grading-navigation-panel"], .path-mod-assign [data-region="review-panel"], .path-mod-assign [data-region="grade-panel"], .path-mod-assign [data-region="review-panel"].collapsed + [data-region="grade-panel"], .path-mod-assign [data-region="grade-actions-panel"] { position: relative; width: 100%; top: 0; left: 0; right: auto; overflow: auto; height: auto; margin-bottom: 1em; }

Now I can see the complete header but I lost the scrollbar and the text box for the grade moved too much to the right (see screenshot)

[gjb2048]

Hi Hartmut,

Oh, that was not a suggested fix, just me making notes about the problem.

G

[gjb2048]

Ouch, the core code is HORRIBLE.

[gjb2048]

Hi Hartmut,

I think I've fixed (as well as can be) in https://github.com/gjb2048/moodle-theme_shoehorn/commit/e0e3e9d16ddf98207347c6f7298a497fdef03526.

G

[hartmut1s]

Hi Gareth,

You fixed this bug. Thanks a lot for it. I am glad that the grader view of assignments is now correct in Shoehorn. Just in time as we plan to upgrade to Moodle 3.1 in a week. Yes, I know Shoehorn is still in beta but it looks good and I prefer to offer the same feel and look to staff & faculty with Moodle 3.1.

Thanks again for maintaining the theme Shoehorn. Hartmut

[gjb2048]

Hi Hartmut,

Now official 'release candidate' version: https://moodle.org/mod/forum/discuss.php?d=337719

Cheers,

Gareth