Fix a few layout issues in Step Builder

[bradenmacdonald]

This PR fixes the following issues:

• In some Step Builder components, you were unable to change the order of child blocks in Studio (drag-to-reorder was broken). This is due to Studio using a selector that requires the child XBlocks to be direct children of the parent XBlock, with no intermediate elements such as a DIV
• Fixed a minor issue causing mentoring v2 blocks in legacy assessment mode to be broken when tested in Studio.
• Fixed the layout issues in MCKIN-3626
• Added a feature so you can move messages below the "Try Again" button if you want to. To do so, simply do not add a "Per Question Review Tips" block to the review step.

Screenshot of block after fixing layout issues:

Screenshot of block with no per question review step configured:

[itsjeyd]

@bradenmacdonald Nit: I'd probably go for has_per_question_feedback_block here. It's clear from context what q stands for, but since there aren't any abbreviations in the surrounding code, this sticks out, kind of :)

[itsjeyd]

@bradenmacdonald I tested most of the points that this is supposed to address. Here are my comments:

• Drag and drop reordering works like a charm
• Studio issues for Problem Builder blocks in assessment mode: Wasn't sure what to look for here, so this remains to be tested
• Layout issues from MCKIN-3626: Some of the things listed in the description don't seem to be fixed for me:
  • Alignment of bullets required. (assess-1.png)
  • Eliminate spaces between new lines. (assess-1.png)
  • Make the text for the sentence bold. (assess-1.png)
  • Icon for Incorrect needs to be aligned. This issue is on review final grade state as well. (assess-1.png)
  • Text line "You scored 100% on this assessment" need to be aligned. (assess-2.png)
  • Space required above the text line. Image attached for reference (assess-2.png)
• Messages below "Try again" button: ✅

Code looks good!

[itsjeyd]

@bradenmacdonald Verified that it's possible to edit Problem Builder and question children when block is set to assessment mode.

[bradenmacdonald]

@itsjeyd I figured out why you were not seeing some of my fixes: You need to use the "apros" theme. To do so, add the following to ~/lms.env.json on your solutions devstack:

    "XBLOCK_SETTINGS": {
        "mentoring": {
            "theme": {
                "package": "problem_builder",
                "locations": ["public/themes/apros.css"]
            }
        }
    }

Please test again!

Also: Based on Xavier's points on MCKIN-3626 I have removed the change that put the per-question review tips underneath the "Try Again" button.

[itsjeyd]

@bradenmacdonald Thanks, changing the theme fixed the remaining issues for me :) 👍