MDL-60020 | Missing custom CSS classes (HTML Block) in Boost?

MDL-60020 | Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Anthony Rimmer ()
Liczba odpowiedzi: 15

Hi All, 

I haven't been able to find anyone else with a similar problem, but I have tested this on the Moodle Demo site and it appears to be the same. Forgive me if this has already been discussed.

Essentially, with Boost, HTML blocks do not appear to pull through custom CSS classes added in the block's setting page, despite the administration setting for allowing additional CSS classes being enabled.

I understand the move towards doing away with blocks, and this may be the reason, but it looks like the block.mustache template file has been set up to take over CSS class definitions, omitting the classes set by the block itself. In the case of the HTML block, this suggests that the additional classes are not included. Inspecting an element in-browser proves it.

I can include the classes again by adding them to the block's context In the core-renderer (boost/classes/output/). However, this includes all classes as defined by the block; block, block_html custom_css. This then duplicates the class definitions unless removed from the block.mustache file.

I suppose the question is whether this is by design, a fault or an oversight on my part?

(Edited by Mary Evans - original submission Monday, 24 July 2017, 12:50 PM)

Średnia ocen: -
W odpowiedzi na Anthony Rimmer

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

Hi,

Can you copy / paste a section of the code you are adding with your custom css classes?

I want to test this as I have a feeling it may be the ATTO Editor that is doing this.

I use the TinyMCE Text Editor as I find it more useful when adding Boostrap code.

If you are using the Default ATTO Editor then try switching to the TinyMCE Editor from the User Menu > Preferences > Editor Preferences

Thanks

Mary

Średnia ocen: -
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Anthony Rimmer ()

Hi Mary, 

Thanks for the reply!

Forgive me, it might have been how I explained it, but I don't think this is related to the text editors. 

The HTML block has the additional setting for CSS classes that are applied to the blocks div element, so I'm not referring to the content of the block itself, but it's general markup.

In boost/classes/output/core_renderer.php the block context is put together around line 330 in the 'block' function and doesn't appear to include the classes as set by each block type. I guess I was looking for something along the lines of $context->classes = $bc->attributes['class']; ??

This would then need to be rendered in the block.mustache template file as {{classes}} if my understanding is correct. By default, the block's class is set and the type is taken from the context as block_{{type}}. 

Anthony


Średnia ocen: -
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Richard Clay ()

Hi Mary / Anthony

I've just hit this problem too and can explain a bit more. The problem occurs when you add a custom CSS class via the configure block page (see below). The class is not applied when the main course page is rendered. The Chrome web inspector confirms this.


Block exmaple


Could be a bug.


Thanks
Richard

Średnia ocen:Useful (1)
W odpowiedzi na Richard Clay

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Anthony Rimmer ()

Hi Richard, 

Thanks for taking this further, I think your screenshot helps illustrate the issue.

I can confirm this is exactly what I am experiencing.

Anthony

Średnia ocen: -
W odpowiedzi na Anthony Rimmer

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

Hi,

I see what you mean.

Can you clarify that this ONLY happens in Boost theme and not Clean or More theme. If so then it is a Boosl theme problem. If not then it is a Block problem and I will move this discussion into the Blocks forum.

I will await your answer...thanks

PS: Can you also tell me the version of Moodle you are discussing?

Mary

Średnia ocen: -
W odpowiedzi na Richard Clay

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

Hi Anthony,

I have just tested this ins a brand new Moodle 3.2 set up on my test server and found that what you are saying is not true. Either I am reading this wrong or I am doing something wrong?

Having already added the HTML block to the Frontpage and enabled the Custom CSS Classes. I added some content and included within that content one of the class selectors I had added to the block.

I created a course and then configured the HTML block to be seen in every page.

I went to the course page and checked to see if the HTML block was on the page, which it was. I then examined the content to see if the list of classes at the bottom of the content settings page was there and it was. I also checked using Web Dev tools and found the class that I had added was there in the soure code too.

So what part am I missing in all of this?

Mary

Średnia ocen: -
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Richard Clay ()

Hi Mary

Please see the video below which highlights the problem. I'm testing using  3.2.2+ (Build: 20170316).


Cheers Richard
Średnia ocen: -
W odpowiedzi na Richard Clay

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: A W ()

Mary,

Can you confirm the CSS classes are added to the block's default class? Can you send a screenshot?

This isn't working for me either.

Thanks,

Alex

Średnia ocen: -
W odpowiedzi na A W

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()
What exactly do you mean by "blocks default class"?
Średnia ocen: -
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: A W ()

Thanks Mary,

On the Additional CSS Classes help "?" it says "Any CSS classes entered here (space delimited) will be appended to the blocks default class" which I take to mean the top level of the block itself, which seems to be borne out by Rich's video showing how the class is added on non Boost themes.

Thanks for raising the bug, we'll see what happens with it uśmiech



Średnia ocen: -
W odpowiedzi na A W

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

Ah...thank AW now I understand. Also thank you for posting that image as I could not read the video, me being partially sighted has its downfall unfortunately.

With a bit if luck I may be able to fix the problem.

Cheers

Mary


Średnia ocen: -
W odpowiedzi na Anthony Rimmer

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

I  have reported this as a BUG in Moodle Tracker 

Please vote for MDL-60020 if you want it to be fixed.

Thanks

Mary

Średnia ocen:Useful (1)
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: David Scotson ()
I think I reported a related issue, it was to do with the way the class names for "fake" blocks, previously code set the extra class, much in the same way as the bug described in this thread, this then got thrown away by the template.

More details here:

https://tracker.moodle.org/browse/MDL-59037

I also found a previous submission of this current bug:

https://tracker.moodle.org/browse/MDL-58315

So one should be closed as a dupe probably.
Średnia ocen: -
W odpowiedzi na David Scotson

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Mary Evans ()

Hi David, 

I saw the MDL-59037 issue when I opened MDL-60020 but did not make the connection. I didn't see the other. thanks for that I'll close that last track issue I created and link back to MDL-58315

Cheers

Mary



Średnia ocen: -
W odpowiedzi na Mary Evans

Re: Missing custom CSS classes (HTML Block) in Boost?

Napisane przez: Anthony Rimmer ()
Apologies for not replying to these messages sooner. 

Richard & A W, thanks for expanding on this. Mary, thanks for posting/relating in the tracker. Apologies for not making it clear in the initial query.

Anthony

Średnia ocen: -