Replace all uses of the inline style syntax with alternatives

[Hamms]

CurriculumBuilder supports a system of using markdown to define arbitrary attributes on rendered elements. This is obviously something we can't support for security reasons, but fortunately it seems like the curriculum authors were mostly using it to add styles to images.

In this PR, I identify all the places in the content copied over from CB where we are attempting to use this unsupported syntax, and in each case I replace the syntax with some alternative that we do support. The use cases generally fall into one of four categories:

1. Images being sized up, to support displaying them to students as instructional aids.
2. Images being sized down, to help them work better as inline visual aids
3. Images being floated, also to help them work better as inline visual aids
4. A border being added to slides in tables

The solutions applied are as follows:

1. Replace the inline image with an expandable thumbnail, and update the instructions to specify that the teacher can click on the thumbnail to view the full image
2. Image was manually resized in an image editor
3. I used our existing divclass syntax to wrap the images in appropriate Bootstrap class for floating
4. I added some CSS to style all slides in all tables in all lesson plans automatically.

Testing story

Most changes were made through the levelbuilder interface, and all changes were visually verified.

Reviewer Checklist:

• Tests provide adequate coverage
• Privacy and Security impacts have been assessed
• Code is well-commented
• New features are translatable or updates will not break translations
• Relevant documentation has been added or updated
• User impact is well-understood and desirable
• Pull Request is labeled appropriately
• Follow-up work items (including potential tech debt) are tracked and linked

[davidsbailey]

LGTM!

[davidsbailey]

this selector looks like it will affect the right things for now, but makes me a little nervous that it might start adding styles unexpectedly if something changed in the future (e.g. we add an image somewhere in our resources editor table on the lesson edit page). one idea for the future would be to add a css classname the outer divs of our react components which render markdown, and then scope any CSS styles specific to markdown to only take effect in divs with this classname.

[Hamms]

yeah, that sounds great! I could probably do that as a quick follow-up work item tomorrow