Add Visual Indent Option in `no_code` Layout

[SybelBlue]

When using no_code layout, pre-text and post-text are often provided.

In order to make the indentation of the solution appear visually coherent, it would be convenient to provide a visual-indent="n" attribute on the element, that simply nudges the tray n character widths to the right relative to pretext.

Visual Example

We want to emulate the experience of writing inline with the context, like so:

# this is our parsons problem

describe GiftCard do             # pre-text
    context "#withdraw" do       #
        +--------------+ 
>>>>>>>>| solution box |         # box with visual-indent="8"
        +--------------+
    end                          # post-text
end                              # 

not

describe GiftCard do
    context "#withdraw" do
+--------------+
| solution box |                # poorly-aligned, confusing, lame
+--------------+
    end
end