More Theme Reports text overflowing

More Theme Reports text overflowing

by Jeff Mitchell -
Number of replies: 11

I have an issue where the Activity Completion and Course Completion report pages do not display correctly (Course Administration --> Reports --> Course Completion etc.). Due to the number of activities, the content area does not expand far enough to the right for each item to be seen clearly ('1. Course Completion' in the screenshot). Ideally I would like the white background of the central content area to extend the width of the columns, as it does correctly for the Grader Report (shown as '2. Grades' in the screenshot).

Is there a setting I can change to achieve this, or a piece of CSS code I can place into the custom CSS box for the theme?

We are using Moodle 3.1.6.

The theme is More build version 2016052300.

Any help would be appreciated.

Attachment Overflow Issue.jpg
Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

by Jeff Mitchell -

Does anyone have a suggestion for this? I tried changing the width of the central area but this made every page scroll too far and wasn't a suitable change. If I could get the behaviour of the Course Completion page to mirror that of the Grades page it would be great.

Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

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

Have you tried using the Clean theme? If not then please try it and tell me if the problem is still present?

To do this quickly, with little interuption to your site, just put a tick in the box for "Allow theme change in URL" in

 Site Administration > Appearance > Themes > Theme settings

This is activated by adding either

?theme=clean

or

&theme=clean

after your site url depending on if you are in a course or not

Normal pages use ?theme=clean

Incourse pages use &theme=clean

Please let me know what changes you see if any?

Thanks

Mary

Average of ratings: -
In reply to Mary Evans

Re: More Theme Reports text overflowing

by Jeff Mitchell -

Hi Mary,

Thanks for your reply. I tried the Clean theme and it worked well. As the background is white the columns are easy to read across the entire range.

Unfortunately I need to keep the blue background (due to the organisation's branding policies).

Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

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

Hi, 

In that case it looks like the width of the page is restricted in some way and only noticeable when the dark colour of the body background peeps through.

What we need to find out is the CSS id or class selector of that page.

Can you tell me the url of the page after your site name? This will help with finding a CSS fix for this.

Thanks

Mary

Average of ratings: -
In reply to Mary Evans

Re: More Theme Reports text overflowing

by Jeff Mitchell -

There are two pages that it presents on:

Activity completion: .../report/progress/index.php?course=92

Course completion: .../report/completion/index.php?course=92

Thanks!

Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

by Jeff Mitchell -

If it is any help, it also presents on the output page from the Ad-hoc database queries page:

...report/customsql/view.php?id=2

Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

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

Hi,

Sorry for the delay...it's been a bit of a nightmare, as my server would not allow me to view the More theme.

I think I have solved the problem:

Try adding this to the Custom CSS section of the More settings page...and let me know if it works?

#page-report-progress-index table#completion-progress.generaltable {
    max-width: 2000px;
}

Average of ratings: -
In reply to Mary Evans

Re: More Theme Reports text overflowing

by Jeff Mitchell -

Hi Mary,

Thanks for your continued help with this. I tried the code but it did not work. The issue seems to be that the table background is limited by the width of the screen - it does not scroll with the rest of the text. If I move from a larger screen to a smaller screen, less of the assessments have the white background behind them, as the white table background covers less horizontal distance (always limited to the size of the screen).

Average of ratings: -
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

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

Hi Jeff,

I've been testing this and found that it was hard to find a solution at first, as I had to set up a good number of activities to get anywhere near the number of columns you have. However I cheated a little and copied some HTML and eventually forced the table to expand over the edge of the page and out into the side which I had coloured using the More b/ground setting.

This seems to work with the CSS selector classes that are in place:

table.flexible, .generaltable { background-color: #ffffff;}
It should work for all the different pages too...at least I hope so!!!
Hope it helps?
Mary
Average of ratings: -
In reply to Mary Evans

Re: More Theme Reports text overflowing

by Jeff Mitchell -

Hi Mary, that solution worked a treat, and on each page that I needed. Thanks a lot for this - it will make the back end of the site much easier for our tutors to use and prevent any more grey hairs on my part!

Thanks again.

Average of ratings: Useful (1)
In reply to Jeff Mitchell

Re: More Theme Reports text overflowing

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

Great stuff...glad it worked!

Cheers

Cheers

Mary

Average of ratings: -