Improved the layout of "subject specific guides" block in Timeline.

[PR4NJ41]

What this PR does

Improved the layout of "subject specific guides" block in Timeline.

This is the other method which adds div with classname on block creation. This is only added to the handout section. Hence this will be added to only newly created courses.

fixes #5707

Screenshots

Before:

After:

[PR4NJ41]

@ragesoss Please review this.

[PR4NJ41]

@ragesoss this might create unwanted styling changes. Also Some styling like align center of the edit menu won't work.

Before:

After:

[ragesoss]

Hmm... I actually like the bullet styling better. I don't think there is much if any custom content that uses the center formatting. I'm okay with some minor changes, as long as it doesn't break anything in a noticeable way.

[PR4NJ41]

I don't think there is much if any custom content that uses the center formatting.

By center I mean the formatting as shown in the video.

Changes.mp4

[PR4NJ41]

@ragesoss I have made the suggested changes. Please review. Thanks!

[ragesoss]

By center I mean the formatting as shown in the video.

That's what I thought you meant. I think this is fine. I think you can remove the aligncenter center option by editing the tinyMCE config in text_area_input.jsx.

[PR4NJ41]

@ragesoss I have made the changes.

[ragesoss]

Please update the screenshots to illustrate all changes (including the change to the text editor), and then this should be ready to go.

[PR4NJ41]

@ragesoss I have updated the screenshots. Thanks!